1

我正在制作一个 Windows Phone 8 应用程序，并想先淡出然后 - 只有这样 - 实际上将 aUIElement的可见性变为“折叠”。但是，我不知道如何使它们异步发生。

我正在使用故事板和混合。这是我的故事板来切换我的小“弹出窗口” StackPanel：

<VisualStateGroup x:Name="PopupStates">
    <VisualState x:Name="PopupDisplayed">
        <Storyboard>

            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Popup">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>

            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Popup" d:IsOptimized="True"/>
        </Storyboard>
    </VisualState>

    <VisualState x:Name="PopupHidden">
        <Storyboard>

            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Popup">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>

            <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Popup" d:IsOptimized="True"/>

        </Storyboard>
    </VisualState>
</VisualStateGroup>

我如何安排我的故事板事件一个接一个地发生？

4

1 回答 1

2

您可以将BeginTime第二个动画的属性设置为第一个动画的持续时间。

从MSDN 页面：

BeginTime 属性对于创建按顺序播放的时间线很有用：通过增加共享相同父情节提要的连续时间线的 BeginTime，您可以错开它们的播放时间。

该页面上的示例显示了您如何使用它：

        <!-- Animates the rectangle's width. No 
             BeginTime specified so by default begins 
             as soon as it's parent (the Storyboard)
             begins. -->
        <DoubleAnimation 
          Storyboard.TargetName="MyAnimatedRectangle" 
          Storyboard.TargetProperty="Width"
          To="300" Duration="0:0:1" />

        <!-- Animates the rectangle's opacity. A BeginTime
             of 3 seconds specified so begins three seconds
             after the Storyboard begins (total of 5 seconds)-->
        <DoubleAnimation BeginTime="0:0:3"
          Storyboard.TargetName="MyAnimatedRectangle" 
          Storyboard.TargetProperty="Opacity"
          To="0" Duration="0:0:1" />

第一个动画在情节提要开始时立即开始并持续 1 秒。第二个动画在情节提要开始后 3 秒开始，并且持续 1 秒。

因此，在您的示例中，您需要将弹出窗口的动画持续时间设置为 2 秒（例如）：

<DoubleAnimation Duration="0:0:2" To="0"
                 Storyboard.TargetProperty="(UIElement.Opacity)"
                 Storyboard.TargetName="Popup" d:IsOptimized="True"/>

然后设置将可见性设置为 2 秒的动画的开始时间：

        <ObjectAnimationUsingKeyFrames BeginTime="0:0:2"
                         Storyboard.TargetProperty="(UIElement.Visibility)"
                         Storyboard.TargetName="Popup">
            <DiscreteObjectKeyFrame KeyTime="0">
                <DiscreteObjectKeyFrame.Value>
                    <Visibility>Collapsed</Visibility>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
于 2013-05-22T22:34:49.697 回答