WP7->界面->页面导航、切换及参数传递
问题:如何进行页面间的切换(或导航),并在切换时互相传递参数
我的理解:使用“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进行了重新实例化,即对页面进行了重建