Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

ComboBoxEdit.GroupStyle Property

Gets a collection of GroupStyle objects that define the appearance of each group level.

Namespace: DevExpress.Xpf.Editors

Assembly: DevExpress.Xpf.Core.v24.2.dll

NuGet Package: DevExpress.Wpf.Core

#Declaration

#Property Value

Type Description
ObservableCollection<GroupStyle>

One or more GroupStyle objects.

#Remarks

DevExpress WPF ComboBoxEdit, LookUpEdit, and ListBoxEdit controls include support for ICollectionView – allowing you to manipulate the current record and define rules for filtering, sorting, and grouping.

By default, if a grouping rule is defined in the ICollectionView, editors display the plain list in which items are sorted to meet data grouping. Use the GroupStyle property to visually enhance the presentation of grouped items. For instance, you can display expandable groups (see the image below):

GroupStyle_comboboxedit

<Grid.Resources>
    <DataTemplate x:Key="headerTemplate">
        <TextBlock Text="{Binding}" FontWeight="Bold" TextDecorations="Underline"/>
    </DataTemplate>
</Grid.Resources>
<!-- ... -->
<dxe:ComboBoxEdit ItemsSource="{Binding GroupedCities}" 
                  AllowCollectionView="True" 
                  DisplayMember="CityName">
    <dxe:ComboBoxEdit.GroupStyle>
        <GroupStyle HidesIfEmpty="True">
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate>
                                <Expander Header="{Binding Path=Name}" 
                                          HeaderTemplate="{StaticResource headerTemplate}" 
                                          IsExpanded="True"
                                          HorizontalContentAlignment="Stretch" 
                                          Margin="3,3,3,0">
                                    <ItemsPresenter />
                                </Expander>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>
    </dxe:ComboBoxEdit.GroupStyle>
</dxe:ComboBoxEdit>

Note

When grouping is used, the ComboBoxEdit control scrolls items per group by default. To change this behavior, set the VirtualizingPanel.IsVirtualizingWhenGrouping attached property to true.

<dxe:ComboBoxEdit VirtualizingPanel.IsVirtualizingWhenGrouping="True">
   ...
</dxe:ComboBoxEdit>
See Also