vivion32 发表于 2015-5-10 13:43:53

Windows Phone笔记(7)页面间导航以及数据传递

  Windows Phone笔记之前的示例都只是基于单个页面的简单示例,一般是继承了PhoneApplicationPage类的MainPage页面,但是实际中的应用程序却不可能这么简单,肯定都是由多个页面组成的,那么这就要求我们首先要了解:Windows Phone的页面之间是如何跳转(导航)的?以及如何在页面间传值?这就是这篇笔记需要解决的问题。

1.页面间的导航
    Windows Phone中页面间的导航非常简单,有过B/S开发经验的开发人员会发现Windows Phone页面间的导航基本上和HTML页面的导航一样。现在我们通过一个简单的示例程序来了解在Windows Phone中如何进行页面间的跳转(导航)。
  首先创建一个Silverlight for Windows Phone项目,MainPage.xaml代码如下:



1    
2         
3            
4         
  后台处理MainPage.xaml.cs页面的代码:



1    public partial class MainPage : PhoneApplicationPage
2   {
3         Random ran = new Random();
4         // 构造函数
5         public MainPage()
6         {
7             InitializeComponent();
8         }
9
10         ///
11      /// 触摸TextBlock以外的屏幕时发生
12    ///
13      ///
14         protected override void OnManipulationStarted(ManipulationStartedEventArgs e)
15         {
16             ContentPanel.Background = new SolidColorBrush(Color.FromArgb(255, (byte)ran.Next(255), (byte)ran.Next(255), (byte)ran.Next(255)));
17             base.OnManipulationStarted(e);
18         }
19
20         ///
21      /// 触摸TextBlock控件跳转到SecondPage
22      ///
23    ///
24      ///
25         private void tblNavigationToSecondPage_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
26         {
27             this.NavigationService.Navigate(new Uri("/SecondPage.xaml", UriKind.Relative));
28
29             e.Complete();
30             e.Handled = true;
31         }
32   }
  完成MainPage页面代码编写后,新建一个SecondPage页面
  SecondPage.xaml代码:



1         
2         
3            
4         
  后台处理SecondPage.xaml.cs代码:



1   public partial class Second : PhoneApplicationPage
2   {
3         Random ran = new Random();
4         public Second()
5         {
6             InitializeComponent();
7         }
8
9         private void tblNavigationToMainPage_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
10         {
11             this.NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
12             //this.NavigationService.GoBack();
13             e.Complete();
14             e.Handled = true;
15         }
16   }
  以上是该示例的全部代码,两个页面的结构类似,点击TextBlock控件以外的屏幕区域就会改变页面背景颜色,点击MainPage页面的TextBlock控件会跳转到SecondPage页面,如果点击SecondPage页面的话就会调用页面的GoBack()方法,那么现在我们通过运行程序来分析页面导航的一些技术要点。
  首先点击MainPage页面,改变页面的背景色,然后点击TextBlock控件跳转到SecondPage页面,点击SecondPage页面的TextBlock控件退回MainPage页面:

  下面我们做一个简单的修改,把SecondPage页面的TextBlock元素触摸事件的处理代码改为:



1   private void tblNavigationToMainPage_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
2         {
3             this.NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
4             //this.NavigationService.GoBack();
5             e.Complete();
6             e.Handled = true;
7         }
  再次和刚才一样的操作,运行效果如下:

  Silverlight for Windows Phone的导航系统是基于栈(stack)的,stack是一种后进先出的数据结构。在这里我们把调用Navigate()方法的页面成为源(source)页面,把导航到的页面成为目标(destination)页面。在第一个示例中,源页面MainPage页面调用Navigation方法时,该页面被放进栈中,同时创建目标页面SecondPage的一个新的实例并显示出来,当调用目标页面的GoBack()方法时(相当于手机中的Back键,在程序初始状态下按该键应用程序会被终止),SecondPage页面的实例会被抛弃,位于栈顶部的MainPage实例就会弹出并显示出来。所有我们可以看到MainPage页面的背景色还是之前的颜色。第二个示例中点击SecondPage页面的TextBlock控件我们可以看到页面的颜色已经回到初始状态,这就表示:SecondPage导航到的是一个MainPage页面的一个新的实例,我们要记住这点:调用源页面的Navigation方法会创建一个目标页面的新的实例,之前的实例会被丢弃。
  

