Windows Phone7天初學(2):頁面導航

時間 2020-01-19

標籤 windows phone7 phone 初學頁面導航欄目 Windows 简体版

原文原文鏈接

PhoneApplicationPage表明了內容不一樣的頁面,PhoneApplicationFrame是頁面控件容器，是框架，一個應用程序只有一個框架Frame,是惟一的，不一樣的頁面之間須要進行導航，導航以頁面爲基礎進行導航的。

導航主要有XAML直接導航和後臺代碼導航方式。

1、XAML 直接導航方式

XAML 方式使用HyperLinkButton按鈕，定義其的NavigateUri屬性，以下：

NavigateUri="/MyPic/Shanghai.xaml"

2、後臺代碼導航方式

代碼方式，使用類NavigationService,以下

NavigationService.Navigate(new Uri(" /MyPic/Shanghai.xaml ", UriKind.Relative));

實際開發中，爲避免使用一串的長地址，特別是網站有多層結構時，爲簡化、方便使用導航網址，使用別名導航：

<Application.Resources>

<daohang:UriMapper x:Key="MyMapper">

<daohang:UriMapping Uri="MyPage" MappedUri="/MyPic/MyPage.xaml"/>

</ daohang:UriMapper>

</Application.Resources>

別名使用：

NavigateUri=" MyPage "

或

NavigationService.Navigate(new Uri(" MyPage ", UriKind.Relative));

當需傳遞參數時，導航相應的表示爲：

（1） XAML 直接導航：

NavigateUri="/MyPic/Shanghai.xaml ？city=1"

(2) 後臺代碼導航：

NavigationService.Navigate(new Uri(" /MyPic/Shanghai.xaml?city=1 ", UriKind.Relative));

(3) 使用別名地址導航。

<daohang:UriMapping Uri="MyPage/{MyCity}" MappedUri="/MyPic/MyPage.xaml?city={MyCity}"/>

案例2-1:個人相冊：My Photos

建立一個針對Windows Phone導航的應用，完成一個個人相冊「My Photos」應用程序。

(1) 啓動Visual Studio 2010，建立「Windows Phone Application」。

(2) 設計程序界面，效果如圖2-1所示：

圖2-1

XAML主要代碼以下：

</Grid>

（3）在項目資源管理器，新建旅遊目錄旅遊Lvyou，並添加對應四個豎屏Page，添加照片目錄Photos，並拷進相應的示例照片。如圖2-2：

圖2-2

（4）更改各導航頁面的標題，並加進一旅遊圖片，如Kunming.xaml,效果如圖2-3：

圖2-3

XAML代碼爲：

</StackPanel>

</Grid>

（5）回到主頁面 MainPage，「昆明旅遊」使用 XAML 直接導航方式，就是定義 NavigateUri屬性，以下：

（6）「桂林旅遊」使用後臺代碼方式導航。在MainPage設計視圖中，雙擊「桂林旅遊」對應的「查看」按扭，定義事件處理程序，實現導航，代碼以下：

private void button1_Click(object sender, RoutedEventArgs e)

{

NavigationService.Navigate(new Uri ("/lvyou/guilin.xaml",UriKind.Relative ));

}

（7）「北京旅遊」使用別名地址導航。首先在App.xmal中新增命名空間的支持，以下：

xmlns:mm="clr-namespace:System.Windows.Navigation;assembly=Microsoft.Phone"

在資源塊中添加定義Uri映射關係

<Application.Resources>

<navig:UriMapper x:Key="LvyouMapper" >

<navig:UriMapping Uri="beijing" MappedUri="/Lvyou/Changchen.xaml"></navig:UriMapping>

</navig:UriMapper>

</Application.Resources>

在App.xaml.cs定義的映射資源數據放入應用程序框架RootFrame 的UriMapper對象中，代碼以下：

this.RootFrame.UriMapper = Resources["LvyouMapper"] as UriMapper;

回到MainPage.xaml中，現只需定義別名便可實現導航，在「北京旅遊」對應的「查看」控件，定義NavigateUri屬性爲相應的別名，形式以下：

NavigateUri="beijing"

如用後臺代碼方式，可表示爲：

NavigationService.Navigate(new Uri ("LvyouMapper ",UriKind.Relative ));

(8) 「海南旅遊」導航帶參數方式，在對應單擊事件處理程序中，定義帶參數，以下：

private void button2_Click(object sender, RoutedEventArgs e)

{

NavigationService.Navigate(new Uri("/lvyou/Haikou.xaml?photo= 海邊風景", UriKind.Relative));

}

（9）打開Haikou.xaml定義Loaded事件，讀取參數處理程序以下：

if (NavigationContext.QueryString.Count > 0) //如帶參數，則處理

{

this.PageTitle.Text = NavigationContext.QueryString["photo"] ;

}

（10）運行後，顯示首頁，效果以下：

圖2-4

可查看相應旅遊照片,如單擊北京旅遊長城邊的「查看」，顯示對應的效果，如圖2-5：

圖2-5

查看「海南旅遊」，傳遞參數後，更改標題爲「海邊風景」，效果如圖2-6：

圖2-6

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。