自定义C1ComboBox控件实现下拉多选

原生C1ComboBox控件非常强大且使用,如支持自动完成、下拉单选、下拉方向、下拉框可定义大小等。

发布于 2014/05/29 00:00

ComponentOne Enterprise

原生C1ComboBox控件非常强大且使用,如支持自动完成、下拉单选、下拉方向、下拉框可定义大小等。

image21_10

但未支持多选:如点击下拉可出现CheckList,以方便用户多选。如下图所示的需求:

MuliCheckCombox 

虽不直接支持,然既然基于WPF,故提供了模板供我们扩展的接口:Templates、http://helpcentral.componentone.com/nethelp/C1BasicWPF/#!Documents/C1ComboBox/itemtemplates2.htm

下面我们开始定义可下拉多选的C1Combox:

首先,定义Node用于存储选择数据,有2个属性:Title、IsSelected, 为了可绑定要继承,必须从INotifyPropertyChanged接口继承。

  1:  public class Node : INotifyPropertyChanged
  2:  {
  3:         ...
  4:         public string Title
  5:         {
  6:             get
  7:             {
  8:                 return _title;
  9:             }
 10:             set
 11:             {
 12:                 _title = value;
 13:                 NotifyPropertyChanged("Title");
 14:             }
 15:         }
 16:         public bool IsSelected
 17:         {
 18:             get
 19:             {
 20:                 return _isSelected;
 21:             }
 22:             set
 23:             {
 24:                 _isSelected = value;
 25:                 NotifyPropertyChanged("IsSelected");
 26:             }
 27:         }
 28:        ...
 29:    }

然后,定义ViewModel,用于存储下拉列表的多个Node。

最后,定义主角:MultiSelectComboBox类

它继承自C1.WPF.C1ComboBox,我们重写OnItemsSourceChanged、http://helpcentral.componentone.com/nethelp/C1BasicWPF/#!XMLDocuments/Ref/html/M_C1_WPF_C1ComboBox_OnApplyTemplate.htm,并新增了依赖属性DependencyProperty SelectedItemsProperty用于输出选择的下拉项。

OnItemsSourceChanged: 初始化Node列表。

http://helpcentral.componentone.com/nethelp/C1BasicWPF/#!XMLDocuments/Ref/html/M_C1_WPF_C1ComboBox_OnApplyTemplate.htm:      获得C1Combox的子元素“ComboHeader”、“DropDown”,注册点击、选择事件

SelectedItems:       选择项变化后,逐个判断Node节点,设置IsSelected属性,同时在C1Combox上当前选择的项的Title字符串,多个项用逗号分隔。

调用方法,在XMAL中添加调用即可:

  1:       <local:MultiSelectComboBox x:Name="multiSelectCombo1" Height="23" Width="150" 
  2:                                    ItemsSource="{Binding Path=Items}"
  3:                                    SelectedItems="{Binding SelectedItems, Mode=TwoWay}">
  4:             <c1:C1ComboBox.ItemTemplate>
  5:                 <DataTemplate>
  6:                     <CheckBox Name="templateCheckbox" 
  7:                               Content="{Binding Title}"                               
  8:                               IsChecked="{Binding IsSelected}" 
  9:                               Checked="templateCheckbox_Checked"
 10:                               Unchecked="templateCheckbox_UnChecked"
 11:                               />
 12:                 </DataTemplate>
 13:             </c1:C1ComboBox.ItemTemplate>           
 14:         </local:MultiSelectComboBox>

 

源码下载:

ComponentOne Enterprise | 下载试用

ComponentOne 是一套专注于企业 .NET开发、支持 .NET Core 平台,并完美集成于 Visual Studio 的第三方控件集,包含 300 多种 .NET开发控件,提供表格数据管理、数据可视化、报表和文档、日程安排、输入和编辑、导航和布局、系统提升工具等七大功能,被誉为“.NET开发的‘瑞士军刀’”。

ComponentOne 为您提供专业的产品咨询服务,并由技术支持工程师为您1对1解答。>> 发帖提问

相关产品
推荐相关案例
关注微信
葡萄城社区二维码

关注“葡萄城社区”

加微信获取技术资讯

加微信获取技术资讯

想了解更多信息,请联系我们, 随时掌握技术资源和产品动态