WPF 自定义ComboBox样式，自定义多选控件-白红宇

WPF 自定义ComboBox样式，自定义多选控件

阅读量：6156 次

发布时间：2019-06-21

本文共 7951 字，大约阅读时间需要 26 分钟。

一、ComboBox基本样式

ComboBox有两种状态，可编辑和不可编辑状态。通过设置IsEditable属性可以切换控件状态。

先看基本样式效果：

基本样式代码如下：

引用示例：

二、ComboBox扩展样式（多选控件）

ComBoBox能够单选选择数据，那么能不能实现多选的操作呢，答案是肯定的。这里多选的自定义控件参考了博主“梦里花落知多少”的内容。我对样式做了补充，使其能够更方便的进行移除多选的内容。同时也更好的展示了已选的内容，大家可以根据实际需求做出更好的展示效果。

先看效果：

2.1、添加自定义控件MultiComboBox

public class MultiComboBox : ComboBox    {        static MultiComboBox()        {            DefaultStyleKeyProperty.OverrideMetadata(typeof(MultiComboBox), new FrameworkPropertyMetadata(typeof(MultiComboBox)));        }        private static void OnPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)        {            d.SetValue(e.Property, e.NewValue);        }        ///         /// 选中项列表        /// 
        public ObservableCollection
     
       ChekedItems        {            get { return (ObservableCollection
      
       )GetValue(ChekedItemsProperty); }            set { SetValue(ChekedItemsProperty, value); }        }        public static readonly DependencyProperty ChekedItemsProperty =            DependencyProperty.Register("ChekedItems", typeof(ObservableCollection
       
        ), typeof(MultiComboBox), new PropertyMetadata(new ObservableCollection
        
         (), OnPropertyChanged));        /// 
                 /// ListBox竖向列表        /// 
        private ListBox _ListBoxV;        /// 
                 /// ListBox横向列表        /// 
        private ListBox _ListBoxH;        public override void OnApplyTemplate()        {            base.OnApplyTemplate();            _ListBoxV = Template.FindName("PART_ListBox", this) as ListBox;            _ListBoxH = Template.FindName("PART_ListBoxChk", this) as ListBox;            _ListBoxH.ItemsSource = ChekedItems;            _ListBoxV.SelectionChanged += _ListBoxV_SelectionChanged;            _ListBoxH.SelectionChanged += _ListBoxH_SelectionChanged;            if (ItemsSource != null)            {                foreach (var item in ItemsSource)                {                    MultiCbxBaseData bdc = item as MultiCbxBaseData;                    if (bdc.IsCheck)                    {                        _ListBoxV.SelectedItems.Add(bdc);                    }                }            }        }        private void _ListBoxH_SelectionChanged(object sender, SelectionChangedEventArgs e)        {            foreach (var item in e.RemovedItems)            {                MultiCbxBaseData datachk = item as MultiCbxBaseData;                for (int i = 0; i < _ListBoxV.SelectedItems.Count; i++)                {                    MultiCbxBaseData datachklist = _ListBoxV.SelectedItems[i] as MultiCbxBaseData;                    if (datachklist.ID == datachk.ID)                    {                        _ListBoxV.SelectedItems.Remove(_ListBoxV.SelectedItems[i]);                    }                }            }        }        void _ListBoxV_SelectionChanged(object sender, SelectionChangedEventArgs e)        {            foreach (var item in e.AddedItems)            {                MultiCbxBaseData datachk = item as MultiCbxBaseData;                datachk.IsCheck = true;                if (ChekedItems.IndexOf(datachk) < 0)                {                    ChekedItems.Add(datachk);                }            }            foreach (var item in e.RemovedItems)            {                MultiCbxBaseData datachk = item as MultiCbxBaseData;                datachk.IsCheck = false;                ChekedItems.Remove(datachk);            }        }        public class MultiCbxBaseData        {            private int _id;            /// 
                     /// 关联主键            /// 
            public int ID            {                get { return _id; }                set { _id = value; }            }            private string _viewName;            /// 
                     /// 显示名称            /// 
            public string ViewName            {                get { return _viewName; }                set                {                    _viewName = value;                }            }            private bool _isCheck;            /// 
                     /// 是否选中            /// 
            public bool IsCheck            {                get { return _isCheck; }                set { _isCheck = value;}            }        }    }

2.2、定义MultiComboBox控件的样式

2.3、引用示例：

2.4、后台代码（初始化绑定数据）：

public partial class MainWindow : Window    {        public MainWindow()        {            InitializeComponent();            MultiComboBoxList = new ObservableCollection
     
      ()            {                new MultiCbxBaseData(){                    ID=0,                    ViewName="张三",                    IsCheck=false                },                new MultiCbxBaseData(){                    ID=1,                    ViewName="李四",                    IsCheck=false                },                new MultiCbxBaseData(){                    ID=2,                    ViewName="王五",                    IsCheck=false                },                new MultiCbxBaseData(){                    ID=3,                    ViewName="马六",                    IsCheck=false                },                 new MultiCbxBaseData(){                    ID=4,                    ViewName="赵七",                    IsCheck=false                },            };            this.multiCmb.ItemsSource = MultiComboBoxList;        }        private ObservableCollection
      
        MultiComboBoxList;    }

所有代码已经上传到github：

转载于:https://www.cnblogs.com/xiaomingg/p/8748286.html

你可能感兴趣的文章