How to: Create a Checked ComboBox

• Nov 02, 2022
• 3 minutes to read

This example demonstrates how to create a checked combo box. To do this, set the editor’s StyleSettings property to CheckedComboBoxStyleSettings:

Xaml

<dxe:ComboBoxEdit.StyleSettings>
   <dxe:CheckedComboBoxStyleSettings />
</dxe:ComboBoxEdit.StyleSettings>

When you enable multiple selection in the ComboBoxEdit, its EditValue property must contain an object of the List<object> type. In this example, the SelectedItemsConverter converts the collection of selected Customers to List<object> and back.

View Example: Create a Checked ComboBox

XAML

<Window x:Class="ComboBoxEdit_CreatingCheckedComboBox.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
        xmlns:local="clr-namespace:ComboBoxEdit_CreatingCheckedComboBox"
        xmlns:localVM="clr-namespace:ComboBoxEdit_CreatingCheckedComboBox.ViewModels"
        Title="Checked ComboBox"
        Height="200"
        Width="350">
    <Window.DataContext>
        <localVM:MyViewModel />
    </Window.DataContext>
    <DockPanel>
        <dxe:ComboBoxEdit DockPanel.Dock="Top"
                          Margin="10,0,10,0"
                          SeparatorString="; "
                          DisplayMember="Name"
                          EditValue="{Binding SelectedCustomers, Converter={local:SelectedItemsConverter}, UpdateSourceTrigger=PropertyChanged}"
                          ItemsSource="{Binding Customers}">
            <dxe:ComboBoxEdit.StyleSettings>
                <dxe:CheckedComboBoxStyleSettings />
            </dxe:ComboBoxEdit.StyleSettings>
        </dxe:ComboBoxEdit>
        <dxe:ListBoxEdit Margin="10,10,10,10"
                         DisplayMember="Name"
                         ItemsSource="{Binding SelectedCustomers}" />
    </DockPanel>
</Window>

MyViewModel.cs

using System;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;

namespace ComboBoxEdit_CreatingCheckedComboBox.ViewModels {
    public class MyViewModel : INotifyPropertyChanged {
        ObservableCollection<Customer> selectedCustomers;
        public MyViewModel() {
            Customers = Customer.GetList();
            SelectedCustomers = new ObservableCollection<Customer>() { Customers[1], Customers[2] };
        }
        public ObservableCollection<Customer> Customers { get; set; }
        public ObservableCollection<Customer> SelectedCustomers {
            get { return selectedCustomers; }
            set {
                if (selectedCustomers == value) {
                    return;
                }
                selectedCustomers = value;
                RaisePropertyChanged("SelectedCustomers");
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        void RaisePropertyChanged(string propertyName) {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

MyViewModel.vb

Imports System
Imports System.Collections.ObjectModel
Imports System.ComponentModel
Imports System.Linq

Namespace ComboBoxEdit_CreatingCheckedComboBox.ViewModels
    Public Class MyViewModel
        Implements INotifyPropertyChanged

        Private _selectedCustomers As ObservableCollection(Of Customer)
        Public Sub New()
            Customers = Customer.GetList()
            SelectedCustomers = New ObservableCollection(Of Customer)() From {Customers(1), Customers(2)}
        End Sub
        Public Property Customers() As ObservableCollection(Of Customer)
        Public Property SelectedCustomers() As ObservableCollection(Of Customer)
            Get
                Return _selectedCustomers
            End Get
            Set(ByVal value As ObservableCollection(Of Customer))
                If _selectedCustomers Is value Then
                    Return
                End If
                _selectedCustomers = value
                RaisePropertyChanged("SelectedCustomers")
            End Set
        End Property
        Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged
        Private Sub RaisePropertyChanged(ByVal propertyName As String)
            RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(propertyName))
        End Sub
    End Class
End Namespace

SelectedItemsConverter.cs

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Globalization;
using System.Linq;
using System.Windows.Data;
using System.Windows.Markup;

namespace ComboBoxEdit_CreatingCheckedComboBox {
    public class SelectedItemsConverter : MarkupExtension, IValueConverter {
        public override object ProvideValue(IServiceProvider serviceProvider) {
            return this;
        }
        object IValueConverter.Convert(object value, Type targetType, object parameter, CultureInfo culture) {
            if (value != null)
                return new List<object>((IEnumerable<object>)value);
            return null;
        }
        object IValueConverter.ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) {
            ObservableCollection<Customer> result = new ObservableCollection<Customer>();
            var enumerable = (List<object>)value;
            if (enumerable != null)
                foreach (object item in enumerable)
                    result.Add((Customer)item);
            return result;
        }
    }
}

SelectedItemsConverter.vb

Imports System
Imports System.Collections.Generic
Imports System.Collections.ObjectModel
Imports System.Globalization
Imports System.Linq
Imports System.Windows.Data
Imports System.Windows.Markup

Namespace ComboBoxEdit_CreatingCheckedComboBox
    Public Class SelectedItemsConverter
        Inherits MarkupExtension
        Implements IValueConverter

        Public Overrides Function ProvideValue(ByVal serviceProvider As IServiceProvider) As Object
            Return Me
        End Function
        Private Function IValueConverter_Convert(ByVal value As Object, ByVal targetType As Type, ByVal parameter As Object, ByVal culture As CultureInfo) As Object Implements IValueConverter.Convert
            If value IsNot Nothing Then
                Return New List(Of Object)(DirectCast(value, IEnumerable(Of Object)))
            End If
            Return Nothing
        End Function
        Private Function IValueConverter_ConvertBack(ByVal value As Object, ByVal targetType As Type, ByVal parameter As Object, ByVal culture As CultureInfo) As Object Implements IValueConverter.ConvertBack
            Dim result As New ObservableCollection(Of Customer)()
            Dim enumerable = DirectCast(value, List(Of Object))
            If enumerable IsNot Nothing Then
                For Each item As Object In enumerable
                    result.Add(DirectCast(item, Customer))
                Next item
            End If
            Return result
        End Function
    End Class
End Namespace