一周初学Windows Phone（2）：页面导航

PhoneApplicationPage代表了内容不同的页面,PhoneApplicationFrame是页面控件容器，是框架，一个应用程序只有一个框架Frame,是唯一的，不同的页面之间需要进行导航，导航以页面为基础进行导航的。

导航主要有XAML直接导航和后台代码导航方式。

一、XAML直接导航方式

XAML方式使用HyperLinkButton按钮，定义其的NavigateUri属性，如下：

NavigateUri="/MyPic/Shanghai.xaml"

二、后台代码导航方式

代码方式，使用类NavigationService,如下

NavigationService.Navigate(new Uri("/MyPic/Shanghai.xaml ", UriKind.Relative));

实际开发中，为避免使用一串的长地址，特别是网站有多层结构时，这样可简化使用导航网址，可使用别名导航：

别名使用：

NavigateUri=" MyPage "

或

NavigationService.Navigate(new Uri("MyPage ", UriKind.Relative));

当需传递参数时，相应的表示为：

（1） XAML直接导航：

NavigateUri="/MyPic/Shanghai.xaml？city=1"

(2) 后台代码导航：

NavigationService.Navigate(new Uri("/MyPic/Shanghai.xaml?city=1 ", UriKind.Relative));

(3) 使用别名地址导航。

案例2-1:我的相册：My Photos

创建一个针对Windows Phone导航的应用，完成一个我的相册“My Photos”应用程序 。

(1)启动Visual Studio 2010，创建“Windows Phone Application”。

(2)设计程序界面，效果如图2-1所示：

图2-1

XAML主要代码如下：

（3） 在项目资源管理器，新建旅游目录旅游Lvyou，并添加对应四个竖屏Page，添加照片目录Photos，并拷进相应的示例照片。如图2-2：

图2-2

（4） 更改各导航页面的标题，并加进一图片，如Kunming.xaml,如图2-3：

XAML代码为：

（5）回到主页面MainPage，昆明旅游，使用XAML直接导航方式，就是定义NavigateUri属性，如下：

（6）桂林旅游，使用后台代码方式导航。在MainPage设计视图中，双击“桂林旅游”对应的“查看”按扭，定义事件处理程序，实现导航，代码如下：

private void button1_Click(object sender, RoutedEventArgs e)

{

NavigationService.Navigate(new Uri ("/lvyou/guilin.xaml",UriKind.Relative ));

}

（7）北京旅游，使用别名地址导航。首先在App.xmal中新增命名空间的支持，如下：

xmlns:mm="clr-namespace:System.Windows.Navigation;assembly=Microsoft.Phone"

在资源块中添加定义Uri映射关系

在App.xaml.cs定义的映射资源数据放入应用程序框架RootFrame 的UriMapper对象中，代码如下：

this.RootFrame.UriMapper = Resources["LvyouMapper"] as UriMapper;

回到MainPage.xaml中，现只需定义别名即可实现导航，在“北京旅游”对应的“查看”控件，定义NavigateUri属性为相应的别名，形式如下：

NavigateUri="beijing"

如用后台代码方式，可表示为：

NavigationService.Navigate(new Uri ("LvyouMapper ",UriKind.Relative ));

(8) 海南旅游，导航带参数方式，在对应单击事件处理程序中，定义带参数，如下：

private void button2_Click(object sender, RoutedEventArgs e)

{

NavigationService.Navigate(new Uri("/lvyou/Haikou.xaml?photo=海边风景", UriKind.Relative));

}

（9）打开Haikou.xaml定义Loaded事件，读取参数处理程序如下：

if (NavigationContext.QueryString.Count > 0) //如带参数，则处理

{

this.PageTitle.Text = NavigationContext.QueryString["photo"] ;

}

（10）运行后，显示首页，效果如下：

可查看相应旅游照片,如单击北京旅游长城边的“查看”，显示对应的效果图：

查看海南旅游，参数更改标题为“海边风景”，效果如下：