WPF-ComboBox分组多选

原文: WPF-ComboBox分组多选

之前写过一篇文件,介绍的是ComboBox分组,但只能选择一个,不能进行多选,这篇文件介绍的是使用ComboBox进行分组,并且还能选择多条数据,效果如下所示:

ComboBox多选分组.png

实现原理相对简单,主要是自定义 ComboBoxItemTemplate,使用一个 ListBox来显示 ComboBox中的每一项,在给 ComboBox设置 ItemsSource的时候,只需添加一条数据即可,代码如下所示:
xaml

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d" MouseUp="Window_MouseUp"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <ComboBox HorizontalContentAlignment="Stretch" Height="25" Name="cmb">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <ListBox HorizontalContentAlignment="Stretch" ItemsSource="{Binding Path=List}" SelectionMode="Multiple" SelectionChanged="ListBox_SelectionChanged_1"  MouseUp="ListBox_MouseUp">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{Binding Name}"/>
                                </StackPanel>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                        <ListBox.GroupStyle>
                            <GroupStyle>
                                <GroupStyle.HeaderTemplate>
                                    <DataTemplate>
                                        <TextBlock Text="{Binding Name}"/>
                                    </DataTemplate>
                                </GroupStyle.HeaderTemplate>
                            </GroupStyle>
                        </ListBox.GroupStyle>
                    </ListBox>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
    </Grid>
</Window>

.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApp1
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            List<Item> items = new List<Item>();
            items.Add(new Item() { Name = "Item1", Category = "A" });
            items.Add(new Item() { Name = "Item2", Category = "A" });
            items.Add(new Item() { Name = "Item3", Category = "A" });
            items.Add(new Item() { Name = "Item4", Category = "B" });
            items.Add(new Item() { Name = "Item5", Category = "B" });

            ListCollectionView lcv = new ListCollectionView(items);
            lcv.GroupDescriptions.Add(new PropertyGroupDescription("Category"));
            List<ComboxTiem> cbList = new List<ComboxTiem>();
            ComboxTiem cb = new ComboxTiem();
            cb.List = lcv;
            cbList.Add(cb);
            this.cmb.ItemsSource = cbList;
            
        }
        
        private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            e.Handled = true;
        }

        private void ListBox_MouseUp(object sender, MouseButtonEventArgs e)
        {
            e.Handled = true;
        }

        private void ListBox_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
        {
            ListBox lb = (ListBox)sender;
            var SelectedItems = lb.SelectedItems;
            var SelectedIndex = lb.SelectedIndex;
            e.Handled = true;
        }
    }

    public class Item
    {
        public string Name { get; set; }
        public string Category { get; set; }
    }

    public class ComboxTiem {
        public ListCollectionView List { get; set; }
    }
}

其实现原理跟ComboBox分组差不多,只是多了一个ListBox

猜你喜欢

转载自www.cnblogs.com/lonelyxmas/p/12709866.html