第一次没有触发按钮单击[仅限 Windows 8.1/10 平板电脑]答案

【问题标题】：Button click is not getting fired for first time [ windows 8.1/10 tablet only ]第一次没有触发按钮单击[仅限 Windows 8.1/10 平板电脑]
【发布时间】：2015-11-18 16:09:35
【问题描述】：

我正在编写一个带有 3 状态按钮（正常、焦点和按下）的示例 Windows 通用应用程序

我的代码如下所示。

现在我遇到了按钮单击问题，当第一次单击按钮时，按钮单击事件不会被触发。但第一次点击后，它工作正常[问题仅在 Windows 平板电脑中发生，在台式机和笔记本电脑上工作正常]

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

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>

Generic.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>

【问题讨论】：

设置clickmode=按下按钮。
我们试过了。但没有按预期工作。
真的吗？嗯，没想到，以后得回这个仔细看看，抱歉。

标签： xaml mvvm windows-store-apps

【解决方案1】：

移除了 ObjectAnimationUsingKeyFrames 标签并使用了 DoubleAnimation 标签。还将目标属性 Source 更改为 Opactity。然后在指定的持续时间内更新图像。

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

【讨论】：