c# - 如何为 IsChecked 属性设置动画？

Question

我有带有 ToggleButtons 数量的自定义控件:

<Style TargetType="{x:Type local:ISA88Buttons}">
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type local:ISA88Buttons}">
          <Border x:Name="PART_Border" 
                  Background="{TemplateBinding Background}"
                  BorderBrush="{TemplateBinding BorderBrush}"
                  BorderThickness="{TemplateBinding BorderThickness}">
            <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="ISA88States">
...
                 <VisualState x:Name="AbortingState" Storyboard="{StaticResource sbAbortingState}" />
                <VisualState x:Name="AbortedState" Storyboard="{StaticResource sbAbortedState}" />
...
              </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

<StackPanel Margin="1" 
                        HorizontalAlignment="Center"
                        Orientation="Horizontal">
...
<ToggleButton x:Name="PART_Button_Abort" 
                            Margin="1"
                            IsChecked="False"
                            IsThreeState="True"
                            Tag="Abort">
                <ToggleButton.Style>
                  <Style TargetType="{x:Type ToggleButton}">
                    <Setter Property="OverridesDefaultStyle" Value="True" />
                    <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                    <Setter Property="Template">
                      <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                          <Border x:Name="border" 
                                  Width="{TemplateBinding Width}"
                                  Height="{TemplateBinding Height}"
                                  Background="{StaticResource NormalAbortButtonDrawingBrush}" />
                          <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="False">
                              <Setter TargetName="border" Property="Background" Value="{StaticResource DisabledAbortButtonDrawingBrush}" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                              <Setter TargetName="border" Property="Background" Value="{StaticResource MouseOverAbortButtonDrawingBrush}" />
                            </Trigger>
                            <MultiTrigger>
                              <MultiTrigger.Conditions>
                                <Condition Property="IsEnabled" Value="True" />
                                <Condition Property="IsChecked" Value="True" />
                              </MultiTrigger.Conditions>
                              <MultiTrigger.Setters>
                                <Setter TargetName="border" Property="Background" Value="{StaticResource PressedAbortButtonDrawingBrush}" />
                              </MultiTrigger.Setters>
                            </MultiTrigger>
                            <MultiTrigger>
                              <MultiTrigger.Conditions>
                                <Condition Property="IsEnabled" Value="True" />
                                <Condition Property="IsChecked" Value="{x:Null}" />
                              </MultiTrigger.Conditions>
                              <MultiTrigger.EnterActions>
                                <BeginStoryboard x:Name="sb">
                                  <Storyboard RepeatBehavior="Forever">
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="border" Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{StaticResource PressedAbortButtonDrawingBrush}" />
                                        <DiscreteObjectKeyFrame KeyTime="00:00:0.25" Value="{StaticResource NormalAbortButtonDrawingBrush}" />
                                        <DiscreteObjectKeyFrame KeyTime="00:00:0.5" Value="{StaticResource PressedAbortButtonDrawingBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                  </Storyboard>
                                </BeginStoryboard>
                              </MultiTrigger.EnterActions>
                            </MultiTrigger>
                          </ControlTemplate.Triggers>
                        </ControlTemplate>
                      </Setter.Value>
                    </Setter>
                  </Style>
                </ToggleButton.Style>
              </ToggleButton>
...
</StackPanel>
          </Border>
</ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

和 Storyboard:

  <Storyboard x:Key="sbAbortingState">     
      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_Button_Abort" Storyboard.TargetProperty="(ToggleButton.IsChecked)">
          <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}" />
          </ObjectAnimationUsingKeyFrames>
  </Storyboard>

  <Storyboard x:Key="sbAbortedState">
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_Button_Abort" Storyboard.TargetProperty="(ToggleButton.IsChecked)">
          <DiscreteObjectKeyFrame KeyTime="0" Value="True" />
          </ObjectAnimationUsingKeyFrames>
  </Storyboard>

当我的控件处于 Aborting 状态时，Abort 按钮会闪烁，但是当我将状态更改为 Aborted 时，会引发错误:

Cannot animate the 'IsChecked' property on a 'System.Windows.Controls.Primitives.ToggleButton' using a 'System.Windows.Media.Animation.ObjectAnimationUsingKeyFrames'

我如何使用 Storyboard 在 三个 值之间为该属性设置动画:true、false 和 {x:Null}，而不仅仅是 true 和 false.

Answer 1

问题是您实际上不应该使用 ObjectAnimationUsingKeyFrames 动画设置 bool 值，而应该是带有 DiscreteBooleanKeyFrame 关键帧的 BooleanAnimationUsingKeyFrames 动画。

因此您的标记将是:

<BooleanAnimationUsingKeyFrames Storyboard.TargetName="Button" Storyboard.TargetProperty="(ToggleButton.IsChecked)">
      <DiscreteBooleanKeyFrame KeyTime="0" Value="{x:Null}" />
</BooleanAnimationUsingKeyFrames>

<BooleanAnimationUsingKeyFrames Storyboard.TargetName="Button" Storyboard.TargetProperty="(ToggleButton.IsChecked)">
      <DiscreteBooleanKeyFrame KeyTime="0" Value="True" />
</BooleanAnimationUsingKeyFrames>

<BooleanAnimationUsingKeyFrames Storyboard.TargetName="Button" Storyboard.TargetProperty="(ToggleButton.IsChecked)">
      <DiscreteBooleanKeyFrame KeyTime="0" Value="False" />
</BooleanAnimationUsingKeyFrames>