使用自定义按钮样式更改按钮内容前景或描边颜色

Change button content foreground or stroke color using a custom button style

我尝试使用自定义按钮样式更改鼠标悬停时按钮内容的椭圆的描边,如下所示:

<Style x:Key="MyButtonStyle" TargetType="ButtonBase">
    <Setter Property="Foreground" Value="Black"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ButtonBase">
                <Grid x:Name="RootGrid">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Blue" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter
                            x:Name="ContentPresenter"
                            Foreground="{TemplateBinding Foreground}" 
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            ContentTransitions="{TemplateBinding ContentTransitions}"
                            Content="{TemplateBinding Content}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

为什么只有带有文本 "Working" 的 TextBlock 更改其前景 属性?

<Button x:Name="MyButton" Style="{StaticResource MyButtonStyle}">
    <StackPanel>
                <Ellipse Width="20" Height="20" Stroke="{x:Bind MyButton.Foreground, Mode=OneWay}"></Ellipse>
                <TextBlock Foreground="{x:Bind MyButton.Foreground, Mode=OneWay}" Text="Not Working" />
                <TextBlock Text="Working" />
    </StackPanel>
</Button>
  1. 您的视觉状态动画正在修改 ContentPresenter 的前景,而不是 Button (MyButton) 的前景。
  2. 使用 ContentControl 而不是 ContentPresenter 以访问模板中的其他属性。
  3. 访问一些其他控件的Foreground,如下所示。

代码:

<StackPanel>
     <Ellipse Width="20" Height="20" Stroke="{x:Bind MyText.Foreground, Mode=OneWay}"></Ellipse>
     <TextBlock Foreground="{x:Bind MyText.Foreground, Mode=OneWay}" Text="Not Working" />
     <TextBlock x:Name="MyText" Text="Working" />
</StackPanel>