当鼠标悬停时，Windows 8按钮消失

Question

我有一个如下的设置控件（我保证我真的没有把我的按钮叫做button_1和button_2）：

<UserControl
x:Class="App1.SettingsPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="646">
<Border BorderBrush="#FF590151" BorderThickness="1">
    <Grid Background="White" VerticalAlignment="Stretch">
        <Grid.RowDefinitions>
            <RowDefinition Height="80"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Background="Aqua" Grid.Row="0">
            <Grid Margin="40,20,17,13">
                <Grid.Transitions>
                    <TransitionCollection>
                        <EntranceThemeTransition FromHorizontalOffset="50" />
                    </TransitionCollection>
                </Grid.Transitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="50" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <Button Click="Button_Click_1" Margin="0,3,0,0" Grid.Column="0"
                    HorizontalAlignment="Left" Style="{StaticResource BackButtonStyle}"/>
                <TextBlock Margin="10,5,0,0" Grid.Column="1" FontFamily="Segoe UI"
                    FontWeight="SemiLight" FontSize="24.6667" Text="Settings" HorizontalAlignment="Left" />
                <Image Source="/Assets/icon.png" HorizontalAlignment="Right" Grid.Column="2" Margin="0,0,6,0" />
            </Grid>
        </Grid>
        <Grid Grid.Row="1" Margin="40,24,23,0" VerticalAlignment="Top">

            <Grid.Transitions>
                <TransitionCollection>
                    <EntranceThemeTransition FromHorizontalOffset="120" />
                </TransitionCollection>
            </Grid.Transitions>

            <Button x:Name="button2" Foreground="Black" BorderThickness="1"
                    Click="button2_Click">Reset Difficulty</Button>

        </Grid>
    </Grid>
</Border>
</UserControl>

代码能正常运行，但当我鼠标悬停在button2上时，它会消失。这是为什么？

- Paul Michaels

Answer 1

您需要自定义按钮模板的PointerOver可视状态，并将自定义样式应用于按钮。

查看按钮样式和模板

默认样式为

<VisualState x:Name="PointerOver">
    <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="Background">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverBackgroundThemeBrush}" />
        </ObjectAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverForegroundThemeBrush}" />
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</VisualState>

要消除效果，只需将其注释掉。

<VisualState x:Name="PointerOver">
    <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="Background">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverBackgroundThemeBrush}" />
        </ObjectAnimationUsingKeyFrames>
        <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverForegroundThemeBrush}" />
        </ObjectAnimationUsingKeyFrames>-->
    </Storyboard>
</VisualState>

还有一种方法是更改ButtonPointerOverForegroundThemeBrush资源，但它将影响整个项目。

<SolidColorBrush x:Key="ButtonPointerOverForegroundThemeBrush" Color="Black" />

- Farhan Ghumra