页面导航、切换及参数传递

问题：如何进行页面间的切换（或导航），并在切换时互相传递参数

　　我的理解：使用“NavigationService”可以满足你所有需求

示例：

从main页面切换至page1并进行参数传递，再从page1返回main

前置条件：

1)　　XAML基础

2)　　C#基础

实现：

目录：

1)　　创建一个基本应用并新增一个页面

2)　　修改页面至‘示例’所示

3)　　添加事件代码

4)　　测试运行

1 创建一个基本应用并新增一个页面

1)　　创建一个基本的Windows Phone应用程序，OS版本7.0

2)　　新增一个页面“Page1”

2 修改页面至‘示例’所示

1)　　MainPage界面代码

 1     <Grid x:Name="LayoutRoot" Background="Transparent">
 2         <Grid.RowDefinitions>
 3             <RowDefinition Height="Auto"/>
 4             <RowDefinition Height="*"/>
 5         </Grid.RowDefinitions>
 6 
 7         <!--TitlePanel 包含应用程序的名称和页标题-->
 8         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
 9             <TextBlock x:Name="ApplicationTitle" Text="我的应用程序" Style="{StaticResource PhoneTextNormalStyle}"/>
10             <TextBlock x:Name="PageTitle" Text="页面名称" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
11         </StackPanel>
12 
13         <!--ContentPanel - 在此处放置其他内容-->
14         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
15             <Button Content="GoToPage1" Height="72" HorizontalAlignment="Left" Margin="119,127,0,0" Name="button1" VerticalAlignment="Top" Width="320" Click="button1_Click" />
16             <TextBlock Height="30" HorizontalAlignment="Left" Margin="9,226,0,0" Name="textBlock1" Text="Page1 Says:" VerticalAlignment="Top" />
17             <TextBlock Height="30" HorizontalAlignment="Left" Margin="9,302,0,0" Name="textBlock3" Text="Tell Page1:" VerticalAlignment="Top" />
18             <TextBox Height="72" HorizontalAlignment="Left" Margin="119,205,0,0" Name="textBox1" Text="TextBox" VerticalAlignment="Top" Width="320" />
19             <TextBox Height="72" HorizontalAlignment="Left" Margin="119,283,0,0" Name="textBox2" Text="TextBox" VerticalAlignment="Top" Width="320" />
20             <TextBlock Height="30" HorizontalAlignment="Left" Margin="25,24,0,0" Name="textBlock2" Text="I'm MainPage" VerticalAlignment="Top" />
21         </Grid>
22     </Grid>

2)　　Page1界面代码

 1     <Grid x:Name="LayoutRoot" Background="Transparent">
 2         <Grid.RowDefinitions>
 3             <RowDefinition Height="Auto"/>
 4             <RowDefinition Height="*"/>
 5         </Grid.RowDefinitions>
 6 
 7         <!--TitlePanel 包含应用程序的名称和页标题-->
 8         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
 9             <TextBlock x:Name="ApplicationTitle" Text="我的应用程序" Style="{StaticResource PhoneTextNormalStyle}"/>
10             <TextBlock x:Name="PageTitle" Text="页面名称" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
11         </StackPanel>
12 
13         <!--ContentPanel - 在此处放置其他内容-->
14         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
15             <Button Content="GoMainPage" Height="72" HorizontalAlignment="Left" Margin="136,105,0,0" Name="button1" VerticalAlignment="Top" Width="320" Click="button1_Click" />
16             <TextBlock Height="30" HorizontalAlignment="Left" Margin="12,202,0,0" Name="textBlock1" Text="MainPage Says" VerticalAlignment="Top" />
17             <TextBlock Height="30" HorizontalAlignment="Left" Margin="11,279,0,0" Name="textBlock3" Text="Tell MainPage" VerticalAlignment="Top" />
18             <TextBox Height="72" HorizontalAlignment="Left" Margin="136,183,0,0" Name="textBox1" Text="TextBox" VerticalAlignment="Top" Width="320" />
19             <TextBox Height="72" HorizontalAlignment="Left" Margin="136,261,0,0" Name="textBox2" Text="TextBox" VerticalAlignment="Top" Width="320" />
20             <TextBlock Height="30" HorizontalAlignment="Left" Margin="28,26,0,0" Name="textBlock2" Text="I'm Page1" VerticalAlignment="Top" />
21         </Grid>
22     </Grid>

3 添加事件代码

1)　　在MainPage的Button的click事件中添加：

1         private void button1_Click(object sender, RoutedEventArgs e)
2         {
3             NavigationService.Navigate(new Uri("/Page1.xaml?Says=" + textBox2.Text, UriKind.Relative));
4         }

其中，"/Page1.xaml?Says=" + textBox2.Text，/Page1.xaml意思就是跳转到Page1，"?"号后面就是要传递的信息，Says是要传递的参数名，“=”号后面是参数值

2)　　对应的，我们需要在Page1页面中接收这段信息，在Page1的PhoneApplicationPage_Loaded事件中接收

1         private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
2         {
3             string says = "";
4             if (NavigationContext.QueryString.Keys.Contains("Says"))
5             {
6                 NavigationContext.QueryString.TryGetValue("Says", out says);
7                 textBox1.Text = says;
8             }
9         }

注意：如果使用NavigationService.Navigate方法来切换页面，每一次向Page1切换，其实质是将Page1重新实例化了一次，所以PhoneApplicationPage_Loaded事件在每一次切换时都会发生，这样就保证了我们的信息传递是一直有效的。

3)　　在Page1的Button的click事件中添加：

1         private void button1_Click(object sender, RoutedEventArgs e)
2         {
3             NavigationService.Navigate(new Uri("/MainPage.xaml?Says=" + textBox2.Text, UriKind.Relative));
4         }

4)　　对应的，需要在MainPage中接收

1         private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
2         {
3             string says = "";
4             if (NavigationContext.QueryString.Keys.Contains("Says"))
5             {
6                 NavigationContext.QueryString.TryGetValue("Says", out says);
7                 textBox1.Text = says;
8             }
9         }

4 测试运行

说明：

1)　　页面导航的方法有很多，NavigationService只是其中一种

2)　　进行信息传递的方法也有好几种，这里只讲到一种，有些方法中甚至可以传递对象

3)　　目前使用的方法中，每一次页面切换其实质是对Page进行了重新实例化，即对页面进行了重建

posted @ 2012-11-06 15:35 布兰姥爷阅读(365) 评论(0) 编辑收藏举报

布兰姥爷

WP7->界面->页面导航、切换及参数传递

公告