Question

我开始学习WPF几天了。现在我正在制作动画Button，当它使用VisualStateManager更改状态时会更改其外观。

创建我的Button并将ControlTemplate应用于

<Button Content="This is a Button" Height="100" HorizontalAlignment="Center" 
    VerticalAlignment="Center" Width="200" 
    Template="{DynamicResource ButtonControlTemplate}" 
    FontFamily="Trebuchet MS" FontSize="24" Foreground="White"/>

以下是ControlTemplate

<ControlTemplate x:Key="ButtonControlTemplate" TargetType="{x:Type Button}">
    <Grid x:Name="ElementRoot">
        <Border x:Name="border" BorderThickness="1" Width="Auto" CornerRadius="3">
            <Border.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFF8FFF6" Offset="0"/>
                    <GradientStop Color="#FF67ED38" Offset="1"/>
                </LinearGradientBrush>
            </Border.Background>
            <Border.BorderBrush>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF52A370" Offset="0"/>
                    <GradientStop Color="#FF054E21" Offset="1"/>
                </LinearGradientBrush>
            </Border.BorderBrush>
            <ContentPresenter 
                HorizontalAlignment="{TemplateBinding   HorizontalContentAlignment}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
        </Border>
    </Grid>
</ControlTemplate>

以下VisualStateManager更改了Button

的外观

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
        <VisualStateGroup.Transitions>
            <VisualTransition From="MouseOver" GeneratedDuration="0:0:1" To="Pressed">
                <Storyboard x:Name="MouseOverToPressedStoryboard">
                    <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="border">
                        <EasingThicknessKeyFrame KeyTime="0:0:1" Value="20,10"/>
                    </ThicknessAnimationUsingKeyFrames>
                </Storyboard>
            </VisualTransition>
        </VisualStateGroup.Transitions>
        <VisualState x:Name="Normal"/>
        <VisualState x:Name="MouseOver"/>
        <VisualState x:Name="Pressed">
            <Storyboard x:Name="pressedStoryboard">
                <ColorAnimation Duration="0" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border" To="#FF3DA917" />
            </Storyboard>
        </VisualState>
        <VisualState x:Name="Disabled"/>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

我已阅读MSDN中的GeneratedDuration属性详细信息（此处为link），如果我理解正确，GeneratedDuration是控件的时间（Button }）从一个状态转换到另一个状态。我的情况是从MouseOver到Pressed。这样，它必须等待一秒才能进入Pressed状态。按下状态会更改按钮的背景颜色。当您将鼠标指向按钮（而不是单击）然后单击它，一秒钟后，Button的外观应该开始更改。但是当你点击它时它会立即改变。

我误解了什么，在哪里？希望有人能提供帮助。提前谢谢。

VisualTransition的GeneratedDuration属性如何工作？

0 个答案: