c# - wpf中可点击图像映射的最佳方式

Question

我在 C# WPF 中有一个包含很多部分的图像 我想让每个部分都点击 make think 我试图将图像分成几部分并在每个部分上进行事件 图像，但问题是图像的嵌套部分 制作图像 map 的最佳方法是什么？

Answer 1

您可以使用 Microsoft Expression Studio 中包含的 Expression Design 轻松完成此操作。这是您要执行的步骤:

1. 将图像添加到 Expression Design。
2. 然后您可以使用画笔工具将图像分割成您想要的部分。
3. 然后您必须将其导出到 xaml。在导出窗口中，您可以选择 Xaml Silverlight 3

Canvas 作为格式，路径作为文本。

如您所知，它会自动将您在图像上绘制的对象转换为具有所有坐标的路径对象。

然后您可以复制导出的 xaml 并将其粘贴到您的应用程序中。

您可以从 Dreamspark 免费下载 Expression Studio。

我刚刚制作了示例并将其导出到 xaml:

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="Untitled1" Width="62" Height="62" Clip="F1 M 0,0L 62,0L 62,62L 0,62L 0,0" UseLayoutRounding="False">
    <Canvas x:Name="Layer_1" Width="62" Height="62" Canvas.Left="0" Canvas.Top="0">
        <Image x:Name="Image" Source="Untitled1_files/image0.png" Width="1920" Height="1080" Canvas.Left="0" Canvas.Top="0">
            <Image.RenderTransform>
                <TransformGroup>
                    <MatrixTransform Matrix="1,0,0,1,-929.667,-510.667"/>
                </TransformGroup>
            </Image.RenderTransform>
        </Image>
        <Path x:Name="Path" Width="159.722" Height="161.743" Canvas.Left="82.757" Canvas.Top="-0.415951" Stretch="Fill" Fill="#FFE7DEDE" Data="F1 M 82.8307,30.8333C 81.8859,46.01 90.3304,60.6249 90.3304,75.831C 90.3304,88.8304 91.9427,101.93 90.3304,114.829C 89.0281,125.247 87.0101,136.367 90.3304,146.327C 95.3301,161.327 119.518,161.327 135.328,161.327C 157.018,161.327 175.778,144.86 193.825,132.828C 209.523,122.363 235.198,120.495 241.823,102.83C 243.994,97.0391 240.326,90.2367 237.323,84.8306C 230.656,72.8294 223.759,60.756 214.824,50.3323C 205.057,38.9377 205.748,18.0458 192.325,11.3342C 183.723,7.03329 173.332,8.29683 163.827,6.83447C 144.945,3.92956 125.479,-3.30947 106.83,0.834766C 94.3289,3.61269 83.6265,18.0524 82.8307,30.8333 Z "/>
    </Canvas>
</Canvas>

导出的部分是Path对象。你可以在上面做任何你想做的事。例如，您可以处理此路径的 MouseClick 事件并更改路径的背景....