WPF 使用 Canvas 作为 ImageSource

Question

我是 WPF 的新手，正在尝试构建一个带有工具栏和图标的基本应用程序。我正在测试来自 Infragistics 的 XamRibbon 和功能区上显示的 ButtonTool 需要 ImageSource 来显示这样的图像:

 <igRibbon:ButtonTool Caption="Edit"
                                             igRibbon:RibbonGroup.MaximumSize="ImageAndTextLarge"
                                             LargeImage="{StaticResource stop}"
                                             SmallImage="{StaticResource stop}" />

我的字典中定义了一个带有“停止”键的 XAML 图标，但我使用的图标都是 Canvas 形式，如下所示:

 <Canvas Width="32" Height="32" Canvas.Left="0" Canvas.Top="0">
<Canvas Clip="M15.82,31.2118l2.0148,-3.8306l-0.0332,-0.0332l0.1068,-0.1068l0.5615,-1.0675l0.253,0.253l8.5884,-8.5885l-0.0112,-0.0111l1.6101,-1.5876c0.4557,-0.4557,0.923,-0.5523,1.234,-0.5523c0.311,0,0.7784,0.0967,1.239,0.5572l0.6169,0.6168V0H0v32h15.7137C15.656,31.7398,15.6889,31.4614,15.82,31.2118z">
  <Canvas>
    <Canvas.RenderTransform>
      <TransformGroup>
        <TranslateTransform X="-1" Y="-1"/>
      </TransformGroup>
    </Canvas.RenderTransform>
    <Polygon Points="17,28 17,24.5 15,24.5 15,28 3,28 3,30 29,30 29,28" Fill="#4EA17E" StrokeLineJoin="Miter"/>
    <Path Data="M18.475,31h-4.9c-0.3038,0,-0.575,-0.1962,-0.575,-0.5v-2.95c0,-0.3038,0.2712,-0.55,0.575,-0.55h4.9c0.3038,0,0.55,0.2462,0.55,0.55V30.5C19.025,30.8038,18.7788,31,18.475,31z" Fill="#797979"/>
    <Path Data="M28,1H4c-0.5523,0,-1,0.4477,-1,1v5c0,0.5523,0.4477,1,1,1h24c0.5523,0,1,-0.4477,1,-1V2C29,1.4477,28.5523,1,28,1zM7,6H5V3h2V6zM28,9H4c-0.5523,0,-1,0.4477,-1,1v5c0,0.5523,0.4477,1,1,1h24c0.5523,0,1,-0.4477,1,-1v-5C29,9.4477,28.5523,9,28,9zM7,14H5v-3h2V14zM28,17H4c-0.5523,0,-1,0.4477,-1,1v5c0,0.5523,0.4477,1,1,1h24c0.5523,0,1,-0.4477,1,-1v-5C29,17.4477,28.5523,17,28,17zM7,22H5v-3h2V22z" Fill="#3E79B4"/>
    <Path Data="M7,22H5v-3h2V22zM7,11H5v3h2V11zM7,3H5v3h2V3z" Fill="#FFFFFF"/>
  </Canvas>
</Canvas>
<Canvas>
  <Path Data="M19.2158,27.348l9.0199,-9.0199l2.1233,2.1233l-9.0199,9.0199L19.2158,27.348zM29.6123,16.9515c0.3525,-0.3525,0.7113,-0.3525,1.0638,0l1.0596,1.0596c0.3525,0.3525,0.3525,0.7113,0,1.0638l-0.8743,0.8743l-2.1388,-2.1202L29.6123,16.9515zM16.7052,31.677l2.0176,-3.8361l2.1233,2.1233l-3.8361,2.0176c-0.061,0.0321,-0.1358,0.0207,-0.1846,-0.028l-0.0923,-0.0923C16.6845,31.8128,16.6732,31.738,16.7052,31.677z" Fill="#3E79B4"/>
</Canvas>

如何将 Canvas XAML 转换为可用作 ImageSource 的内容，例如 DrawingImage？我希望这是有道理的。

Answer 1

我不使用 Infragistics 控件，但我相信它们遵循标准的 WPF 控件。

我使用了 image 控件并尝试显示您的 Canvas 路径图像。

从资源中的 Canvas 路径定义几何

<Geometry x:Key="StopGeometry">M13,11.3814v18.115c0.0083,0.2845,0.2134,0.5036,0.4896,0.5036h4c0.2807,0,0.5104,-0.2297,0.5104,-0.5104v-18.088l7.6585,7.6695c0.1259,0.1261,0.3415,0.0369,0.3415,-0.1413v-6.2525c0,-0.2125,-0.0845,-0.4162,-0.2349,-0.5663l-9.934,-9.9139c-0.2999,-0.2654,-0.4015,-0.2654,-0.6944,0.0157L5.235,12.0908c-0.1504,0.1501,-0.235,0.3539,-0.235,0.5664v6.2414c0,0.1782,0.2154,0.2674,0.3414,0.1414L13,11.3814z</Geometry>

在 XAML 中

<Image Height="100" Width="100">
            <Image.Source>
                <DrawingImage >
                    <DrawingImage.Drawing>
                        <GeometryDrawing Brush="#3E79B4"  Geometry="{StaticResource StopGeometry}"/>
                    </DrawingImage.Drawing>
                </DrawingImage>
            </Image.Source>
</Image>