在WPF中有条件地为情节提要动画吗？

Question

thanks for taking a look. I'm trying to make a button in WPF shake when pressed, if a checkbox is checked somewhere else. I tried to do this solely in XAML but couldn't figure out how to check both for click as a trigger and the checkbox. Here's my XAML code:

<Style TargetType="{x:Type Button}">
 <Setter Property="RenderTransformOrigin"
         Value="0.5 0.5" />
 <Setter Property="RenderTransform">
   <Setter.Value>
     <RotateTransform />
   </Setter.Value>
 </Setter>

 <Style.Triggers>

   <MultiTrigger>

     <MultiTrigger.Conditions>
       <Condition Property='IsPressed'
                  Value='True' />
     </MultiTrigger.Conditions>

     <MultiTrigger.EnterActions>
       <BeginStoryboard>
         <Storyboard TargetProperty="RenderTransform.Angle">
           <DoubleAnimation From="0"
                            To="5"
                            Duration="0:0:0.05"
                            AutoReverse="True"
                            FillBehavior="Stop" />
           <DoubleAnimation BeginTime="0:0:0.05"
                            From="5"
                            To="-5"
                            Duration="0:0:0.1"
                            AutoReverse="True"
                            FillBehavior="Stop" />
           <DoubleAnimation BeginTime="0:0:0.2"
                            From="-5"
                            To="0"
                            Duration="0:0:0.1"
                            AutoReverse="False"
                            FillBehavior="Stop" />
         </Storyboard>
       </BeginStoryboard>
     </MultiTrigger.EnterActions>

   </MultiTrigger>
 </Style.Triggers>

This makes buttons always shake when pressed. To get it to work conditionally I figured I should implement this in the codebehind. Once I get the animation working, it should be as simple as adding an if statement, I think.

MainWindow : Window

{

    private Storyboard myStoryboard;

    public MainWindow()

    {

        InitializeComponent();

        DoubleAnimation myDoubleAnimation = new DoubleAnimation();

        myDoubleAnimation.From = 0.0;
        myDoubleAnimation.To = 20.0;

        myDoubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(5));

        myDoubleAnimation.AutoReverse = true;

        myStoryboard = new Storyboard();

        myStoryboard.Children.Add(myDoubleAnimation);
        Storyboard.SetTargetName(myDoubleAnimation, HelpButton.Name);
        Storyboard.SetTargetProperty(myDoubleAnimation, new 
        PropertyPath(RotateTransform.AngleProperty));
        HelpButton.Click += ShakeObject;

    }

private void ShakeObject(object sender, RoutedEventArgs e)
    {
        myStoryboard.Begin(this);
    }
}

I'd expect this code to rotate my button named 'HelpButton' (in XAML) by 20 degrees then back, but no such luck.

I can execute a single RotateTransform with .BeginAnimation(RotateTransform.AngleProperty, myDoubleAnimation); but I want to do several rotations in succession (to simulate shaking).

Any help is appreciated! Thanks.

Answer 1

我发现的一种解决方案是，当IsChecked触发我的复选框时，将XAML样式应用于按钮，如果未选中，则将其删除。

Answer 2

You need to add the condition on the checkbox and change the MultiTringger in MultiDataTrigger. Here is the code

<Style TargetType="{x:Type Button}">
            <Setter Property="RenderTransformOrigin" Value="0.5 0.5" />
            <Setter Property="RenderTransform">
                <Setter.Value>
                    <RotateTransform />
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding ElementName=btn , Path=IsPressed}" Value="True" />
                        <Condition Binding="{Binding ElementName=chk , Path=IsChecked}" Value="True" />
                    </MultiDataTrigger.Conditions>

                    <MultiDataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard TargetProperty="RenderTransform.Angle">
                                <DoubleAnimation From="0"
                        To="5"
                        Duration="0:0:0.05"
                        AutoReverse="True"
                        FillBehavior="Stop" />
                                <DoubleAnimation BeginTime="0:0:0.05"
                        From="5"
                        To="-5"
                        Duration="0:0:0.1"
                        AutoReverse="True"
                        FillBehavior="Stop" />
                                <DoubleAnimation BeginTime="0:0:0.2"
                        From="-5"
                        To="0"
                        Duration="0:0:0.1"
                        AutoReverse="False"
                        FillBehavior="Stop" />
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiDataTrigger.EnterActions>

                </MultiDataTrigger>
            </Style.Triggers>
        </Style>