如何在 UWP 中使 PathIcon 拉伸

How to make PathIcon stretch in UWP

我想使用 PathIcon 与文本大小相同,例如 NavigationItem。我尝试使用 <Image> 来实现它。

image

但我想使用图标,因为它可以在深色或白色模式下自动更改颜色。

<StackPanel Orientation="Horizontal" >
    <Rectangle Width="20" Fill="BlanchedAlmond"/>
    <PathIcon Data="{StaticResource PowerPlantIcon}"/>
    <Rectangle Width="20" Fill="BlanchedAlmond"/>
    <PathIcon Data="{StaticResource PowerPlantIcon}" Height="20"/>
    <TextBlock Text="This is a Text" FontSize="20" VerticalAlignment="Center"/>
</StackPanel>

我明白了:

image

这是我在 App.xmal

中定义的自定义 PathIcon
<x:String x:Key="PowerPlantIcon">
   M43,50H36.12V46.24h5.27l4.85-4.85V8.55L41.38,3.76H36.12V0H43l7,7V43ZM13.87,50H7L0,43V7L7,0h6.88V3.76H8.55L3.76,8.55V41.38l4.79,4.79h5.33Zm4.7-7.06L32.46,23.59l-7-.58L31.35,8.7H20.29L17.56,25.53l4.44.55Z
</x:String>

我发现图标大小已自动设置为 50x50,无法通过设置宽度或高度进行更改。

搜索了所有我能找到的东西后,没有找到使 PathIcon 拉伸的解决方案。

您可以通过将 PathIcon 放入 ViewBox 来调整 PathIcon 的大小。可以将ViewBox控件的Width属性和Height属性绑定到TextBlock控件上实现拉伸效果。

请参考以下代码:

<StackPanel Orientation="Horizontal" >
    <Rectangle Width="20" Fill="BlanchedAlmond"/>
    <PathIcon Data="{StaticResource PowerPlantIcon}"/>
    <Rectangle Width="20" Fill="BlanchedAlmond"/>
    
    <Viewbox Height="{Binding Path=ActualHeight,ElementName=textBlock}" Width="{Binding Path=ActualHeight,ElementName=textBlock}">
        <PathIcon Data="{StaticResource PowerPlantIcon}"/>
    </Viewbox>
    <TextBlock x:Name="textBlock" Text="This is a Text" FontSize="20" VerticalAlignment="Center"/>
</StackPanel>