【WPF/C#】图层筛选/拾取——Color Picker
文章标题实在不懂怎么表述才清楚。
描述问题:多个图片(图层)重叠时,如何通过鼠标点击来拾取到相应的图层。因为图层中会有很多空白的地方(比如图片四周),要求是获取鼠标点击位置的像素颜色值,如果为空白时或透明度小于50%,则穿透到下一层图层再次进行颜色判断,直到找到符合条件的图层。
根据颜色拾取搜索WPF Color Picker,找到一些相关的资料:
- https://www.codeproject.com/Articles/36848/WPF-Image-Pixel-Color-Picker-Element
- https://github.com/Alkalinee/ColorPicker/blob/master/ColorPicker/Controls/ImageColorPicker.cs
为了适应当前需求,稍作整理之后,提取为一个工具类,代码有点长这里只放个链接,本文重点是如何使用这个工具类来实现需求:
阅读Demo可知:
- 需要把能被拾取到的图片,专门放到一个集合中,如
ObservableCollection<ImageColorPicker> ImageList
- 在遍历该集合时,遍历的顺序即是检测点击位置的像素颜色值所属图层的顺序(点击穿透的顺序)。即在将图片加入集合的时候,应该将处于上层的图片先加入集合。
/// <summary>
/// 根据鼠标位置,拾取图像
/// </summary>
private void PickImageByMousePosition()
{
// 获得鼠标相对于当前窗口的位置
Point mousePoint = Mouse.GetPosition(curWindow); // 遍历图层列表,找到符合条件的图层
foreach (ImageColorPicker image in ImageList)
{
// 鼠标相对于当前遍历到的图片的位置(以图片左下角为原点?)
Point p = Mouse.GetPosition(image); Color color = new Color(); // 鼠标在图片外面,就遍历下一张图片
if (p.X < || p.Y < || p.X > image.ActualWidth || p.Y > image.ActualHeight)
{
continue;
} // 获取鼠标位置的颜色值
color = image.PickColor(p.X, p.Y); // 无色或透明度小于0.5的图层,不是目标图层
if (color != null && color.A <= )
{
continue;
} // 能执行到这一步,说明找到了目标图层
// to what you want break;
} }
进阶:给每张图片(每个图层)添加鼠标事件,通过点击事件来执行遍历检查。
先给图片集合中的每个图片添加一个鼠标左键弹起事件,该事件是激发下一张图片的鼠标左键弹起事件,从而实现事件穿透,直到找到符合要求的图片。
// 每次添加处理器AddHandler之前先清空Handler,防止重复多次添加
for (int i = ; i < ImageList.Count; i++)
{
ImageList[i].RemoveHandler(Image.MouseLeftButtonUpEvent, new RoutedEventHandler(DesignImage_PreviewMouseLeftButtonUp));
} // 给拾取图片添加鼠标事件
foreach (ImageColorPicker image in ImageList)
{
image.AddHandler(Image.MouseLeftButtonUpEvent, new RoutedEventHandler(DesignImage_PreviewMouseLeftButtonUp));
}
然后是激发的事件。
private void DesignImage_PreviewMouseLeftButtonUp(object sender, RoutedEventArgs e)
{
// 当前激发事件的图片
ImageColorPicker image = (ImageColorPicker)sender;
// 当前图片在集合中的角标
int currentIndex = GetIndex(image); // 鼠标相对于该图片的位置
Point p = Mouse.GetPosition(image); Color color = new Color(); try
{
// 位于图像外部,抛异常执行Catch(跳过该层,继续穿透到下一层)
if (p.X < || p.Y < || p.X > image.ActualWidth || p.Y > image.ActualHeight)
{
throw new Exception("p.X或p.Y小于0!");
} color = image.PickColor(p.X, p.Y); // 获取鼠标位置的颜色值
if (color != null && color.A <= ) // 无色或透明度小于0.5
{
ImageColorPicker NextImage = null;
if (currentIndex < ImageList.Count - )
{
NextImage = ImageList[currentIndex + ];
}
if (NextImage != null) // 传递到下一图层,下一层激发该事件
{
MouseDevice mouseDevice = Mouse.PrimaryDevice;
MouseButtonEventArgs mouseButtonEventArgs = new MouseButtonEventArgs(mouseDevice, , MouseButton.Left);
mouseButtonEventArgs.RoutedEvent = Image.MouseLeftButtonUpEvent;
mouseButtonEventArgs.Source = NextImage;
NextImage.RaiseEvent(mouseButtonEventArgs);
}
}
else // 找到了有颜色的图层,即是目标图层
{
// do what you want
}
}
}
catch (Exception)
{
System.Console.WriteLine("----- 图层拾取发生异常,则继续穿透到下一层 ------");
// 点击到了图层的外部,则继续穿透到下一层
ImageColorPicker NextImage = null;
if (currentIndex < fileDataService.DesignViewModelList[i].ImageList.Count - )
{
NextImage = fileDataService.DesignViewModelList[i].ImageList[currentIndex + ];
}
if (NextImage != null)
{
string nextType = NextImage.Uid;
MouseDevice mouseDevice = Mouse.PrimaryDevice;
MouseButtonEventArgs mouseButtonEventArgs = new MouseButtonEventArgs(mouseDevice, , MouseButton.Left);
mouseButtonEventArgs.RoutedEvent = Image.MouseLeftButtonUpEvent;
mouseButtonEventArgs.Source = NextImage;
NextImage.RaiseEvent(mouseButtonEventArgs);
}
}
} /// <summary>
/// 当前image在ImageList列表中的角标
/// </summary>
/// <param name="image">当前ImageColorPicker</param>
/// <returns></returns>
int GetIndex(ImageColorPicker image)
{
object targetTag = image.Tag;
int index = -; for (int i = ; i < ImageList.Count; i++)
{
ImageColorPicker obj = ImageList[i];
if (obj.Equals(image))
{
index = i;
break;
}
} return index;
}
【WPF/C#】图层筛选/拾取——Color Picker的更多相关文章
- NX二次开发-Block UI C++界面Object Color Picker(对象颜色拾取器)控件的获取(持续补充)
Object Color Picker(对象颜色拾取器)控件的获取 NX9+VS2012 #include <uf.h> #include <uf_obj.h> UF_init ...
- [wordpress]后台自定义菜单字段和使用wordpress color picker
Wordpress Version 4.4.2 参考链接 插件使用wordpress color picker:Add A New Color Picker To WordPress 后台菜单自定义字 ...
- 使用canvas制作的移动端color picker
使用canvas制作的移动端color picker 项目演示地址(用手机或者手机模式打开) 我在另一个中demo,需要用到color picker,但是找不到我需要的移动端color picker, ...
- WPF 自定义列表筛选 自定义TreeView模板 自定义ListBox模板
有很多项目,都有数据筛选的操作.下面提供一个案例,给大家做参考. 左侧是数据源,搜索框加TreeView控件,右侧是ListBox控件.在左侧数据列点击添加数据,然后点击确定,得到所筛选的数据. 下面 ...
- 例子:Camera Color Picker Sample (YCbCr->ARGB)
本例演示了如何从相机preview缓冲区获取YCbCr模块,并且转化为ARGB. 1. 什么是YCbCr y:像素的亮度.以范围从 0 到 255 的字节值形式返回(亮度值始终为正值). cr:像素的 ...
- 颜色采集器colpick Color Picker
简单 RGB.HSB.十六进制颜色选取器 jQuery 插件. 非常直观类似 Photoshop 的界面. 光明和黑暗很容易自定义 CSS3 外观. 28 KB 总由浏览器加载看起来不错甚至在 IE7 ...
- C# WPF Datagrid的筛选
public static void SearchResult(DataGrid dg,string condition) { #region string code = string.Empty; ...
- Linux下无法运行Color picker
➜ ~ com.github.ronnydo.colorpicker com.github.ronnydo.colorpicker: error while loading shared librar ...
- An easy to use android color picker library
https://github.com/xdtianyu/ColorPicker
随机推荐
- PHP中数字检测is_numeric与ctype_digit的区别介绍
PHP中的两个函数is_numeric和ctype_digit都是检测字符串是否是数字,但也存在一点区别 is_numeric:检测是否为数字字符串,可为负数和小数 ctype_digit:检测字符串 ...
- SharePoint 2013 Farm 安装指南——构建一个双层SharePoint Farm
最近要对公司里的SharePoint进行升级,由于旧的系统SharePoint 2010已经有2年了,上面改动比较多,而且权限也很混乱了,所以下定决心要对其做一次升级,重新部署一台新的SharePoi ...
- 网站启用SSL后重启Nginx提示 Enter PEM Pass Phrase:需要输入密码
最近在玩 STARTSSL 感觉个人站点使用这个SSL差不多也够用了.真正商用的SSL当然也可以自行购买. 我个人是为了防止数据中间被抓走,所以用了startssl 也基本就够用了. 转回正题,st ...
- MySql(十四):MySql架构设计——可扩展性设计之数据切分
一.前言 通过 MySQL Replication 功能所实现的扩展总是会受到数据库大小的限制,一旦数据库过于庞大,尤其是当写入过于频繁,很难由一台主机支撑的时候,我们还是会面临到扩展瓶颈.这时候,我 ...
- Scala语言开发入门
在本系列的第一篇文章 <使用递归的方式去思考>中,作者并没有首先介绍 Scala 的语法,这样做有两个原因:一是由于过多的陷入语法的细节其中,会分散读者的注意力.反而忽略了对于基本概念,基 ...
- c#中lock的使用(用于预约超出限额的流程)
一个项目,预约系统,核心二张表:预约表,预约限额表 用户点击预约按钮后, 1. 先select 预约限额表把该预约时间段的限额取出来, 2. 再select 预约表把该预约时间已经预约上的次数算出来 ...
- 【Unity】6.2 在VS2015中调试 C# 脚本
分类:Unity.C#.VS2015 创建日期:2016-04-16 一.简介 这一节先利用GUI显示一个简单的界面(以后还会专门介绍GUI),并解释如何在VS2015中调试C#脚本. 本节例子的运行 ...
- ExtJs--05--给window组件加入功能条以及子组件获取上级或下级组件的属性和方法
Ext.onReady(function(){ /** 1-- 给容器组件加入控制条 及 控制项 控制条 不同的方向有多种 tbar lbar rbar bbar fbar 2-- 依据组件本身拿到上 ...
- fork failed.: Cannot allocate memory
在做压力测试时候: [root@666 ok]# webbench -c 5000 -t30 http://10.100.0.61/ Webbench - Simple Web Benchmark 1 ...
- .net core 调用数字证书 使用X509Certificate2
.NET下面的 .netfromwork使用和asp.net core下使用方式不一样 配置文件中代码: public const string API_URL = "https://api ...