首页 > 解决方案 > 如何创建和使用外部 XAML 图像的 ResourceDictionary

问题描述

我想为 WPF 应用程序使用 Visual Studio 图标集的图标,并且我想使用 ResourceDictionaries 正确地做到这一点,但它似乎比我想象的更具挑战性。

示例图标是ViewBox在单独的 XAML 文件中提供的,它的名称home_16x.xaml和 XAML 内容如下所示:

<Viewbox Width="16" Height="16" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <Rectangle Width="16" Height="16">
    <Rectangle.Fill>
      <DrawingBrush>
        <DrawingBrush.Drawing>
          <DrawingGroup>
            <DrawingGroup.Children>
              <GeometryDrawing Brush="#00FFFFFF" Geometry="F1M16,16L0,16 0,0 16,0z" />
              <GeometryDrawing Brush="#FFF6F6F6" Geometry="F1M7.8786,-0.000199999999999534L-0.000399999999999956,7.8798 -0.000399999999999956,9.4138 0.9996,10.4138 0.9996,15.9998 15.0006,15.9998 15.0006,10.4138 16.0006,9.4138 16.0006,7.8798 8.1206,-0.000199999999999534z" />
              <GeometryDrawing Brush="#FFF0EFF1" Geometry="F1M13,14L10,14 10,9 6,9 6,14 3,14 3,7.707 8,2.707 13,7.707z" />
              <GeometryDrawing Brush="#FF424242" Geometry="F1M0.6462,8.6461L1.3532,9.3531 2.0002,8.7071 2.0002,15.0001 7.0002,15.0001 7.0002,10.0001 9.0002,10.0001 9.0002,15.0001 14.0002,15.0001 14.0002,8.7071 14.6462,9.3531 15.3532,8.6461 8.0002,1.2931z M3.0002,7.7071L8.0002,2.7071 12.9992,7.7071 12.9992,14.0001 10.0002,14.0001 10.0002,9.0001 6.0002,9.0001 6.0002,14.0001 3.0002,14.0001z" />
            </DrawingGroup.Children>
          </DrawingGroup>
        </DrawingBrush.Drawing>
      </DrawingBrush>
    </Rectangle.Fill>
  </Rectangle>
</Viewbox>

如果我在我的页面上使用以下内容,那么它可以工作,但这不是我所追求的。它看起来并不优雅,我想保持打开选项以切换 ResourceDictionaries(用于主题)。

<Viewbox Width="400" Height="400">
    <Frame Source="\Media\Icons\Home_16x.xaml"/>
</Viewbox>

它还在设计视图中显示了以下内容,这很令人困惑: 在此处输入图像描述

我真的很希望能够建立一个图标字典,我可以用类似的东西(或者更干净,如果可能的话)调用它:

<Viewbox Width="400" Height="400">
    <Frame Content="{StaticResource ResourceKey=Icons.Home}"/>
</Viewbox>

我当前的IconsResourceDictionary 如下所示:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <Viewbox x:Key="Home">
        <Viewbox.Resources>
            <ResourceDictionary>
                <Frame x:Key="Home" Source="\Media\Icons\Home_16x.xaml"/>
            </ResourceDictionary>
        </Viewbox.Resources>
    </Viewbox>

</ResourceDictionary>

我承认我很迷茫。任何帮助将非常感激。

标签: wpfxaml

解决方案


如果您在矩形上使用视觉刷作为填充,它将拉伸到矩形的任何大小。

因此,您可以在资源字典中有一个视觉刷:

    <DrawingBrush x:Key="HomeBrush">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <DrawingGroup.Children>
                    <GeometryDrawing Brush="#00FFFFFF" Geometry="F1M16,16L0,16 0,0 16,0z" />
                    <GeometryDrawing Brush="#FFF6F6F6" Geometry="F1M7.8786,-0.000199999999999534L-0.000399999999999956,7.8798 -0.000399999999999956,9.4138 0.9996,10.4138 0.9996,15.9998 15.0006,15.9998 15.0006,10.4138 16.0006,9.4138 16.0006,7.8798 8.1206,-0.000199999999999534z" />
                    <GeometryDrawing Brush="#FFF0EFF1" Geometry="F1M13,14L10,14 10,9 6,9 6,14 3,14 3,7.707 8,2.707 13,7.707z" />
                    <GeometryDrawing Brush="#FF424242" Geometry="F1M0.6462,8.6461L1.3532,9.3531 2.0002,8.7071 2.0002,15.0001 7.0002,15.0001 7.0002,10.0001 9.0002,10.0001 9.0002,15.0001 14.0002,15.0001 14.0002,8.7071 14.6462,9.3531 15.3532,8.6461 8.0002,1.2931z M3.0002,7.7071L8.0002,2.7071 12.9992,7.7071 12.9992,14.0001 10.0002,14.0001 10.0002,9.0001 6.0002,9.0001 6.0002,14.0001 3.0002,14.0001z" />
                </DrawingGroup.Children>
            </DrawingGroup>
        </DrawingBrush.Drawing>
    </DrawingBrush>

并使用它:

    <Rectangle Fill="{StaticResource HomeBrush}" Width="16" Height="16"/>

或者你可以让你的矩形填充它所在的网格的任何单元格并省略宽度和高度。您不需要视图框来缩放矢量,它们可以拉伸。

您还可以在路径中使用视觉画笔。该路径可以定义一个带有几何图形(可能来自资源)的形状,并且您的画笔可以在其中放置另一个具有不同颜色的几何图形。

我有一个资源文件的示例几何:

 <Geometry x:Key="BeeIcon">
    M15.551045,25.144995L16.748029,25.144995 ....
 </Geometry>

我在那里删除了一大块几何图形。

然后可以在不同的绘图组中重新使用 BeeIcon,如果您想构建具有多个部分的图标,这将非常有用。

它们的画笔和颜色也可以来自资源字典,因此您可以将它们切换为不同的主题或品牌。


推荐阅读