Windows Phone7页面导航

跟林永坚老师学WP7开发

• 内容概览
• 使用xaml进行导航
• 使用C#代码进行导航
• 地址别名
• 页面之间的数据传递
• 回退按钮

 为了更好的控制导航，我们需要先知道页面的架构与框架：

• Frame  
  • 只有一个单独的PhoneApplicationFrame
  • 包含一个或多个PhoneApplicationPage
  • 也包含系统托盘和应用程序栏
• Page
  • 包含标题，可以有独立的应用程序栏
  • Page之间可以相互导航
• SIlverlight for window phone 使用以页面为基础的页面导航
  • 与web的页面导航类似
  • 每个独立的都有唯一的URI
  • 每个独立的页面都是没有状态的

概念介绍完了，下面就是例子了：

• XAML中使用导航

在导航里的一个很重要的控件:hyplinkbutton,所以我先拖四个hyplinkbutton到界面中来，

这样就是主页面了，接下来再创建一个新的导航到的页面Music.xaml到views目录下，然后添加contant为音乐的hyperlinkbutton的NavigateUri

 这样启动程序就可以正常的导航了，下面的三个按照同样的操作就可以了，

• 用C#代码进行导航（使用到一个很重要的类）

  

• 使用别名进行导航需要3步：第一步需要在App.xaml文件里定义映射规则，第二部在App.xaml.cs里初始化这个定义的Resource

  

  第二部在App.xaml.cs里初始化这个定义的Resource

  

第三步：在页面里使用，把HyperLinkButton的NavigationURi属性修改成如下，到此别名导航就完成了。

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <HyperlinkButton Content="音乐" Height="30" HorizontalAlignment="Left" NavigateUri="Music" Margin="29,131,0,0" Name="hyperlinkButton1" VerticalAlignment="Top" Width="115" />
            <HyperlinkButton Content="视频" Height="30" HorizontalAlignment="Left" NavigateUri="Vedio" Margin="29,60,0,0" Name="Vedio" VerticalAlignment="Top" Width="115" />
            <HyperlinkButton Content="浏览器" Height="30" HorizontalAlignment="Left" NavigateUri="WebBrowser" Margin="29,283,0,0" Name="WebBrowser" VerticalAlignment="Top" Width="115" />
            <HyperlinkButton Content="图片" Height="30" HorizontalAlignment="Left" NavigateUri="Picture" Margin="29,207,0,0" Name="hyperlinkButton4" VerticalAlignment="Top" Width="115" />
            
            <Button Content="音乐" Height="72" HorizontalAlignment="Left" Margin="241,131,0,0" Name="musicbutton1" VerticalAlignment="Top" Width="160" Click="musicbutton1_Click" />
            <Button Content="视频" Height="72" HorizontalAlignment="Left" Margin="241,39,0,0" Name="videobutton2" VerticalAlignment="Top" Width="160" Click="videobutton2_Click" />
            <Button Content="浏览器" Height="72" HorizontalAlignment="Left" Margin="241,323,0,0" Name="webbroserbutton3" VerticalAlignment="Top" Width="160" Click="webbroserbutton3_Click" />
            <Button Content="图片" Height="72" HorizontalAlignment="Left" Margin="241,225,0,0" Name="picturebutton4" VerticalAlignment="Top" Width="160" Click="picturebutton4_Click" />
        </Grid>

• 　　页面间传递数据，最常用的是通过QueryString来传递数据，

      <HyperlinkButton Content="歌曲1" NavigateUri="/views/Music.xaml?song=歌曲1" Height="30" HorizontalAlignment="Left" Margin="175,230,0,0" Name="hyperlinkButton2" VerticalAlignment="Top" Width="200" />
         
  

  　　在Music.xaml页面被加载的时候我们就显示传递过来的参数，

  using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Net;
  using System.Windows;
  using System.Windows.Controls;
  using System.Windows.Documents;
  using System.Windows.Input;
  using System.Windows.Media;
  using System.Windows.Media.Animation;
  using System.Windows.Shapes;
  using Microsoft.Phone.Controls;
  
  namespace PageNavigation.views
  {
      public partial class Music : PhoneApplicationPage
      {
          public Music()
          {
              InitializeComponent();
          }
  
          private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
          {
              if (NavigationContext.QueryString.Count > 0)
              {
                  textBlock1.Text = NavigationContext.QueryString["song"];
              }
          }
  
      }
  }
  

  　　

• 使用别名来传递参数，首先需要修改App.xaml里的映射规则

  

 页面修改为

       <HyperlinkButton Content="歌曲1" NavigateUri="Music/歌曲1" Height="30" HorizontalAlignment="Left" Margin="175,230,0,0" Name="hyperlinkButton2" VerticalAlignment="Top" Width="200" />
       

　　注意：NavigationService默认不能传递对象（可以通过使用App类的静态属性、SIngleton类、把对象分解为QueryString来传递......）

源码下载