---
title: "Introducing the New WinUI 3 ComboBox"
published_at: "2021-10-11T11:00:41+00:00"
modified_at: "2026-02-10T11:16:05+00:00"
url: "https://www.syncfusion.com/blogs/post/introducing-the-new-winui-3-combobox"
excerpt: "A combo box control is a dropdown control that allows you to type a value in a text box and choose from a list of predefined options. We at Syncfusion have also developed a ComboBox control for the WinUI 3..."
taxonomy_category:
  - "Desktop"
  - "UI"
  - "What's new"
  - "WinUI"
taxonomy_post_tag:
  - "ComboBox"
  - "desktop"
  - "UI"
  - "What's New"
  - "WinUI"
---

# Introducing the New WinUI 3 ComboBox

[Jegan Raj M](https://www.syncfusion.com/blogs/author/jeganraj-m)

![Introducing the New WinUI 3 ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Introducing-the-New-WinUI-3-ComboBox.png)


A combo box control is a dropdown control that allows you to type a value in a text box and choose from a list of predefined options.

We at [Syncfusion](https://www.syncfusion.com/)
 have also developed a [ComboBox](https://www.syncfusion.com/winui-controls/combobox)
 control for the [WinUI 3 platform](https://www.syncfusion.com/winui-controls)
 for our [2021 Volume 3](https://www.syncfusion.com/forums/169291/essential-studio-2021-volume-3-main-release-v19-3-0-43-is-available-for-download)
 release.

Following are the main features of the WinUI ComboBox in its initial release:

- [Editing](#editing)
- [Multiselection](#multi-selection)
- [Searching](#searching)
- [Filtering](#filtering)
- [Grouping](#grouping)
- [Selection box UI](#selection-box-ui)
- [Item customization](#item-customization)
- [Theming](#theming)

Let’s look at these features and learn how to integrate the new WinUI ComboBox control into your application.

## Editing

The WinUI ComboBox supports both editable and non-editable text boxes for selecting an item from a data source.

In the editable mode, we can type and select the items from a collection. In this case, the typed item will get highlighted in a collection.

![WinUI ComboBox in Editable Mode](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/WinUI-ComboBox-in-Editable-Mode.png)

WinUI ComboBox in Editable Mode

The non- editable mode prevents users from editing and instead allows them to select from the dropdown list.

![ComboBox in Non- Editable Mode](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/ComboBox-in-Non-Editable-Mode.png)

ComboBox in Non- Editable Mode

**Note:** For more details, refer to the [Editing in WinUI ComboBox documentation](https://help.syncfusion.com/winui/combobox/editing)
.

## Multiselection

The ComboBox supports both single and multiple selection modes. The multiselection mode allows users to select multiple values from the dropdown list, whereas the single selection mode allows selecting only a single item. Multiple selection can be represented with checkboxes, like in the following screenshot.

![MultiSelect ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Multi-Select-ComboBox.gif)

MultiSelect ComboBox

**Note:** For more details, refer to the [Multiple selections in WinUI ComboBox documentation](https://help.syncfusion.com/winui/combobox/selection#multiple-selection)
.

## Searching

Search for and select a required item from the list. You can search with either the starting or contained letters.

![Searching in WinUI ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Searching-in-WinUI-ComboBox.png)

Searching in WinUI ComboBox

**Note:** For more details, refer to the [Searching in WinUI ComboBox documentation](https://help.syncfusion.com/winui/combobox/searching)
.

## Filtering

The ComboBox has built-in support to filter data items depending on the text entered in the editing text box. You can filter data by entering the starting letter or a specific letter in the item.

Refer to the following GIF images.

![Filtering with Starting Letters in WinUI ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Filtering-with-Starting-Letters-in-WinUI-ComboBox.gif)

Filtering with Starting Letters in WinUI ComboBox

![Filtering with Contained Letters in WinUI ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Filtering-with-Contained-Letters-in-WinUI-ComboBox.gif)

Filtering with Contained Letters in WinUI ComboBox

**Note:** For more details, refer to the [Filtering in WinUI ComboBox documentation](https://help.syncfusion.com/winui/combobox/filtering#enable-filtering)
.

## Grouping

You can group a collection and display the header for each group. Also, you can customize the group header with images and templates like in the following screenshot.

![WinUI ComboBox with Grouped Items](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/WinUI-ComboBox-with-Grouped-Items.png)

WinUI ComboBox with Grouped Items

To display grouped collections, use the **CollectionViewSource** property. You can’t perform filtering while grouping a collection in the ComboBox control.

**Note:** For more details, refer to the [Grouping in WinUI ComboBox documentation](https://help.syncfusion.com/winui/combobox/grouping)
.

## Selection box UI

You can easily customize the selection box appearance based on the selected item(s).

For example, you can display a country name with its flag or the selected iems count like in the following screenshot.

![WinUI ComboBox with Customized Selection Box UI](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/WinUI-ComboBox-with-Customized-Selection-Box-UI.png)

WinUI ComboBox with Customized Selection Box UI

**Note:** Refer to the [Selection box UI documentation](https://help.syncfusion.com/winui/combobox/getting-started#selectionbox-ui)
 for more details.

## Item customization

You can easily customize the dropdown list items with images or any other custom control.

![Items Customization in WinUI ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Items-Customization-in-WinUI-ComboBox.png)

Items Customization in WinUI ComboBox

**Note:** To get detailed information, refer to the [Customize ComboBoxItem documentation](https://help.syncfusion.com/winui/combobox/styling#customize-comboboxitem)
.

## Theming

The ComboBox control is available in both light and dark themes.

![Theming Support in WinUI ComboBox](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Theming-Support-in-WinUI-ComboBox.png)

Theming Support in WinUI ComboBox

**Note:** Refer to the [Themes for Syncfusion WinUI Controls documentation](https://help.syncfusion.com/winui/themes)
.

## Getting started with the WinUI ComboBox

We have explored the features of the WinUI ComboBox control. Now, let’s see how to add it to your application and use its basic features.

### Step 1: Create a WinUI application.

First, create a simple project using the instructions provided in the [Create app with Windows App SDK](https://docs.microsoft.com/en-us/windows/apps/winui/winui3/create-your-first-winui3-app?tabs=desktop-csharp)
 documentation.

### Step 2: Add the Syncfusion.Editor.WinUI NuGet package.

Then, install the latest [Syncfusion.Editor.WinUI](https://www.nuget.org/packages/Syncfusion.Editors.WinUI/)
 NuGet package in the application from [nuget.org](https://www.nuget.org/)
 or from the installed location, **C:\Program Files (x86)\Syncfusion\Essential Studio®\WinUI\xx.x.x.xx\NuGetPackages**.

**Note:** xx.x.x.xx denotes the version of the Syncfusion WinUI Editor package.

Refer to the following screenshot.

### ![Add the Syncfusion.Editor.WinUI NuGet Package](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/Add-the-Syncfusion.Editor.WinUI-NuGet-Package.png)Step 3: Add the namespace.

Now, include the **editors** namespace in your XAML file with the following code.

```
xmlns:editors="using:Syncfusion.UI.Xaml.Editors"
```

### Step 4: Initialize the ComboBox.

Initialize the ComboBox control and add the items like in the following code example.

```
<editors:SfComboBox x:Name="sfComboBox"
                    Width="250"
 	<editors:SfComboBoxItem Content="Badminton"/>
       <editors:SfComboBoxItem Content="Cricket"/>
       <editors:SfComboBoxItem Content="Football"/>
       <editors:SfComboBoxItem Content="Golf"/>
       <editors:SfComboBoxItem Content="Hockey"/>
</editors:SfComboBox>
```

This code will create the ComboBox with its items like the following GIF image.

![WinUI ComboBox with Items](https://www.syncfusion.com/blogs/wp-content/uploads/2021/10/WinUI-ComboBox-with-Items.gif)

WinUI ComboBox Displaying Items

## GitHub reference

Get the [demo project for the WinUI ComboBox control](https://github.com/syncfusion/winui-demos/tree/master/editor)
 on GitHub.

## Conclusion

I hope you enjoyed learning about the new Syncfusion [WinUI ComboBox](https://www.syncfusion.com/winui-controls/combobox)
 control and its features. This control is available in our [2021 Volume 3](https://www.syncfusion.com/forums/169291/essential-studio-2021-volume-3-main-release-v19-3-0-43-is-available-for-download)
release. Also, check out our [Release Notes](https://help.syncfusion.com/common/essential-studio/release-notes/v19.3.0.43)
 and [What’s New](https://www.syncfusion.com/products/whatsnew)
 pages to see all the available new updates in this release. Try them out and leave your feedback in the comments section below!

You can download and check out our demo app in the [Microsoft Store](https://install.appcenter.ms/orgs/syncfusion-demos/apps/winui-demos/distribution_groups/release)
.

For current customers, the new version is available for download from the [License and Downloads](https://www.syncfusion.com/account/downloads)
 page. If you are not yet a Syncfusion customer, you can try our 30-day [free trial](https://www.syncfusion.com/downloads)
 to check out our newest features.

You can also contact us through our [support forums](https://www.syncfusion.com/forums)
, [Direct-Trac](https://www.syncfusion.com/support/directtrac/incidents)
, or [feedback portal](https://www.syncfusion.com/feedback/winui)
. We are always happy to assist you!

## Related blogs

- [Syncfusion Essential Studio® 2021 Volume 3 Is Here!](https://www.syncfusion.com/blogs/post/syncfusion-essential-studio-2021-volume-3-is-here.aspx)
- [Introducing the First Set of Syncfusion .NET MAUI Controls](https://www.syncfusion.com/blogs/post/introducing-the-first-set-of-syncfusion-net-maui-controls.aspx)
- [Syncfusion Receives 12 G2 Badges – Fall 2021](https://www.syncfusion.com/blogs/post/syncfusion-receives-12-g2-badges-fall-2021.aspx)
- [Syncfusion Defers UWP Support in WinUI 3 Suite](https://www.syncfusion.com/blogs/post/syncfusion-defers-uwp-support-in-winui-3-suite.aspx)
