xaml - 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 上时它消失了。这是为什么？

Answer 1

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

查看 button styles and templates

默认的是

<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" />