Question

我需要在Canvas中使用一个小方块来动画，具体取决于View-Model的属性，这里是XAML

<Style x:Key="FlashingRectStyle">
 <Style.Triggers>

                <!-- HasPath & IsBig -->

                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding Path=HasPath}" Value="True" />
                        <Condition Binding="{Binding Path=IsBig}" Value="True" />
                    </MultiDataTrigger.Conditions>
                    <MultiDataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:3" RepeatBehavior="Forever">
                                    <DiscreteDoubleKeyFrame Value="20" KeyTime="0:0:0" />
                                    <DiscreteDoubleKeyFrame Value="20" KeyTime="0:0:1" />
                                    <DiscreteDoubleKeyFrame Value="190" KeyTime="0:0:2" />
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:3" RepeatBehavior="Forever">
                                    <DiscreteDoubleKeyFrame Value="30" KeyTime="0:0:0" />
                                    <DiscreteDoubleKeyFrame Value="115" KeyTime="0:0:1" />
                                    <DiscreteDoubleKeyFrame Value="35" KeyTime="0:0:2" />
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiDataTrigger.EnterActions>
                </MultiDataTrigger>

                <!-- HasPath & Not IsBig -->

                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding Path=HasPath}" Value="True" />
                        <Condition Binding="{Binding Path=IsBig}" Value="False" />
                    </MultiDataTrigger.Conditions>
                    <MultiDataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:3" RepeatBehavior="Forever">
                                    <DiscreteDoubleKeyFrame Value="77" KeyTime="0:0:0" />
                                    <DiscreteDoubleKeyFrame Value="73" KeyTime="0:0:1" />
                                    <DiscreteDoubleKeyFrame Value="138" KeyTime="0:0:2" />
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:3" RepeatBehavior="Forever">
                                    <DiscreteDoubleKeyFrame Value="57" KeyTime="0:0:0" />
                                    <DiscreteDoubleKeyFrame Value="97" KeyTime="0:0:1" />
                                    <DiscreteDoubleKeyFrame Value="53" KeyTime="0:0:2" />
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiDataTrigger.EnterActions>
                </MultiDataTrigger>

                <!-- Not HasPath-->

                <DataTrigger Binding="{Binding Path=HasPath}" Value="False">
                    <Setter Property="Canvas.Left" Value="105" />
                    <Setter Property="Canvas.Top" Value="75" />
                </DataTrigger>

            </Style.Triggers>
        </Style>

使用

<Canvas>
    <Rectangle Style="{StaticResource FlashingRectStyle}" Width="30" Height="20" />
</Canvas>

HasPath和IsBig的默认值均为True，第一个动画块“HasPath＆amp; IsBig”动画正确。
此外，如果我将IsBig更改为false“HasPath＆amp; Not IsBig”确实开始动画。
但是如果我然后将IsBig更改为true - 没有任何反应并且“HasPath＆amp; Not IsBig”保持动画。
另外，如果我将HasPath设置为false，它应该触发“Not HasPath”，但它不会。当属性改变时，如何让它在动画中切换动画？

Answer 1

在添加新的故事板之前，您需要删除ExitActions中的上一个故事板：

<MultiDataTrigger>
   <MultiDataTrigger.Conditions>
      <Condition Binding="{Binding Path=HasPath}" Value="True" />
      <Condition Binding="{Binding Path=IsBig}" Value="False" />
   </MultiDataTrigger.Conditions>
   <MultiDataTrigger.EnterActions>
      <BeginStoryboard x:Name="BeginStoryboardName">
         <Storyboard>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Left)" 
                                           Duration="0:0:3" RepeatBehavior="Forever">
               <DiscreteDoubleKeyFrame Value="77" KeyTime="0:0:0" />
               <DiscreteDoubleKeyFrame Value="73" KeyTime="0:0:1" />
               <DiscreteDoubleKeyFrame Value="138" KeyTime="0:0:2" />
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)" 
                                           Duration="0:0:3" RepeatBehavior="Forever">
               <DiscreteDoubleKeyFrame Value="57" KeyTime="0:0:0" />
               <DiscreteDoubleKeyFrame Value="97" KeyTime="0:0:1" />
               <DiscreteDoubleKeyFrame Value="53" KeyTime="0:0:2" />
            </DoubleAnimationUsingKeyFrames>
         </Storyboard>
      </BeginStoryboard>
   </MultiDataTrigger.EnterActions>
   <MultiDataTrigger.ExitActions>
      <RemoveStoryboard BeginStoryboardName="BeginStoryboardName"/>
   </MultiDataTrigger.ExitActions>
</MultiDataTrigger>

WPF MultiDataTrigger动画不正确的行为

1 个答案: