如何在C＃中使用WinForms实现类似于主页中具有地图区域的图像（在具有半透明矩形的覆盖区域）？

Question

我有一个面板（这里称为父母），我在其中绘制一张计算图片。 这张照片的一些矩形区域应该通过胡扯来突出。 它与使用的网页上的行为相同，并且，e。 G。 the german map on the right upper side

在旋转相应的矩形时，应用半透明的蓝色覆盖。 （并且取决于Alt，Ctrl和/或Shift等其他颜色的键，并且可点击）。

第一个解决方案是透明Panel的单个实例 - 继承自Panel类。 在父母的胡扯事件中，我移动并将单个实例调整到正确的位置，改变颜色。 这有一些问题： *移动和调整大小（SetBounds（））触发父项的MouseLeave事件和单个面板的MouseEnter事件。事件必须相应调整以使其正常工作，我做到了，但由于从列表中找到了正确的地图区域，因此速度非常慢。

第二种解决方案是为每个地图区域动态生成透明面板的实例。 每个透明面板必须设置e。 G。输入时Color.FromArgb（50，Color.Blue），和 离开面板时将其移除。 但它似乎比以前更慢。 如果鼠标匆匆赶过几张地图，那么它们就像被遮盖一样，然后慢慢变得透明。

是否有人知道这个要求的良好解决方案：

• 图片在父面板中调整大小，地图等也必须更改
• 部分透明突出显示的矩形区域。
• 检测到Ctrl / Shift / Alt作为区域的事件和颜色的变化。
• 检测那里的点击事件

我是否有更好的用于此目的的其他控件？

感谢基于实践的想法。

PS：The world map with satellite pictures更好地展示了我想做的事情： 在吸尘时，背景仍然或多或少可见。 但在我的情况下，父图像，它的大小和地图是在运行时计算的 （在用户完成设置后）。

Answer 1

解决方案

描述

我现在找到了一个解决方案，它可以用鼠标快速响应区域 主图片在PictureBox实例中绘制，更详细地说，其属性Image已分配 SizeMode属性设置为缩放，可自动居中并调整图像大小，同时保持指定图像的纵横比。
我为每个地图区域（子项）使用动态创建的Picturebox实例，如果鼠标没有覆盖它，则该实例是不可见的。
在地图区域上方移动孩子应该出现 - 这是在父PictureBox的鼠标移动事件中完成的， 我遍历孩子，检测鼠标位置是否在孩子的范围内。 找到的孩子可见。因此，鼠标进入该子控件 在子控件的leave事件中，我再次将其设置为不可见。 如果鼠标在所有地图区域上移动太快，我会遇到儿童控件鼠标离开事件的丢失。 我假设，如果鼠标指针在设置可见之前已经离开了该区域，则永远不会引发该事件 解决方案是，如果在父控件的鼠标移动事件处理程序中找不到（a）子控件，则所有（其他）子控件都设置为不可见。

实施步骤

如何实施我的解决方案：

• 使用设计的父PictureBox实例。
  • 将（动态）绘制的图片分配给Image属性
  • 将SizeMode设置为缩放
  • Picturebox个实例列表，作为表单字段

将新计算的图像分配给父Picturebox实例：

• 删除所有子控件，其事件处理程序，列表中的条目（如果它们已存在）。
• 为每个地图区域动态创建PictureBox实例，并将其添加到列表中。
  • 将其作为子控件添加到父PictureBox实例。
  • 将其Tag属性点设置为包含原始地图边界的数据对象和由矩形地图区域表示的对象。
  • 将边界设置为根据父Picturebox实例的边界缩放和居中的地图区域，使其适合自动缩放的图像。
  • 注册鼠标单击事件
  • 注册鼠标离开事件
  • 将背景颜色设置为e。 G。半透明绿色
  • 将Visible设为false

在父Picturebox实例中，鼠标悬停事件处理程序执行：

• 找到子Picturebox实例，鼠标指向
• 如果找到则将找到的孩子设为可见
• 设置所有（其他）子Picturebox隐身

在父Picturebox实例中，resize事件处理程序执行：

• 根据父图像的边界和父Picturebox实例的边界缩放/移动所有地图区域Picturebox实例。

每个地图区域Picturebox实例的鼠标离开事件设置为不可见（之前提到的事件丢失）。
每个地图区域Picturebox实例的鼠标单击事件通过单击地图区域来完成任何操作。 这里播放正确色调的正弦音调。

图片

下面的图片显示了带有地图区域的原型（尚未正确对齐，有些偏移）：

第一张图片用于说明父图片和所有地图区域。 在第一张图片中绘制主图片（比例）和所有地图区域（动态创建的子Picturebox实例）（通过禁用地图区域的不可见操作）。

第二张图片高效，鼠标悬停在音色G4上 在第二个图像中，表单已调整大小 - 因此父图像会自动居中并调整大小。 地图区域只是在父Bound的resize事件处理程序中的PictureBox属性中进行了更改。 并且已为地图区域启用了不可见操作。

Answer 2

我检查了ImageMap： 它是一个用户控件，包含在编译时之前绘制的静态图像。 在运行时，可添加可点击区域 - 可以使用矩形，多边形，椭圆形。 它使用PictureBox，它是作为ImageMap的子项创建的（继承自UserControl）。 它将Click，Move和Leave事件注册到其事件处理程序。 在这些事件处理程序中，它根据GraphicsPath实例中的路径列表检查当前位置，并返回索引（int）。 ImageMap跟踪最后选择的索引（-1 =未选择对象），相应地设置光标（手动或默认），设置或删除工具提示。 但它没有胡佛事件，它不会改变吸尘区域，就像我也需要它一样。

因此我需要ImageMap才能正确检测区域， 但我的照片是在运行时绘制的！ 而且我仍然需要用半透明层打开和关闭矩形。 我有了使用属性Visible打开和关闭区域控件的想法。 它更容易绘制，我将背景设置为父图像的一部分， 覆盖半透明颜色 - 这是一种解决方法，这是可能的， 因为地图相对固定在父图片上。 如果我有时间，我会测试这个解决方案的想法 - 这是一个私人项目，因此我不能全职工作： - ）。