2.页面间数据的传递
  和前面的导航类似,Windows Phone页面间的数据传递也和传统的HTML页面通过URI传递数据的方式相似。下面我们通过一个示例程序来演示在Windows Phone程序中页面如何进行数据的传递。
  MainPage.xaml代码:



1         
2         
3            
4         
  MainPage.xaml.cs后台处理程序:



1 public partial class MainPage : PhoneApplicationPage
2   {
3         Random ran = new Random();
4         // 构造函数
5         public MainPage()
6         {
7             InitializeComponent();
8         }
9
10         ///
11      /// 触摸TextBlock控件时触发
12      ///
13      ///
14      ///
15         private void tblNavigationSecondPage_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
16         {
17             String destination = "/SecondPage.xaml";
18
19             //当ContentPanel的背景色不是默认的值(Brush类型null)时
20       //将背景颜色传递到目标页面中去
21             if (this.ContentPanel.Background is SolidColorBrush)
22             {
23               Color clr = (ContentPanel.Background as SolidColorBrush).Color;
24               destination += string.Format("?Red={0}&Green={1}&Blue={2}", clr.R, clr.G, clr.B);
25             }
26             this.NavigationService.Navigate(new Uri(destination, UriKind.Relative));
27
28             e.Complete();
29             e.Handled = true;
30         }
31
32         ///
33      /// 触摸TextBlock控件以外的屏幕改变背景色
34      ///
35      ///
36         protected override void OnManipulationStarted(ManipulationStartedEventArgs e)
37         {
38             this.ContentPanel.Background = new SolidColorBrush(Color.FromArgb(255, (byte)ran.Next(255), (byte)ran.Next(255), (byte)ran.Next(255)));
39             base.OnManipulationStarted(e);
40         }
41   }
  接着,同样也新建一个SecondPage页面。
  SecondPage.xaml代码如下:



1         
2         
3            
4         
  SecondPage.xaml.cs后台处理程序:



1    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
2         {
3             //通过NavigationContext对象获取源页面传递的字符串,并存放在字典对象中
4             IDictionary parameters = this.NavigationContext.QueryString;
5             //传递的字符串中有Red的话
6             if (parameters.ContainsKey("Red"))
7             {
8               byte R = Byte.Parse(parameters["Red"]);
9               byte G = Byte.Parse(parameters["Green"]);
10               byte B = Byte.Parse(parameters["Blue"]);
11               //改变背景色
12               this.ContentPanel.Background = new SolidColorBrush(Color.FromArgb(255, R, G, B));
13             }
14
15             base.OnNavigatedTo(e);
16         }
17
18         private void tblGoBack_ManipulationStarted(object sender, ManipulationStartedEventArgs e)
19         {
20             this.NavigationService.GoBack();
21
22             e.Complete();
23             e.Handled = true;
24         }
  编译运行,首先改变MainPage页面背景色,然后点击MainPage页面的TextBlock控件导航到SecondPage页面,可以看到源页面的背景色值被传递到目标页面中,并显示出来。
   
  分析代码:在SecondPage页面的后台处理程序中,我们重写了定义在Page类中的OnNavigation方法,这个方法在页面执行完初始化的构造函数后马上调用;我们通过页面的NavigationContext属性来访问源页面传递的字符串,该对象只有一个属性:QueryString,这个属性返回的是一个字典容器。
  
  参考资料:
  《Programming Windows Phone 7 Microsoft Silverlight Edition》
  

  作者:晴天猪
  出处:http://www.iyunv.com/IPrograming
  本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

    Windows Phone开发者交流群:79339880,欢迎大家来一起讨论交流,共同学习进步。
页: [1]
查看完整版本: Windows Phone笔记(7)页面间导航以及数据传递