我正在使用Material Design Font Icons作为我项目的图标源。问题是,因为它是一种 * 字体 *,所以在选择和取消选择时需要不同的颜色(如图所示-取消选择的白色字体有白色图标,这并不可怕)。
如何修改Style
来改变图标的颜色,就像改变文本和背景颜色一样?
<!-- redacted because it would've never worked -->
编辑1:
人们普遍认为使用VSM是行不通的,因为它不是从VisualElement
派生的。我已经使用Trigger
使它工作了--但是我对实现不满意。这是可行的:
<Shell.Resources>
<ResourceDictionary>
<Style TargetType="FlyoutItem" BasedOn="{StaticResource BaseStyle}">
<Style.Triggers>
<Trigger TargetType="FlyoutItem" Property="IsChecked" Value="True">
<Setter Property="Title" Value="Checked" />
<Setter Property="FlyoutIcon" >
<Setter.Value>
<FontImageSource FontFamily="MaterialDesignIconFont"
Glyph="{StaticResource InformationOutlineGlyph}"
Color="White" />
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</Shell.Resources>
<FlyoutItem Title="About" >
<FlyoutItem.Icon>
<FontImageSource FontFamily="MaterialDesignIconFont"
Glyph="{StaticResource InformationOutlineGlyph}"
Color="Green" />
</FlyoutItem.Icon>
<ShellContent Route="AboutPage" ContentTemplate="{DataTemplate local:AboutPage}" />
</FlyoutItem>
...但是正如您所看到的,我必须设置整个FontImageSource
值-它具有Glyph
属性-所以我每次都必须为每个FlyoutItem
重复Style
。
如何重写这个Style
,使其可重用,并且只更改颜色,而不更改其他属性?
2条答案
按热度按时间jbose2ul1#
我也有同样的问题,并解决了它如下
使用其他
IconGlyphProperty
建立自订图标列使用两个标签和VisualStateManager创建FlyoutItemTemplate
将AppShell.xaml中的原始FlyoutItem替换为自定义FlyoutItem
将基本样式添加到customFlyouItem
以下是结果
yvgpqqbh2#
建立
Material Design Icons
。有关材质设计图标的更多详细信息,您可以从GitHub下载。https://github.com/WendyZang/Test/tree/master/MaterialDesignIcons/App2
然后创建样式以在选择时更改背景颜色。
使用
Triggers
更改标签文本颜色。截图:
更新日期:
变更:
收件人:
Shell项模板的whold触发器。
截图: