Windows Phone 页面导航动画

概述

在构建Windows Phone应用程序的时候，为了让用户不至于在应用程序中迷路，需要考虑用户在应用程序中的导航顺序。为了构建高质量的Windows Phone应用程序，不仅要考虑页面显示的顺序，还需要创建平滑的过渡效果，即，页面导航动画。

步骤

l 截获所有用户正在离开当前页面的操作

l 启动一个动画故事版来隐藏当前页面

l 导航到下一个页面

l 截获新页面的导航

l 启动一个故事版来显示新页面

定义隐藏页面和显示页面的动画

和定义普通控件的动画方式相同，这里不再赘述。

隐藏当前页面

截获用户离开页面的操作的方法有两种。一种是将对Navigate方法的调用替换为对动画的调用。但是该方法有一个明显的缺点，如果在一个页面有多种导航到多个页面的时候，需要在一个页面的多个位置执行该操作。另一种比较有效的方法是重写OnNavigatingFrom方法：在该方法中取消页面的导航，并且启动页面隐藏动画，同时缓存用户将要导航到的Uri，当动画结束之后再次调用Navigate方法。这次导航将取得成功。如下：

///<summary>
///保存将要导航到的Uri地址
///</summary>
public
Uri UriToNavigateTo { get;set; }

privatevoid btnToSP_Click(objectsender,RoutedEventArgs e)
{
// 导航按钮按下之后，开始导航
NavigationService.Navigate(newUri("/SecondPage.xaml",UriKind.Relative));
}

protectedoverridevoidOnNavigatingFrom(NavigatingCancelEventArgse)
{
base.OnNavigatingFrom(e);

if(UriToNavigateTo ==null)
{
// 当UriToNavigatingTo为空时，表示第一次导航，需要截获
e.Cancel = true;
UriToNavigateTo = e.Uri;
this.HidePage.Begin();
}
else
{
// 第二次导航，不截获
UriToNavigateTo = null;
}
}

privatevoid HidePage_Completed(object sender,EventArgs e)
{
// 动画完成后，再次导航到目标页面
NavigationService.Navigate(UriToNavigateTo);
}

显示新页面

隐藏上一个页面之后，开始加载新页面，可以通过类似隐藏页面的方式来显示页面。重写OnNavigateTo方法：在其中启动一个用于显示页面内容的故事版：

protectedoverridevoidOnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);
this.Display.Begin();
}

以上方式便完成了页面过渡动画。