4

尽可能多WPF,我使用这种模式来创建一个矢量图标:

1 - 定义 aCanvas包含数据:

资源项目

<Canvas Width="256" Height="256" ClipToBounds="True" x:Key="SubmitVisualIcon">
    <Path Fill="#FFFFFF00">
        <Path.Data>
            <PathGeometry FillRule="Nonzero" Figures="M44.436129,25.256006L54.222273,25.256006 75.259996,46.29286 70.368799,51.187792 54.094614,67.462006 44.561911,67.462006 44.436129,67.337162 62.016504,49.752106 15.633995,49.752106 15.633995,42.837337 62.016504,42.837337z M45,5.6100006C23.245507,5.6100006 5.6100006,23.245506 5.6100006,45 5.6100006,66.754498 23.245507,84.389999 45,84.389999 66.754499,84.389999 84.389997,66.754498 84.389997,45 84.389997,23.245506 66.754499,5.6100006 45,5.6100006z M45,0C69.852816,0 89.999998,20.147187 89.999998,45 89.999998,69.852814 69.852816,90.000004 45,90.000004 20.147188,90.000004 9.5367432E-07,69.852814 0,45 9.5367432E-07,20.147187 20.147188,0 45,0z"/>
        </Path.Data>
    </Path>
</Canvas>

2 - 在控制模板中使用它:

控制模板

<ControlTemplate x:Key="MyButton" TargetType="{x:Type Button}">
    <Border x:Name="root">
        <Grid>
            <Rectangle VerticalAlignment="Center" HorizontalAlignment="Center" 
                       RenderOptions.BitmapScalingMode="HighQuality"
                       Width="32" Height="32">
                <Rectangle.Fill>
                    <VisualBrush Stretch="Fill">
                        <VisualBrush.Visual>
                            <Binding Path="(ui:UIElement.VisualIcon)"
                                     RelativeSource="{RelativeSource TemplatedParent}"/>
                        </VisualBrush.Visual>
                    </VisualBrush>
                </Rectangle.Fill>
            </Rectangle>
            <ContentPresenter />
        </Grid>
    </Border>
</ControlTemplate>

whichui:UIElement.VisualIcon属性是一个附加属性,用于告诉模板使用哪个资源。例如:

<Button Content="Save" ui:UIElement.VisualIcon="{DynamicResource SubmitVisualIcon}">

现在,如您所见,我必须获取PathaCanvasFill

<Path Fill="#FFFFFF00">

问题是,是否可以将Fill值绑定到某个东西 on TemplatedParent?例如,我有一个附加属性来持有图标画笔:

<Button Content="Save" ui:UIElement.VisualIcon="{DynamicResource SubmitVisualIcon}"
                       ui:UIElement.VisualIconForeground="Some_Brush">

我试着像下面这样使用它:

<Path Fill="{Binding ui:UIElement.VisualIconForeground,RelativeSource={RelativeSource TemplatedParent}}">

但它不起作用。你有什么想法吗?我的意思是绑定资源项的某些属性以设置它们将被使用的位置?- 英语不好,我知道,对不起:(

4

2 回答 2

3

最后我找到了一个可行的解决方案。我应该使用Rectangle.OpacityMask而不是Rectangle.Fill

资源:

<Canvas Width="256" Height="256" ClipToBounds="True" x:Key="SubmitVisualIcon">
    <Path Fill="#FFFFFF00">
        <Path.Data>
            <PathGeometry FillRule="Nonzero" Figures="M44.436129,25.256006L54.222273,25.256006 75.259996,46.29286 70.368799,51.187792 54.094614,67.462006 44.561911,67.462006 44.436129,67.337162 62.016504,49.752106 15.633995,49.752106 15.633995,42.837337 62.016504,42.837337z M45,5.6100006C23.245507,5.6100006 5.6100006,23.245506 5.6100006,45 5.6100006,66.754498 23.245507,84.389999 45,84.389999 66.754499,84.389999 84.389997,66.754498 84.389997,45 84.389997,23.245506 66.754499,5.6100006 45,5.6100006z M45,0C69.852816,0 89.999998,20.147187 89.999998,45 89.999998,69.852814 69.852816,90.000004 45,90.000004 20.147188,90.000004 9.5367432E-07,69.852814 0,45 9.5367432E-07,20.147187 20.147188,0 45,0z"/>
        </Path.Data>
    </Path>
</Canvas>

模板:

<ControlTemplate x:Key="MyButton" TargetType="{x:Type Button}">
    <Border x:Name="root">
        <Grid>
            <Rectangle VerticalAlignment="Center" HorizontalAlignment="Center" 
                       RenderOptions.BitmapScalingMode="HighQuality"
                       Width="32" Height="32"
                       Fill="{TemplateBinding ui:UIElement.VisualIconForeground}">
                <!-- fill the rectangle with what color do you want, it also can be bounded to every thing -->
                <!-- and then, use the Canvas as a OpacityMask on rectangle, just like this: -->
                <Rectangle.OpacityMask>
                    <VisualBrush Stretch="Fill">
                        <VisualBrush.Visual>
                            <Binding Path="(ui:UIElement.VisualIcon)"
                                     RelativeSource="{RelativeSource TemplatedParent}"/>
                        </VisualBrush.Visual>
                    </VisualBrush>
                </Rectangle.OpacityMask>
                <!-- this will show the icon with color you defined in Rectangle.Fill -->
            </Rectangle>
            <ContentPresenter />
        </Grid>
    </Border>
</ControlTemplate>

用法:

<Button Content="Save" ui:UIElement.VisualIcon="{DynamicResource SubmitVisualIcon}"
                       ui:UIElement.VisualIconForeground="Some_Brush">

另一种用法:

<Button Content="Save" ui:UIElement.VisualIcon="{DynamicResource SubmitVisualIcon}"
                       ui:UIElement.VisualIconForeground="Some_Another_Brush">

另一种用法2:

<Button Content="Save" ui:UIElement.VisualIcon="{DynamicResource AnotherVisualIcon}"
                       ui:UIElement.VisualIconForeground="Some_Another_Brush">
于 2013-07-28T09:24:51.597 回答
1

太长的评论,所以我会在这里写:

如果我理解正确,SubmitVisualIcon是一个Resource. 资源Binding不支持,所以你不要Binding使用TemplatedParent,因为Resource它不是可视化树的一部分,也不是模板的一部分。可能您将不得不寻找替代方案。

作为替代方案,您可以使用应用程序支持的设置。在设置中设置颜色,并在资源中引用它,如下所示:

xmlns:properties="clr-namespace:MyNamespace.Properties"

<Path Fill="{Binding Source={x:Static properties:Settings.Default}, Path=SomeColor, Mode=TwoWay}" ... />

更多信息可以在这里这里找到。

于 2013-07-27T19:00:10.637 回答