如何将 WPF 样式应用于按钮模板的子项

Question

我是 WPF 新手，我想更改按钮模板的文本和图标的颜色。但似乎我只能改变不透明度。我想我应该将样式应用于按钮的子项，但我不知道如何。

这是模板：

<Button x:Name="btnApp1" Width="56" Height="66" Margin="0,0,0,0" Style="{StaticResource AppButton}">
        <Button.Template>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <iconPacks:PackIconMaterial Kind="StarOutline"  Width="48" Height="48" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="#FFFFFFFF" />
                    <TextBlock x:Name="tButton" HorizontalAlignment="Center" VerticalAlignment="Bottom" Foreground="#FFFFFFFF" FontWeight="Bold">PVIE</TextBlock>
                </Grid>
            </ControlTemplate>
        </Button.Template>
    </Button>

样式如下：

<Style x:Key="AppButton" TargetType="{x:Type Button}">

    <Setter Property="Opacity" Value="0.25" />
    <Setter Property="Foreground" Value="#FFFF9966" />

    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0:0.3" />
                        <!--<ColorAnimation Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" To="Green" Duration="0:0:0:0.3" />-->

                        <ColorAnimationUsingKeyFrames Storyboard.Target="{Binding RelativeSource={RelativeSource TemplatedParent}}"
                                                        Storyboard.TargetProperty="(TextBox.Foreground).(SolidColorBrush.Color)">
                            <EasingColorKeyFrame KeyTime="0" Value="Green" />
                        </ColorAnimationUsingKeyFrames>

                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.25" Duration="0:0:0:0.3" />
                        <!--<ColorAnimation Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)" To="White" Duration="0:0:0:0.3" />-->

                        <ColorAnimationUsingKeyFrames Storyboard.Target="{Binding RelativeSource={RelativeSource TemplatedParent}}"
                                                        Storyboard.TargetProperty="(TextBox.Foreground).(SolidColorBrush.Color)">
                            <EasingColorKeyFrame KeyTime="0" Value="White" />
                        </ColorAnimationUsingKeyFrames>

                    </Storyboard>
                </BeginStoryboard>
            </Trigger.ExitActions>
        </Trigger>
    </Style.Triggers>

</Style>

感谢您的帮助。

Answer 1

绑定 TextBlock 的 Foreground 属性和 ControlTemplate 的 Icon 使用 {TemplateBinding}:

<Button x:Name="btnApp1" Width="56" Height="66" Margin="0,0,0,0" Style="{StaticResource AppButton}">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid>
                <iconPacks:PackIconMaterial Kind="StarOutline"  Width="48" Height="48" VerticalAlignment="Top" HorizontalAlignment="Center"
                                Foreground="{TemplateBinding Foreground}" />
                <TextBlock x:Name="tButton" HorizontalAlignment="Center" VerticalAlignment="Bottom" 
                           Foreground="{TemplateBinding Foreground}" FontWeight="Bold">PVIE</TextBlock>
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

如何将 WPF 样式应用于按钮模板的子项

How to apply WPF stype to children of button template

wpf

styles

google-material-icons