65.9K
CodeProject 正在变化。 阅读更多。
Home

C# Windows Forms ImageMap控件

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.81/5 (38投票s)

2002 年 9 月 1 日

3分钟阅读

viewsIcon

283707

downloadIcon

9834

用于Windows Forms应用程序的ImageMap控件。

Mouse hovering on red polygon  Mouse clicked on white rectangle

引言

我注意到在各种新闻组上,有人请求在 Windows Forms 应用程序中使用图像地图控件。 我之前没有过多地使用 System.Drawing 命名空间,所以我决定试一试。 这个控件就是结果。

工作原理

该控件内部使用标准的 PictureBox 控件,特别是它加载和显示图像的能力,以及它继承的 MouseMoveMouseLeaveClick 事件。 ToolTip 组件也被用于显示已定义区域的工具提示。 目前,为区域指定的 key 用于工具提示文本,尽管允许为每个区域分配额外的“tooltip”属性是很容易的。

大部分逻辑都在下面显示的私有 getActiveIndexAtPoint 方法中。 只要鼠标在控件内移动,就会调用该方法来确定鼠标是否在任何区域内。 如果鼠标在区域内,该方法将返回该区域的索引。 此索引用于查找该区域的键,然后使用该键设置工具提示显示的文本。 光标也会变成手形,并且索引存储在私有属性中以供重复使用,如果单击鼠标,则无需再次调用此方法。 如果该方法未找到区域,则返回 -1,并且光标设置为其默认值。

private int getActiveIndexAtPoint(Point point)
{
    System.Drawing.Drawing2D.GraphicsPath path = new System.Drawing.Drawing2D.GraphicsPath();
    System.Drawing.Drawing2D.GraphicsPathIterator iterator = 
                new System.Drawing.Drawing2D.GraphicsPathIterator(_pathData);
    iterator.Rewind();
    for(int current=0; current < iterator.SubpathCount; current++)
    {
        iterator.NextMarker(path);
        if(path.IsVisible(point, this._graphics))
            return current;
    }
    return -1;
}

如何使用它

您可以像添加任何其他 .NET 控件一样将此控件添加到您的工具箱中。 添加后,只需将该控件的实例拖放到您的表单上即可。 使用 Image 属性将所需的图像分配给控件。

一旦您将控件添加到您的表单中,您就可以开始调用各种 Add- 方法来定义图像中的“热点”。 可用的方法有 AddEllipseAddRectangleAddPolygon。 我尝试遵循 HTML 图像地图在定义各种形状方面的惯例,并且我重载了 AddElipseAddRectangle 方法,以接受“.NET 友好”类型,如 PointRectangle。 由于这些方法遵循 HTML 图像地图的惯例,您应该可以使用任何现有的图像地图生成软件来准确确定在图像中指定所需区域的哪些点。

这是使用第一个屏幕截图中的图像定义 HTML 图像地图所需的代码

<!--Text BUTTON-->
   <area shape="rect" coords="140,20,280,60">

<!--Triangle BUTTON-->
   <area shape="poly" coords="100,100,180,80,200,140">

<!--Face BUTTON-->
   <area shape="circle" coords="80,100,60">

以下是使用此控件定义的等效区域

this.imageMap1.AddRectangle("Rectangle", 140, 20, 280, 60);
this.imageMap1.AddPolygon("Polygon", new Point[] {new Point(100, 100), 
                          new Point(180, 80), new Point(200, 140)});
this.imageMap1.AddElipse("Ellipse", 80, 100, 60);

当鼠标在已定义区域内单击时,该控件将引发一个事件 - RegionClick。 该事件传递两个值,表示被单击区域的索引和键。 然后,您将根据单击的区域采取您希望的任何操作。

就是这样! 我希望这能满足那些请求在 Windows Forms 应用程序中使用图像地图控件的人的需求。 欢迎提出意见和要求。

© . All rights reserved.