包含两个或多个部分的ComboBox

时间:2017-10-20 05:24:30

标签: c# wpf combobox

摘要

是否可以在ItemsPanelTemplate的{​​{1}}中使用两个面板,其中项目会根据项目的属性值添加到其中一个面板中?例如,顶部为ComboBox,其下方为WrapPanel。如果属性StackPanelWrapPanel,则项目将转到IsCustom,否则转到True

详细

所以这就是我所取得的成就:

enter image description here

这就是我现在想要的:

enter image description here

也就是说,我需要将我的ComboBox的下拉部分分成两个或更多部分。

如果我理解正确,我必须修改StackPanel的{​​{1}}并定义一个自定义的,但当我这样做时,我发现有一个ItemsPanelTemplate(我是期待ComboBoxStackPanel设置为ListBox,如果我理解正确,则会将生成的项目定向到IsItemsHost。在这种情况下,如何在此处添加两个部分?我使用哪些控件?如何在这些控件上定义True

Google搜索会返回大量结果,将下拉列表划分为多个列,但没有将结果划分为多行。

1 个答案:

答案 0 :(得分:2)

XAML:

<ComboBox x:Name="MyComboBox" Height="20">
    <ComboBox.GroupStyle>
        <GroupStyle>
            <GroupStyle.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}"/>
                </DataTemplate>
            </GroupStyle.HeaderTemplate>
            <GroupStyle.Panel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical" IsItemsHost="True"/>
                </ItemsPanelTemplate>
            </GroupStyle.Panel>
        </GroupStyle>
    </ComboBox.GroupStyle>
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <Rectangle x:Name="Rect" Width="10" Height="10" Fill="{Binding Brush}"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Brush}" Value="{x:Null}">
                    <Setter TargetName="Rect" Property="Visibility" Value="Collapsed"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </ComboBox.ItemTemplate>
    <ComboBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal" IsItemsHost="True"/>
        </ItemsPanelTemplate>
    </ComboBox.ItemsPanel>
</ComboBox>

测试代码隐藏:

    public class BrushData
    {
        public string Type { get; set; }

        public Brush Brush { get; set; }

    }

    public MainWindow()
    {
        InitializeComponent();

        var lists = new List<BrushData>
        {
            new BrushData {Type = "Theme", Brush = Brushes.Red},
            new BrushData {Type = "Theme", Brush = Brushes.Blue},
            new BrushData {Type = "Theme", Brush = Brushes.Orange},
            new BrushData {Type = "Standard", Brush = Brushes.LightGreen},
            new BrushData {Type = "Standard", Brush = Brushes.LightPink},
            new BrushData {Type = "More Colors...", Brush = null}
        };

        var collection = new ListCollectionView(lists);
        collection.GroupDescriptions.Add(new PropertyGroupDescription("Type"));

        MyComboBox.ItemsSource = collection;
}