完成动画后如何导航到下一页?

时间:2013-09-13 10:50:23

标签: c# xaml windows-phone-7 expression-blend

我正在尝试为Windows Phone 8中的Splashscreen做一个动画。我已经完成了一个物体反弹的动画。但在完成动画后,它应立即切换到下一页。怎么做这个任务?

    //MainPage.xaml
        <phone:PhoneApplicationPage.Resources>
                <Storyboard x:Name="Storyboard1">
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="arc">
                        <EasingDoubleKeyFrame KeyTime="0" Value="-555">
                            <EasingDoubleKeyFrame.EasingFunction>
                                <BounceEase EasingMode="EaseOut"/>
                            </EasingDoubleKeyFrame.EasingFunction>
                        </EasingDoubleKeyFrame>
                        <DiscreteDoubleKeyFrame KeyTime="0:0:5" Value="-150"/>

                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </phone:PhoneApplicationPage.Resources>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <es:Arc x:Name="arc" ArcThickness="20" ArcThicknessUnit="Pixel" EndAngle="360" HorizontalAlignment="Left" Height="100" Margin="174,369.5,0,0" Stretch="None" Stroke="Black" StartAngle="0" UseLayoutRounding="False" VerticalAlignment="Top" Width="100" RenderTransformOrigin="0.5,0.5" Loaded="arc_Loaded">
                <es:Arc.RenderTransform>
                    <CompositeTransform/>
                </es:Arc.RenderTransform>
                <es:Arc.Fill>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF3B9E5B" Offset="0"/>
                        <GradientStop Color="#FF8D2727" Offset="1"/>
                    </LinearGradientBrush>
                </es:Arc.Fill>
            </es:Arc>

        </Grid>

3 个答案:

答案 0 :(得分:3)

继承人的解决方案但是我猜你需要分享更多有关问题的信息,如果这没有帮助

 <Storyboard x:Name="StoryboardTest" Completed="Storyboard_Completed">
                //What ever animation you want to do
            </Storyboard>

在cs文件中:

private void Storyboard_Completed(object sender, EventArgs e)
{
    NavigationService.Navigate(new Uri("/SecondPage.xaml", UriKind.Relative));
}

有关动画启动画面的演示,请转到此链接 progress bar splash screen并相应地应用您的动画。

答案 1 :(得分:2)

您可以处理故事板的Completed事件。

Storyboard myStoryboard = Resources["Storyboard1"] as Storyboard;

if(myStoryboard != null)
{
    myStoryboard.Completed += (s,e) => 
           {
             NavigationService.Navigate(new Uri("/NextPage.xaml", UriKind.Relative));
           };
    myStoryboard.Begin();
}

答案 2 :(得分:1)

您可以导航到故事板的已完成事件中的下一页。

 <Storyboard x:Name="Storyboard1" Completed="Storyboard_Completed_1">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="arc">
                    <EasingDoubleKeyFrame KeyTime="0" Value="-555">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <BounceEase EasingMode="EaseOut"/>
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:5" Value="-150"/>

                </DoubleAnimationUsingKeyFrames>
            </Storyboard>

在后面的代码中:

private void Storyboard_Completed_1(object sender, EventArgs e)
{
    // Do whatever you wanted
}