文章标题实在不懂怎么表述才清楚。
描述问题：多个图片（图层）重叠时，如何通过鼠标点击来拾取到相应的图层。因为图层中会有很多空白的地方（比如图片四周），要求是获取鼠标点击位置的像素颜色值，如果为空白时或透明度小于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;
}