在 VisualStateManager 中交换画笔

Question

我正在尝试为具有玻璃类型外观的画笔创建自定义样式。我让它看起来像我想要的那样，但我无法让 Pressed 行为起作用。

压制的外观只是将其中一个刷子反转的正常外观。我已经将两个画笔都设置为资源并尝试了ObjectAnimationUsingKeyFrames，但似乎不需要。这个想法是这样的：

<VisualState x:Name="Pressed">
    <Storyboard>
        <!-- swap the brush from {StaticResource ButtonGlassBrushNormal} to 
             {StaticResource ButtonGlassBrushPressed -->
    </Storyboard>
</VisualState>

这是我的资源和风格：

<LinearGradientBrush x:Key="ButtonGlassBrushNormal" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#00000000" Offset="0.31"/>
    <GradientStop Color="White"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ButtonGlassBrushPressed" EndPoint="0.5,0" StartPoint="0.5,1">
    <GradientStop Color="White"/>
    <GradientStop Color="#00000000" Offset="0.31"/>
</LinearGradientBrush>
<ControlTemplate x:Key="ButtonControlTemplate1" TargetType="{x:Type Button}">
    <Grid>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="Pressed">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="_glassBorder"
                            Storyboard.TargetProperty="Background"
                            Duration="0:0:1"
                            RepeatBehavior="Forever">
                            <ObjectAnimationUsingKeyFrames.KeyFrames>
                                <DiscreteObjectKeyFrame KeyTime="0:0:1" Value="{StaticResource ButtonGlassBrushPressed}" />
                            </ObjectAnimationUsingKeyFrames.KeyFrames>  
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" VerticalAlignment="Top" Margin="0,0,0,-21.167" CornerRadius="5">
            <Border.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FF803A3A" Offset="1"/>
                </LinearGradientBrush>
            </Border.Background>
            <Border BorderThickness="1" CornerRadius="5" x:Name="_glassBorder" Background="{StaticResource ButtonGlassBrushNormal}">
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Border>
        </Border>
    </Grid>
</ControlTemplate>

我猜这会非常简单，但我在这里做错了什么？

Answer 1

不要在 Storyboard 上设置 Duration，也不要设置零 KeyTime。此外，您还必须声明 MouseOver 状态，否则 Pressed 状态将持续到鼠标离开 Button：

<VisualStateGroup x:Name="CommonStates">
    <VisualState x:Name="Normal"/>
    <VisualState x:Name="MouseOver"/>
    <VisualState x:Name="Disabled"/>
    <VisualState x:Name="Pressed">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames
                Storyboard.TargetName="_glassBorder"
                Storyboard.TargetProperty="Background">
                <ObjectAnimationUsingKeyFrames.KeyFrames>
                    <DiscreteObjectKeyFrame KeyTime="0:0:0"
                        Value="{StaticResource ButtonGlassBrushPressed}"/>
                </ObjectAnimationUsingKeyFrames.KeyFrames>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
</VisualStateGroup>

Answer 2

如果你不关心动画（比如我），你应该这样做：

<VisualState x:Name="Pressed">
      <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="_glassBorder">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonGlassBrushPressed}"/>
            </ObjectAnimationUsingKeyFrames>
      </Storyboard>
</VisualState>