使用画布和路径创建的WPF更改图标颜色

时间:2018-08-30 06:11:45

标签: wpf xaml icons

我有一个使用画布和路径创建的图标。我可以重用此图标,但是如何从“外部”(即从视图)更改图标的颜色

<Canvas x:Key="MyIcon" Width="40.000" Height="23.889">
    <!-- Layer 1/<Group>/<Compound Path> -->
    <Path Fill="#ffffffff" Data="F1 M 36.074,14.516 C 36.117,10.711 33.078,7.540 29.332,7.478 Z"/>

    <!-- Layer 1/<Group>/<Compound Path> -->
    <Path Fill="#ffffffff" Data="F1 M 35.848,2.368 C 36.766,3.651 37.097,3.832 38.095,3.558 C 38.345,3.489 38.523,3.159 38.735,2.950 C 38.499,2.756 38.281,2.426 38.025,2.395  Z"/>

    <!-- Layer 1/<Group>/<Path> -->
    <Path Fill="#ffffffff" Data="F1 M 35.307,14.487 C 35.268,17.908 32.499,20.618 29.098,20.563 C 25.615,20.506 22.916,17.747 22.947,14.274 Z"/>
</Canvas>

使用此图标,它将始终为白色。我可以进行哪些更改,以便可以从xaml更改颜色?例如,现在我显示如下图标:

<ContentControl Content="{StaticResource MyIcon}" />

我假设要更改颜色,语法将如下所示:

<ContentControl Content="{StaticResource MyIcon}" Color={StaticResource BlueBrush} />

1 个答案:

答案 0 :(得分:2)

通过串联三个路径的数据字符串将“画布”转换为“几何”资源:

<Geometry x:Key="MyIcon">F1 M 36.074,14.516 C 36.117,10.711 33.078,7.540 29.332,7.478 Z M 35.848,2.368 C 36.766,3.651 37.097,3.832 38.095,3.558 C 38.345,3.489 38.523,3.159 38.735,2.950 C 38.499,2.756 38.281,2.426 38.025,2.395 Z M 35.307,14.487 C 35.268,17.908 32.499,20.618 29.098,20.563 C 25.615,20.506 22.916,17.747 22.947,14.274 Z</Geometry>

使用具有单个Path元素而不是ContentControl的资源:

<Path Data="{StaticResource MyIcon}" Fill="Blue"/>