Question

我想为三个帧的不透明度设置动画，其不透明度值的时间轴应该与图像中的一样。动画应该是永远的，但我也希望每个周期之间有一个延迟。我的意思是不透明度应该保持在＆＃39; 1＆＃39;的最后一个值。在某个指定的时间内，然后时间线应该重复一次。我尝试使用具有三个双动画的故事板，但我无法弄清楚每个周期之间的延迟和每个动画之间的延迟。设置每个动画的开始时间对我来说不起作用。

Timeline

Answer 1

由于WPF中动画的灵活性，有很多方法可以解决这个问题。在这里，我介绍最直观的解决方案。从您的图像中，您必须使用某种离散的KeyFrame。在这种情况下，我们需要3 DoubleAnimationUsingKeyFrames，每个应该有2 DiscreteDoubleKeyFrame。所有这些关键帧应该是相同的。我们只需要适当地设置BeginTime DoubleAnimationUsingKeyFrames。我们无需设置Duration，它将根据KeyTime（DiscreteDoubleKeyFrame）与BeginTime（DoubleAnimationUsingKeyFrames的{{1}}自动推迟）。但是，如果您希望在周期之间有一些延迟，我们必须为最后Duration设置DoubleAnimationUsingKeyFrames。

这是一个简单的例子：

<StackPanel>
   <StackPanel.Triggers>
       <EventTrigger RoutedEvent="Loaded">
          <BeginStoryboard>
              <Storyboard Storyboard.TargetProperty="Opacity"  
                          RepeatBehavior="Forever">
                 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="i1"
                                                BeginTime="0:0:0">
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
                 </DoubleAnimationUsingKeyFrames>
                 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="i2" 
                                                BeginTime="0:0:1">
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
                 </DoubleAnimationUsingKeyFrames>
                 <DoubleAnimationUsingKeyFrames Storyboard.TargetName="i3" 
                                            BeginTime="0:0:2" Duration="0:0:3">
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
                 </DoubleAnimationUsingKeyFrames>
              </Storyboard>
          </BeginStoryboard>
       </EventTrigger>
   </StackPanel.Triggers>
   <TextBlock Name="i1">Item 1</TextBlock>
   <TextBlock Name="i2">Item 2</TextBlock>
   <TextBlock Name="i3">Item 3</TextBlock>
</StackPanel>

为简单起见，我在此代码中使用了TextBlock。在这里，您可以看到0不透明度（对于每个TextBlock）的时间是1秒。您可以从中为每个BeginTime正确派生DoubleAnimationUsingKeyFrames。最后一个有Duration 3秒，这意味着延迟约为2秒（最后一个动画的1秒从总数3中扣除）。

多个框架的故事板

1 个答案: