Close Keyboard when SearchBar.Text is Empty

CarlBartonCarlBarton USInsider, University, Developer Group Leader ✭✭

I know this is going to sound familiar as there have been a number of entries in the forum but none of them address this issue in its entirety.

I have a page with a SearchBar and ListView in a StackLayout.

When you click in the SearchBar the keyboard comes up = Good

If I type in characters and then click Cancel the keyboard goes away = Good

If there are no characters in the SearchBars Text Box there is no way to clear the keyboard.

The canned answer is searchBar.Unfocus() but there is not great place to do this without adding another button which is pretty hokey.

I have seen a good example of a custom renderer for Entry that adds a toolbar and a Done button to the keyboard (in iOS) so you can click it to close the keyboard. That would be okay except SearchBar does not seem to have a Keyboard property to get to it to do this.

I saw an excellent renderer that looked like it would work for Android but I need iOS also.

I have seen some other posts that discuss using a Gesture. I thought that if I put a gesture on the ListView when SearchBar gets focus I could use it to capture a tap and call SearchBar.Unfocus(). I have not been able to get this to work. Here is the parts of my code that do this (sorry in advance for whatever mangling may occur).

// Gesture recognizer
TapGestureRecognizer searchBarTapGestureRecognizer;
searchBarTapGestureRecognizer = new TapGestureRecognizer();
searchBarTapGestureRecognizer.Tapped += (s, e) =>

        searchBar.Focused += (s, e) =>

I can hit a breakpoint on the Add in Focused() event so I know the gesture is added however if I put a breakpoint in the Tapped event of the Gesture it does not fire. It seems to fire the ItemSelected() event as normal.

I was hoping that if I applied a Gesture that I would get that before anything else happened with the control? Maybe I am wrong.

Does anyone have any suggestions on how I can get a more standard operation with a tap off from the search bar or a way to get the Done button on the iOS keyboard when it is shown from a SearchBar?




  • JoaoRutkoskiJoaoRutkoski BRMember ✭✭

    I solved this problem with a Custom Renderer on the SearchBar, that adds a "Done" button on the keyboard itself. This way seems more user friendly to me.

    [assembly: ExportRenderer(typeof(SearchBar), typeof(SearchBarCustomRenderer))]
    namespace YourProject.iOS.CustomRenderer
        public class SearchBarCustomRenderer : SearchBarRenderer
            protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
                base.OnElementPropertyChanged(sender, e);
                var toolbar = new UIToolbar(new RectangleF(0.0f, 0.0f, (float)Control.Frame.Size.Width, 44.0f));
                toolbar.Items = new[]
                        new UIBarButtonItem(UIBarButtonSystemItem.FlexibleSpace),
                        new UIBarButtonItem(UIBarButtonSystemItem.Done, delegate { Control.ResignFirstResponder(); })
                this.Control.InputAccessoryView = toolbar;
Sign In or Register to comment.