如何在WPF中实现ComboBox多选 - 教程

在前面我介绍过WPFDevelopers这个项目

https://blog.csdn.net/zhaotianff/article/details/142941026

WPFDevelopers是一个优秀的WPF UI库。

它里面包含了一个MultiSelectComboBox控件，可以支持多选。

使用方法如下：

1、首先我们使用nuget引入 WPFDevelopers 0.0.0.2

2、然后修改App.xaml如下

1 
 7     
 8         
 9             
10                 
11                 
12             
13         
14     
15 

3、在界面上放置MultiSelectComboBox 

1 
10     
11         
12 
13         
14     
15 

4、设置多选项显示时的分隔符

默认是  ;，我们可以设置为其它字符，例如|

1 
2 
3 

5、设置显示类型

通过MultiSelectComboBox.ShowType属性可以设置MultiSelectComboBox的显示类型

可选Tag和Text（默认）

Text显示效果

Tag显示效果

6、启用/禁用搜索

通过MultiSelectComboBox.IsSearch属性可以设置MultiSelectComboBox是否显示搜索框

IsSearch = true

IsSearch = false

7、增加多列显示

这里我们可以通过数据模板来控制显示，

这个功能不过多介绍，跟其它列表控件的数据模板使用方法一致。

如果对数据模板功能不了解，可以参考下面的链接

https://learn.microsoft.com/zh-cn/dotnet/desktop/wpf/data/data-templating-overview

1 
 8     
 9         
12     
13     
14         
15             
16                 
17                     
18                     
22                     
26                 
27                 
32                 
37                 
42             
43         
44     
45 

运行效果

8、添加项

我们先创建一个实体Student

1  public class Student
 2  {
 3      public int Id { get; set; }
 4 
 5      public string Name { get; set; }
 6 
 7      public override string ToString()
 8      {
 9          return $"{Id}-{Name}";
10      }
11  }

然后创建一个实体列表并绑定到MultiSelectComboBox上

1 ObservableCollection students = new ObservableCollection();
2 students.Add(new Student() { Id = 1, Name = "张三" });
3 students.Add(new Student() { Id = 2, Name = "李四" });
4 students.Add(new Student() { Id = 3, Name = "王五" });
5 
6  //设置数据源
7 this.combox.ItemsSource = students;

也可以直接使用系统提供的基础类型，如string、int等

对于系统提供的基础类型，下位项和选中项会显示实际值。

对于对象，如果我们需要控制它的下位项和选中项的显示值，可以通过重写ToString()函数（不指定字段）或者通过DisplayMemberPath属性指定字段。

9、手动设置选中项

1  //假设选中1，3项
2  var student1 = students.ElementAt(0);
3  var student3 = students.ElementAt(2);
4  var selectedList = new ObservableCollection() { student1, student3 };
5 
6  //设置选中项
7  this.combox.SelectedItemsExt = selectedList;

10、全选/取消全选

1 //全选
2 this.combox.SelectAll();
3 
4 //取消全选
5 UnselectAll

11、获取选中项

1  var selectedItems = this.combox.SelectedItems;
2 
3  foreach (Student student in selectedItems)
4  {
5      MessageBox.Show(student.Id.ToString() + "-" + student.Name);
6  }

运行效果：

示例代码

下载