[WP] 不同頁面使用相同ApplicationBar(應用程式列)

2011-05-20

4925
0
2012-07-23

在Windows Phone 7開發中當在Visual Studio建立一個新的Page(頁面)時預設會有一段被註解起來的ApplicationBar(應用程式列)內容，讓我們可以很方便地去建立ApplicationBar，而且WP7也允許每個頁面都可以有自己的ApplicationBar

不過如果當很多頁面都是使用相同的ApplicationBar的話，就可以把ApplicationBar定義在App.xaml裡面類似資源的形式，這樣每一個頁面要使用這個ApplicationBar的時候只要指定到對應的Key就可以，如此一來就不用每一頁都去設定相同的ApplicationBar也方便日後如果要修改的話比較容易。而在App.xaml中的設定方式如下，主要是在Application.Resources中指定，並且一定要給予x:Key屬性這樣要使用的時候才知道要用什麼名稱來呼叫

<Application 
    x:Class="ApplicationBarDemo.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"       
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone">
    <Application.Resources>
        <shell:ApplicationBar x:Key="GlobalAppBar" >
            <shell:ApplicationBarIconButton IconUri="/icons/appbar.next.rest.png" Text="Page1" Click="ApplicationBarIconButton_Click"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="GotoPage2" Click="ApplicationBarMenuItem_Click"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </Application.Resources>
    <Application.ApplicationLifetimeObjects>
        <shell:PhoneApplicationService 
            Launching="Application_Launching" Closing="Application_Closing" 
            Activated="Application_Activated" Deactivated="Application_Deactivated"/>
    </Application.ApplicationLifetimeObjects>
</Application>

然後再要套用這個ApplicationBar的頁面中指定ApplicationBar="{StaticResource x:Key屬性名稱}"

<phone:PhoneApplicationPage 
    x:Class="ApplicationBarDemo.MainPage"
    ………    
ApplicationBar="{StaticResource GlobalAppBar}">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        ………
    </Grid> 
</phone:PhoneApplicationPage>

另外如果是要利用這裡的ApplicationBarIconButton或ApplicationBarMenuItem來做頁面巡覽的話，寫法也會稍微不同，原本在一般PhoneApplicationPage頁面中是透過NavigationService.Navigate方法來切換到不同頁面，但是在App.xaml.cs裡則要透過RootFrame.Navigate才能切換

......
private void ApplicationBarIconButton_Click(object sender, EventArgs e)
{
      // 一般PhoneApplicationPage頁面導覽到另一頁的作法
      // NavigationService.Navigate(new Uri("/Page1.xaml", UriKind.RelativeOrAbsolute));            
      this.RootFrame.Navigate(new Uri("/Page1.xaml", UriKind.RelativeOrAbsolute));
}
 private void ApplicationBarMenuItem_Click(object sender, EventArgs e)
{
      this.RootFrame.Navigate(new Uri("/Page2.xaml", UriKind.RelativeOrAbsolute));
}

而如果是要在套用的頁面中取得App.xaml中的ApplicationBar話，就類似抓取Resources的方式，先找到ApplicationBar後，再依序取得想要的ApplicationBarIconButton或ApplicationBarMenuItem，當然也要記得先引用Microsoft.Phone.Shell這個namespace

using System.Windows;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Shell;

namespace ApplicationBarDemo
{
    public partial class MainPage : PhoneApplicationPage
    {
        public MainPage()
        {
            InitializeComponent();
            ApplicationBar bar = Application.Current.Resources["GlobalAppBar"] as ApplicationBar;
            ApplicationBarIconButton btn1 = bar.Buttons[0] as ApplicationBarIconButton;
            ApplicationBarMenuItem item1 = bar.MenuItems[0] as ApplicationBarMenuItem;
        }
    }
}

範例下載

回首頁