How to close the keyboard when an item is selected from the dropdown in the .NET MAUI ComboBox (SfComboBox)?

This article illustrates how to close the keyboard when selecting an item from the dropdown in the .NET MAUI ComboBox. To achieve this, please follow the steps below:

Step 1: Install and Register the CommunityToolKit.Maui

Install the CommunityToolkit.Maui package using the Manage NuGet Packages tool. After installing it, register the UseMauiCommunityToolkit method in the MauiProgram class for proper functionality, as demonstrated in the code sample below.

MauiProgram.cs

using CommunityToolkit.Maui;
using Syncfusion.Maui.Core.Hosting;
using Microsoft.Extensions.Logging;

namespace SfComboBoxSample;

public static class MauiProgram
{
   public static MauiApp CreateMauiApp()
   {
       var builder = MauiApp.CreateBuilder();
       builder
           .UseMauiApp<App>()
           .ConfigureSyncfusionCore()
           .UseMauiCommunityToolkit()
           .ConfigureFonts(fonts =>
           {
               fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
               fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
           });

       #if DEBUG
       builder.Logging.AddDebug();
       #endif

       return builder.Build();
   }
}

Step 2: Create the ComboBox control in the XAML

In the XAML layout, populate the ComboBox with items using ItemSource and invoke the SelectionChanged event.

MainPage.xaml

<StackLayout WidthRequest="300" Spacing="20">
   <inputs:SfComboBox x:Name="comboBox" HeightRequest="40" IsEditable="True" SelectionChanged="comboBox_SelectionChanged" BackgroundColor="White">
       <inputs:SfComboBox.ItemsSource>
           <x:Array Type="{x:Type x:String}">
               <x:String>United States</x:String>
               <x:String>India</x:String>
               <x:String>France</x:String>
               <x:String>Italy</x:String>
               <x:String>Germany</x:String>
               <x:String>China</x:String>
           </x:Array>
       </inputs:SfComboBox.ItemsSource>
   </inputs:SfComboBox>
</StackLayout>

Step 3: Configure the Keyboard Method in the XAML.cs file

Implement the HideKeyboardAsync method from the CommunityToolkit.Maui library within the SelectionChanged event method of SfComboBox. This method aids in closing the keyboard when an item is selected from the dropdown in the .NET MAUI ComboBox, as illustrated in the following code sample.

MainPage.xaml.cs

private async void comboBox_SelectionChanged(object sender, Syncfusion.Maui.Inputs.SelectionChangedEventArgs e)
{
   var inputView = comboBox.Children[1];
   if (KeyboardExtensions.IsSoftKeyboardShowing((ITextInput)inputView))
   {
       await Task.Delay(200);
       await (inputView as Entry).HideKeyboardAsync(default);
   }
}

Output:

Conclusion
I hope you found this guide helpful in learning how to close the keyboard when an item is selected from the dropdown in the .NET MAUI ComboBox.

Refer to our .NET MAUI ComboBox feature tour page for its other groundbreaking feature representations. You can explore our .NET MAUI ComboBox documentation to understand how to present and manipulate data.

Check out our .NET MAUI components from the License and download page for current customers. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI ComboBox and other .NET MAUI components.

Please let us know in the comments section if you have any questions or require clarification. You can also contact us through our support forums,Direct—Trac, or feedback portal. We are always happy to assist you!