Remove border between View and Search Bar

Question

So in Xcode I'm trying to create a seamless search bar. So I'm trying to replicate something like this

Note how the status bar is the same color as the search bar. Now here's the result to my approach.

What I did was add a View to cover up the default status bar with the blue background. Then I added a search bar and changed it's background to blue. For some reason I end up getting a black border between the two, which ruins the "seamless" design. Any ideas on how I can remove the black border in Swift?

Answer 1

For iOS 7+:

searchBar.backgroundImage = UIImage()

Otherwise this will work on all iOS versions:

searchBar.layer.borderWidth = 1
searchBar.layer.borderColor = thatBlueColor.CGColor

Answer 2

Swift 4

searchBar.barTintColor = UIColor.white
searchBar.setBackgroundImage(UIImage.init(), for: UIBarPosition.any, barMetrics: UIBarMetrics.default)

Sample image

Upate Sample code for navigation bar and search bar background color:

Navigation bar color

self.navigationController?.navigationBar.barTintColor = .blue

Search bar color

searchBarProperty.backgroundColor = self.navigationController?.navigationBar.barTintColor

Note : Navigation bar and search bar color must be same.

Sample image with blue navigation bar and blue search bar

Answer 3

In Xcode 8.3 and Swift 3

1. Create an outlet from your search bar to your ViewController (I called mine searchBarOutlet for this example).

2. Below viewDidLoad insert the following.

   self.searchBarOutlet.backgroundImage = UIImage()

You should have the following:

    override func viewDidLoad() {
    super.viewDidLoad()

         self.searchBarOutlet.backgroundImage = UIImage()

When you run your app the lines will be gone (they will still be visible on storyboard).

Answer 4

In my case, beyond the edge of search bar needed to take the edge off also the navigation bar.

C# code:

NavigationController.NavigationBar.ShadowImage = new UIImage();
NavigationController.NavigationBar.SetBackgroundImage (new UIImage (), UIBarMetrics.Default);

Swift code:

self.navigationController.navigationBar.shadowImage = UIImage()
self.navigationController.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)

Answer 5

The best solution to remove top and bottom default borders is:

To set a new empty searchBar background layout in viewDidLoad for example:

searchBar.backgroundImage = UIImage()