WPF 自定义ColorDialog DropDownCustomColorPicker

简介: 原文:WPF 自定义ColorDialog DropDownCustomColorPicker今天分享一个 WPF 版的ColorDialog,该控件源自 这里,不过笔者已经该控件做了大量的修改工作,以适应自己的产品需求,闲话少说,先看看效果图:   1、DropDownCustomColorPicker  效果图 先看原项目的(喜欢这种方式的,请到 这里 下载源码 ) 被笔者修改之后的效果图: 二、DropDownCustomColorPicker  四种颜色选择方式 第一种:单击任意一个预定义的颜色即可。
原文: WPF 自定义ColorDialog DropDownCustomColorPicker

今天分享一个 WPF 版的ColorDialog,该控件源自 这里,不过笔者已经该控件做了大量的修改工作,以适应自己的产品需求,闲话少说,先看看效果图:

 

1、DropDownCustomColorPicker  效果图

先看原项目的(喜欢这种方式的,请到 这里 下载源码 )

被笔者修改之后的效果图:

二、DropDownCustomColorPicker  四种颜色选择方式

第一种:单击任意一个预定义的颜色即可。

这些颜色通过反射 Colors 中的属性获得的, 笔者 对这些颜色进行排序,视觉效果更美观了。

    /// <summary>
    /// 反射预定义颜色
    /// </summary>
    public class CustomColors
    {
        List<Color> selectableColors = null;

        public List<Color> SelectableColors
        {
            get { return selectableColors; }
            set { selectableColors = value; }
        }

        public CustomColors()
        {
            var list = new List<Color>();

            Type ColorsType = typeof(Colors);
            PropertyInfo[] ColorsProperty = ColorsType.GetProperties();

            foreach (PropertyInfo property in ColorsProperty)
            {
                list.Add((Color)ColorConverter.ConvertFromString(property.Name));
            }

            list.Sort(new Comparison<Color>((Color x, Color y) =>
            {
                var xtotal = x.R + x.G + x.B;

                var ytotal = y.R + y.G + y.B;

                return xtotal.CompareTo(ytotal); // 升序排列
            }));

            selectableColors = list;
        }

    }
反射 Colors 中的预定义颜色 并排序

 

第二种:使用鼠标选择图像中任意一个像素点的颜色

该控件原作者使用的是 CroppedBitmap 来获取指定像素点的颜色值,还有一种方式 WriteableBitmap,也可以达到类似的目的

        private Color GetColorFromImage(int i, int j)
        {
            CroppedBitmap cb = new CroppedBitmap(image.Source as BitmapSource,
                new Int32Rect(i,
                    j, 1, 1));
            byte[] color = new byte[4];
            cb.CopyPixels(color, 4, 0);
            Color Colorfromimagepoint = Color.FromArgb((byte)SdA.Value, color[2], color[1], color[0]);
            return Colorfromimagepoint;
        }
使用 CroppedBitmap 获取指定像素点的颜色值

 

第三种:手动输入 十六进制数所表示的ARGB颜色值

 

第四种:手动滑动 Slider 选择 ARGB颜色值

 

三、DropDownCustomColorPicker  中 DropDown 的实现方式

原作者采用的 右键菜单,其实笔者更倾向于使用 Popup,不过这一点、笔者没有去做修改。

 

 

四、笔者的优化

1、预定义颜色的排序、视觉效果更美观

2、Expander 控件的自动折叠和展开、操作更方便。

3、优化使用鼠标选取像素点的操作,代码逻辑更简洁、操作更流畅。

4、增加了 SelectedColorChangedEvent 、 DropDownStateChangedEvent 事件

5、使用 Slider 替代了 TextBox 来修改 RGB 颜色值

6、增加了几个配置属性,使用起来更方便。

7、该项目会继续进行扩展及优化,敬请期待。

 

五、完整的源码

完整的源码, 笔者已上传至Github,  https://github.com/iqingyu/BlogsDemo :

DropDownCustomColorPicker

DropDownCustomColorPicker.Test

两个项目为完整的Demo

 

 

该项目会继续进行扩展及优化,敬请期待。

 

目录
相关文章
|
C# 虚拟化 索引
【WPF】UI虚拟化之------自定义VirtualizingWrapPanel
原文:【WPF】UI虚拟化之------自定义VirtualizingWrapPanel 前言 前几天QA报了一个关于OOM的bug,在排查的过程中发现,ListBox控件中被塞入了过多的Item,而ListBox又定义了两种样式的ItemsPanelTemplate。
2203 0
|
3月前
|
开发框架 缓存 前端开发
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(11) -- 下拉列表的数据绑定以及自定义系统字典列表控件
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(11) -- 下拉列表的数据绑定以及自定义系统字典列表控件
|
3月前
|
开发框架 前端开发 JavaScript
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(3)--自定义用户控件
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(3)--自定义用户控件
|
C# 数据安全/隐私保护
【WPF】右下角弹出自定义通知样式(Notification)——简单教程
原文:【WPF】右下角弹出自定义通知样式(Notification)——简单教程 1.先看效果 2.实现 1.主界面是MainWindow 上面就只摆放一个Button即可。
3044 0
|
3月前
|
C#
WPF 自定义可拖动标题栏
WPF 自定义可拖动标题栏
42 0
|
3月前
|
开发框架 前端开发 C#
使用WPF开发自定义用户控件,以及实现相关自定义事件的处理
使用WPF开发自定义用户控件,以及实现相关自定义事件的处理
|
前端开发 C# 图形学
【WPF】WPF开发用户控件、用户控件属性依赖DependencyProperty实现双向绑定、以及自定义实现Command双向绑定功能演示
Wpf开发过程中,最经常使用的功能之一,就是用户控件(UserControl)了。用户控件可以用于开发用户自己的控件进行使用,甚至可以用于打造一套属于自己的UI框架。依赖属性(DependencyProperty)是为用户控件提供可支持双向绑定的必备技巧之一,同样用处也非常广泛。
934 0
【WPF】WPF开发用户控件、用户控件属性依赖DependencyProperty实现双向绑定、以及自定义实现Command双向绑定功能演示
|
C#
WPF 4 DataGrid 控件(自定义样式篇)
原文:WPF 4 DataGrid 控件(自定义样式篇)      在《WPF 4 DataGrid 控件(基本功能篇)》中我们已经学习了DataGrid 的基本功能及使用方法。本篇将继续介绍自定义DataGrid 样式的相关内容,其中将涉及到ColumnHeader、RowHeader、Row、Cell 的各种样式设置。
2678 0
|
C# C++ 数据可视化
WPF Calendar 日历控件 样式自定义
原文:WPF Calendar 日历控件 样式自定义 粗略的在代码上做了些注释 blend 生成出来的模版 有的时候 会生成 跟 vs ui界面不兼容的代码 会导致可视化设计界面 报错崩溃掉 但是确不影响 程序的编译运行 这个样式表 在vs 里会提示动画不兼容 Foreground属性 报错 ...
1773 1
|
C#
WPF 控件自定义背景
<!--控件要设置尺寸的话,设置的尺寸必须比下面的图形的尺寸要小,不然显示不开--> <Label Content="直角测试" Width="90" Height="90" HorizontalContentAlignment="Center" Vert...
1017 0