按钮前景色在按下时更改
本文关键字：前景色 按钮 | 更新日期: 2023-09-27 18:00:15
我正在编写一个Windows 10 UWP应用程序。我创建了一个按钮，其中包含带有两个文本块的堆栈面板。我想在按下时更改这些文本块的前景。
我修改了默认按钮样式。 因此，单击此按钮时，边框画笔正在更改，但文本块的前景不会更改。
<Button Command="{Binding}" Style="{StaticResource Button|SecondaryPurpleButtonStyle}" >
<Button.Content>
<StackPanel Orientation="Horizontal">
<TextBlock Margin="4" Style="{StaticResource TextBlock|MenuIconTextBlockStyle}" Foreground="{StaticResource Color|BrandLogoPurpleSolidColorBrush}"
Text="" />
<TextBlock Style="{StaticResource ThemedBodyTextBlockStyle}" Foreground="{StaticResource Color|BrandLogoPurpleSolidColorBrush}"
Margin="4" Text="Add to Shortlist" />
</StackPanel>
</Button.Content>
</Button>
风格：
<Style x:Key="Button|SecondaryPurpleButtonStyle"
TargetType="Button">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Foreground" Value="{StaticResource Color|BrandLogoPurpleSolidColorBrush}" />
<Setter Property="BorderBrush" Value="{StaticResource Color|BrandLogoPurpleSolidColorBrush}" />
<Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" />
<Setter Property="Padding" Value="8,4,8,4" />
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
<Setter Property="UseSystemFocusVisuals" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid x:Name="RootGrid"
Background="{TemplateBinding Background}">
<ContentPresenter x:Name="ContentPresenter"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
AutomationProperties.AccessibilityView="Raw"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="0.7"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
ContentTransitions="{TemplateBinding ContentTransitions}"
Padding="{TemplateBinding Padding}" />
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<Storyboard>
<PointerUpThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="PointerOver">
<Storyboard>
<!--<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BrandLogoOrangePointerChangeSolidColorBrush}"/>
</ObjectAnimationUsingKeyFrames>-->
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{StaticResource Color|BrandLogoLightestPurplePointerChangeSolidColorBrush}" />
</ObjectAnimationUsingKeyFrames>
<!--<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource OLXLogoOrangeSolidColorBrush}"/>
</ObjectAnimationUsingKeyFrames>-->
<PointerUpThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{StaticResource Color|BrandLogoPurpleSolidColorBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{StaticResource Color|BrandLogoPurpleSolidColorBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="White" />
</ObjectAnimationUsingKeyFrames>
<PointerDownThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemControlBackgroundBaseLowBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemControlDisabledBaseLowBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{ThemeResource SystemControlDisabledTransparentBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
在 XAML 代码中，已将TextBlock 的 Foreground 属性设置为显式{StaticResource Color|BrandLogoPurpleSolidColorBrush}。所以前景不会改变。
为了确保文本块的前景可以BorderBrush更改，请删除TextBlock中的Foreground属性，并确保Foreground属性没有以TextBlock的样式设置。
<Button Command="{Binding}" Style="{StaticResource Button|SecondaryPurpleButtonStyle}" >
<Button.Content>
<StackPanel Orientation="Horizontal">
<TextBlock Margin="4" Style="{StaticResource TextBlock|MenuIconTextBlockStyle}" Text="" />
<TextBlock Style="{StaticResource ThemedBodyTextBlockStyle}" Margin="4" Text="Add to Shortlist" />
</StackPanel>
</Button.Content>
</Button>
这样Button.Content中的TextBlock将使用ContentPresenter的Foreground，可以在不同的VisualState中进行更改。