xaml - 第一次未单击按钮单击[仅适用于Windows 8.1/10平板电脑]

Question

我正在编写带有3状态按钮(“正常”，“焦点”和“按下”)的示例Windows通用应用程序

我的代码如下。

现在，我面临按钮单击的问题，当第一次单击按钮时，不会触发按钮单击事件。但第一次单击后，效果很好[问题仅在Windows平板电脑中发生，而在台式机和笔记本电脑中则正常]

这是已知问题，还是我的代码有问题？

CS

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
    }

    private void ButtonClicked(object sender, RoutedEventArgs e)
    {
        System.Diagnostics.Debug.WriteLine("Inside Button clicked:Button");
    }

    private void ImageClicked(object sender, RoutedEventArgs e)
    {
        System.Diagnostics.Debug.WriteLine("Inside Image clicked:CustomButton");
    }
}

XAML

<Page x:Class="App5.MainPage"   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App5"
    xmlns:customControls="using:App5.CustomControl"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Button Content="Button" HorizontalAlignment="Left" Margin="243,228,0,0" VerticalAlignment="Top" Width="229" Height="104" Click="ButtonClicked" />
        <customControls:CalcButton Content="Button" HorizontalAlignment="Left" Margin="705,231,0,0" VerticalAlignment="Top" Height="101" Width="262" NormalImage="/Assets/Logo.scale-100.png" PressedImage="/Assets/SmallLogo.scale-100.png" HoverImage="/Assets/SplashScreen.scale-100.png" Click="ImageClicked"/>

</Grid>
</Page>

通用XAML

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App5"
    xmlns:customControls="using:App5.CustomControl">

    <Style TargetType="customControls:CalcButton">
        <Setter
            Property="HorizontalAlignment"
            Value="Stretch" />
        <Setter
            Property="VerticalAlignment"
            Value="Stretch" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="customControls:CalcButton">
                    <Grid Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition To="PointerOver"
                                                      GeneratedDuration="0:0:0" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="PointerOver">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ButtonBrush"
                                            Storyboard.TargetProperty="Source">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                                    Value="{Binding HoverImage, RelativeSource={RelativeSource TemplatedParent}}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ButtonBrush"
                                            Storyboard.TargetProperty="Source">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                                    Value="{Binding PressedImage, RelativeSource={RelativeSource TemplatedParent}}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Image x:Name="ButtonBrush" Source="{TemplateBinding NormalImage}" Stretch="Fill" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style> 
</ResourceDictionary>

Answer 1

删除了ObjectAnimationUsingKeyFrames标签，并使用了DoubleAnimation标签。还将目标属性“源”更改为“不透明”。然后以指定的持续时间更新图像。

<VisualState x:Name="Normal">
   <Storyboard>
     <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="NormalButton"/>
   </Storyboard>
</VisualState>