页面导航的基础与深入

Windows8中是没有对话框的概念的，不同的界面有不同的页面，类似于网页一样的浏览模式。

通过Frame.Navigate(typeof(TestPage),obj)的方式来实现不同页面的导航。

NavigationServer的属性方法有：

GoBack()后退，GoForward()前进，CanGoBack()判断是否可以后退。

页面导航默认是不启用缓存的，也就是后退之后的前一个页面恢复成原始的状态。

如果需要开启，在构造函数中可以使用以下代码：

[csharp] view plaincopy

1. NavigationCacheMode = NavigationCacheMode.Enabled;  

下面新建一个项目TestNavigation来说明导航栏的使用。

给项目添加两个空白页面MainPage1和MainPage2和MainPage3来进行测试：

在App.xaml.cs将启动页面设置为MainPage1（找到typeof，将MainPage改成MainPage1即可）。

在MainPage1添加一个按钮来跳转到Page3。

[html] view plaincopy

1. <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">  
2.     <Button Content="Go to Page3" HorizontalAlignment="Left" Margin="200,100,0,0"   
3.             VerticalAlignment="Top"/>  
4.   
5. </Grid>  

双击该按钮，设置点击之后的方法：

[csharp] view plaincopy

1. private void Button_Click_1(object sender, RoutedEventArgs e)  
2.         {  
3.             Frame.Navigate(typeof(MainPage3));  
4.         }  

这样运行项目，点击之后便会发现自动跳转到了对应的界面。

接下来，在MainPage3的页面上加一个后退按钮：

[html] view plaincopy

1. <Button Content="Back" HorizontalAlignment="Left" VerticalAlignment="Top"/>  

双击该按钮如下添加代码：

[csharp] view plaincopy

1. private void Button_Click_1(object sender, RoutedEventArgs e)  
2.         {  
3.             Frame.GoBack();  
4.         }  

运行项目，则点击该按钮可以后退。

如此便实现了两个页面的导航，而这个Frame是Page类的一个属性。

那么怎么给页面传参呢？

其实Navigate方法还有一个重载方法：

[csharp] view plaincopy

1. public bool Navigate(Type sourcePageType);  
2. public bool Navigate(Type sourcePageType, object parameter);  

也就是说第二个参数传什么都可以，是一个object对象。

那么我们下面来做一个测试。

首先是在MainPage1.xaml添加两个按钮，都是跳转到MainPage3但是传的参数不一样：

[html] view plaincopy

1. <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">  
2.        <Button Content="Go to Page3-1" HorizontalAlignment="Left" Margin="200,100,0,0"   
3.                VerticalAlignment="Top" Click="Button_Click_1"/>  
4.        <Button Content="Go to Page3-2" HorizontalAlignment="Left" Margin="200,200,0,0"   
5.                VerticalAlignment="Top" Click="Button_Click_2"/>  
6.    </Grid>  

页面效果如图：

双击第一个按钮，将其中代码改成：

[csharp] view plaincopy

1. private void Button_Click_1(object sender, RoutedEventArgs e)  
2.         {  
3.             Frame.Navigate(typeof(MainPage3),"请叫我汪海");  
4.         }  

双击第二个按钮，将其中代码改成：

[csharp] view plaincopy

1. private void Button_Click_2(object sender, RoutedEventArgs e)  
2.         {  
3.             Frame.Navigate(typeof(MainPage3), "请还是叫我汪海");  
4.         }  

这样我们就给Page3传了不同的参数。

那么接下来我们在Page3的OnNavigatedTo接受相应的数据。

先把返回的按钮赋值Name="btn"，然后我们把接受到的数据显示在btn上面：

[csharp] view plaincopy

1. protected override void OnNavigatedTo(NavigationEventArgs e)  
2.        {  
3.            //e.Parameter代表传来的参数  
4.            btn.Content = e.Parameter;  
5.        }  

此时运行项目，就可以看见跳转后的页面显示传参的内容了：

下面来看一下如何使用导航栏的缓存功能。

在Page1上放置两个文本框和一个按钮来改变第二个文本框的值：

[html] view plaincopy

1. <TextBox HorizontalAlignment="Center" VerticalAlignment="Center" Margin="-800,0,0,0" TextWrapping="Wrap"  
2.                Text="" />  
3.   
4.       <TextBox x:Name="text2" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="-800,100,0,0" TextWrapping="Wrap"  
5.                Text="TextBox" />  
6.       <Button HorizontalAlignment="Center" Content="Change!" VerticalAlignment="Center" Margin="-800,200,0,0"></Button>  

双击按钮添加方法：

[csharp] view plaincopy

1. private void Button_Click_3(object sender, RoutedEventArgs e)  
2.         {  
3.             text2.Text = "Hello,why!";  
4.         }  

运行项目，点击按钮，发现文本框的内容改成了Hello,why!但是如果跳转到Page3再返回就会发现原本的内容又不见了。

如果想保留里面的内容，就要启用缓存。

在构造方法中添加以下代码：

[csharp] view plaincopy

1. public MainPage1()  
2.         {  
3.             this.InitializeComponent();  
4.             NavigationCacheMode = NavigationCacheMode.Enabled;  
5.         }  

这样就可以保留相关的信息了。

接下来再看一看导航模式。

OnNavigatedTo在刚进来或者从其他页面里面返回过来的时候都可以调用。

一共有Back，Forward，New，Refresh四种情况，一般在New的时候才重新加载数据：

[csharp] view plaincopy

1. protected override void OnNavigatedTo(NavigationEventArgs e)  
2.        {  
3.            if (e.NavigationMode == NavigationMode.New)  
4.            {  
5.                //第一次进入这个页面，此时才加载数据。  
6.   
7.            }  
8.        }  

还有两个方法：

1.OnNavigatedFrom：当页面不再是活动页面时调用，

2.OnNavigatingFrom：在页面即将不是活动页面的。