Remove the 1px border under UISearchBar

Question

I'm having trouble removing that 1px border directly under the UISearchBar view. Now it doesn't look matched up with my done button view. I've tried:

searchBar.layer.borderWidth = 0;
searchBar.layer.shadowOpacity = 0;

But that doesn't seem to be working. Any ideas?

Answer 1

In order to overcome this in Xamarin Forms, you'll need to create a CustomRenderer to the SearchBar class. Like this:

using System;
using Xamarin.Forms.Platform.iOS;
using Xamarin.Forms;
using MyProject.iOS;

[assembly: ExportRenderer(typeof(SearchBar), typeof(CustomSearchBarRenderer))]
namespace MyProject.iOS
{
    public class CustomSearchBarRenderer:SearchBarRenderer
    {
        protected override void OnElementChanged (ElementChangedEventArgs<Xamarin.Forms.SearchBar> e)
        {
            base.OnElementChanged (e);
            if (this.Control == null) return;

            this.Control.BackgroundImage = new UIKit.UIImage ();
        }
    }
}

Answer 2

Nevermind, I just did:

searchBar.layer.borderWidth = 1;
searchBar.layer.borderColor = [[UIColor whiteColor] CGColor];

and it works!

Answer 3

[searchBar setBackgroundImage:[UIImage new]];

Answer 4

For Swift version, tested on iOS9:

searchBar.backgroundImage = UIImage() 

It would show like this: