wpf - 自定义 WPF ComboBox 不显示分组

Question

我在 WPF 中创建了一个自定义 ComboBox

<!-- Combobox template -->
    <ControlTemplate x:Key="CustomComboBoxToggleButton" TargetType="ToggleButton">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="20"/>
            </Grid.ColumnDefinitions>
            <Border x:Name="Border" Grid.ColumnSpan="2" CornerRadius="3" Background="{StaticResource CustomDarkBlue}" BorderBrush="{StaticResource CustomWhite}" BorderThickness="2"/>
            <Border x:Name="Border2" Grid.Column="0" CornerRadius="3,0,0,3" Margin="1" Background="{StaticResource CustomBackground}" BorderBrush="{StaticResource CustomWhite}" BorderThickness="1,1,2,1"/>
            <Path x:Name="Arrow" Grid.Column="1" Fill="{StaticResource CustomGlyph}" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 4 4 L 8 0 Z"/>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="ToggleButton.IsMouseOver" Value="True">
                <Setter TargetName="Border" Property="Background" Value="{StaticResource CustomDarkBlue}"/>
            </Trigger>
            <Trigger Property="ToggleButton.IsChecked" Value="True">
                <Setter TargetName="Border" Property="Background" Value="{StaticResource CustomDarkBlue}"/>
            </Trigger>
            <Trigger Property="IsEnabled" Value="False">                    
                <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource CustomGray}"/>
                <Setter TargetName="Border2" Property="BorderBrush" Value="{StaticResource CustomGray}"/>
                <Setter Property="Foreground" Value="{StaticResource CustomGray}"/>
                <Setter TargetName="Arrow" Property="Fill" Value="{StaticResource CustomGray}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- Combobox -->
    <Style x:Key="RoundedComboBox" TargetType="{x:Type ComboBox}">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>            
        <Setter Property="Foreground" Value="{StaticResource CustomWhite}"/>
        <Setter Property="Background" Value="{StaticResource CustomBackground}"/>
        <Setter Property="Height" Value="21"/>
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid>
                        <ToggleButton Name="ToggleButton" Template="{StaticResource CustomComboBoxToggleButton}" Grid.Column="2" Focusable="False" IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
                        <ContentPresenter Name="ContentSite" IsHitTestVisible="False" Content="{TemplateBinding SelectionBoxItem}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" Margin="3,1,23,1" VerticalAlignment="Center" HorizontalAlignment="Left"/>                            
                        <Popup Name="Popup" Placement="Bottom" IsOpen="{TemplateBinding IsDropDownOpen}" AllowsTransparency="True" Focusable="False" PopupAnimation="Slide">
                            <Grid Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                <Border x:Name="DropDownBorder" Background="{StaticResource CustomBackground}" BorderThickness="2" BorderBrush="{StaticResource CustomWhite}"/>
                                <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained"/>
                                </ScrollViewer>
                            </Grid>
                        </Popup>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="HasItems" Value="False">
                            <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Foreground" Value="{StaticResource CustomGray}"/>                                
                        </Trigger>
                        <Trigger Property="IsGrouping" Value="True">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
                        </Trigger>
                        <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="True">
                            <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/>
                            <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
                        </Trigger>                            
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

然后将其应用于 ComboBox

<ComboBox Grid.Column="0" x:Name="cboChild" Margin="140,65,0,0"  ItemsSource="{Binding Source={StaticResource GroupedData}}" ItemTemplate="{StaticResource AccountTemplate}" SelectedValue="{Binding Source={StaticResource Item}, Path=child}" SelectedValuePath="ID" Width="150" Style="{StaticResource RoundedComboBox}" HorizontalAlignment="Left" VerticalAlignment="Top">                        
                        <ComboBox.GroupStyle>
                            <GroupStyle HeaderTemplate="{StaticResource GroupHeader}"/>                                
                        </ComboBox.GroupStyle>
                    </ComboBox>

下面是在Window.Resources中找到的

<Window.Resources>
    <CollectionViewSource Source="{Binding ChildAccounts}" x:Key="GroupedData">
        <CollectionViewSource.GroupDescriptions>
            <PropertyGroupDescription PropertyName="group"/>
        </CollectionViewSource.GroupDescriptions>
    </CollectionViewSource>

    <DataTemplate x:Key="GroupHeader">
        <TextBlock Text="{Binding group}" Margin="0" Foreground="{StaticResource CustomWhite}"/>
    </DataTemplate>
    <DataTemplate x:Key="AccountTemplate">
        <TextBlock Text="{Binding comment}" Margin="0" Foreground="{StaticResource CustomWhite}"/>
    </DataTemplate>        
</Window.Resources>

基本上，当未应用 RoundedComboBox 样式(即默认的 ComboBox)时，分组工作正常，但只要应用该样式，下拉弹出窗口为空

求助!!

谢谢安迪

Answer 1

找到答案..... 使用<ItemsPresenter ...>而不是 <StackPanel ...>

感谢 sa_ddam213 关于绑定(bind)的有用建议。