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 s

Answer 1

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 2

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 3

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 4

I found these answers to be more complicated than they needed to be. You can just modify the constraint that is binding the searchBar view and the other view to -1pts so that it overlaps exactly by the height of the searchBar's margin.

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()

Answer 6

I encountered the same situation when I set the statusBar and searchBar translucent. In this situation, I couldn't resolve with the answers written here however I could solve by the following approach.

• put UIVisualEffectView on self.view (view of your VC)
• make custom class of searchBar, which background is transparent
• (also let statusBar transparent)

(swift4 code)

    class TransparentSearchBar: UISearchBar {
        override init(frame: CGRect) {
            super.init(frame: frame)
        }

        required init?(coder aDecoder: NSCoder) {
            fatalError("init(coder:) has not been implemented")
        }

        override func layoutSubviews() {
            super.layoutSubviews()
            makeTransparentBackground()
        }

        private func makeTransparentBackground() {
            for view in self.subviews {
                view.backgroundColor = UIColor.clear
                for subview in view.subviews {
                    if let imageview = subview as? UIImageView {
                        imageview.image = nil
                    }
                }
            }
        }

    }

somewhere in viewDidLoad (statusBar)

    let statusWindow = UIApplication.shared.value(forKey:"statusBarWindow") as! UIView
    let statusBar = statusWindow.subviews[0] as UIView
    statusBar.backgroundColor = UIColor.clear