3

私は数日間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>

GeneratedDuration私はMSDNでプロパティの詳細を読みました(ここにリンクがあります)。その権利を理解している場合GeneratedDurationは、コントロール(my Button)がある状態から別の状態に遷移するのにかかる時間です。私の状況ではからMouseOverですPressed。それまでに、状態に入る前に1秒間待機する必要がありPressedます。Pressed状態は、ボタンの背景色を変更します。マウスをボタンに向けて(まだクリックしていない)、ボタンをクリックすると、1秒後に外観がButton変化し始めます。ただし、クリックするとすぐに変わります。

何をどこで誤解しますか?誰かが助けてくれることを願っています。前もって感謝します。

4

0 に答える 0