修鍊九陰真經Windows Phone開發 (5)：ApplicationBar最佳實務

本文和大家重點學習一下Windows Phone開發中ApplicationBar用法，ApplicationBar就是所謂的功能表列，它包括Iconbutton和Menu兩種類型。Iconbutton就相當於功能表列裡的工具列，可以帶表徵圖；Menu就是菜單了，但是沒有二級菜單。

Windows Phone開發中ApplicationBar用法

對於WindowsPhone7程式來說，UI是用Sliverlight來開發的，但是並不完全是Sliverlight的全集，與子集的關係，因為Phone7上有的API或功能PC上是沒有的（比如這個applicationbar），那PC上的sliverlight就更不用說了。

ApplicationBar就是所謂的功能表列，它包括Iconbutton和Menu兩種類型。Iconbutton就相當於功能表列裡的工具列，可以帶表徵圖；Menu就是菜單了，但是沒有二級菜單。在建立之前一定要先在Reference裡加入Microsoft.Phone.shell,並且在xaml頁面加上xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone.Shell".

Windows Phone ApplicationBar包含了ApplicationBarIconButton和ApplicationBarMenuItem，最多隻能添加四個按鈕，菜單通過ApplicationBar右邊的省略符號來展開，都繼承自Microsoft.Phone.Shell命名空間，所以在引用時前面都有shell的標誌，如：

應用程式欄不是SL控制項，所以不支援資料繫結。

 

一、在XAML前台中建立應用程式欄

    <phone:PhoneApplicationPage.ApplicationBar>        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">            <shell:ApplicationBarIconButton x:Name="appbarbutton1" IconUri="/icons/appbar.save.rest.png" Text="Save" Click="appbarbutton1_Click"/>            <shell:ApplicationBarIconButton x:Name="appbarbutton2" IconUri="/icons/appbar.delete.rest.png" Text="Delete"/>            <shell:ApplicationBar.MenuItems>                <shell:ApplicationBarMenuItem x:Name="appbarmenuitem1" Text="Open"/>                <shell:ApplicationBarMenuItem x:Name="appbarmenuitem2" Text="Exit"/>            </shell:ApplicationBar.MenuItems>        </shell:ApplicationBar>    </phone:PhoneApplicationPage.ApplicationBar>

應用程式欄不是SL控制項，所以不支援資料繫結，這意味著用XAML來實現的話，按鍵標籤文字串值必須在XAML中的寫入程式碼，並且不能本地化

 

      ApplicationBarIconButton的表徵圖可以使用自己設計的表徵圖(尺寸48 x 48)，也可以使用系統的表徵圖，系統的表徵圖通過Blend 4.0來添加，如

Windows Phone開發中要建立IconBar，就一定要有Icon，Phone7對Icon的要求比較嚴：大小一定是48X48相素的png圖，圖型置中，前景色彩一般為白色，大小為26X26.有了圖片就可以建立了，如果沒有也沒有關係，微軟給提供了一套表徵圖http://www.microsoft.com/downloads/details.aspx?familyid=369B20F7-9D30-4CFF-8A1B-F80901B2DA93&displaylang=en。

 

二、通過代碼訪問ApplicationBar

從XAML頁面中可以看出，ApplicationBarIconButton和ApplicationBarMenuItem是繼承自ApplicationBar，ApplicationBar又繼承自PhoneApplicationPage命名空間，而其他SilverLight頁面控制項是直接繼承自PhoneApplicationPage命名空間的。

      所以訪問ApplicationBar的控制項不能像訪問Page內容一樣，首先添加命名空間Microsoft.Phone.Shell，如

using System;using Microsoft.Phone.Controls;using Microsoft.Phone.Shell;namespace PhoneApp1{    public partial class MainPage : PhoneApplicationPage    {        // Constructor        public MainPage()        {            InitializeComponent();            appbarbutton1 = ApplicationBar.Buttons[0] as ApplicationBarIconButton;            appbarmenuitem1 = ApplicationBar.MenuItems[0] as ApplicationBarMenuItem;                    }        private void appbarbutton1_Click(object sender, EventArgs e)        {            appbarbutton1.IconUri = new Uri("/icons/appbar.stop.rest.png", UriKind.RelativeOrAbsolute);            appbarmenuitem1.Text = "Close";        }    }}

 

三、在代碼中建立應用程式欄

使用代碼來實現功能表列

1. 建立一個項目，命名為ApplicatonBarByCode，建立檔案夾Images，並匯入相關資源檔，對appbar.add.rest.png 設定其Build Action的值為Content，也可以點F4快速鍵的。開啟MainPage.xaml.cs檔案，首先我們要引入一些shell，所以增加如下代碼：      

using Microsoft.Phone.Shell;

          2.  在建構函式裡輸入如下代碼：

public MainPage()
        {
            InitializeComponent();

//聲明一個功能表列,並且設定它可見和Menu可以使用
            ApplicationBar = new ApplicationBar();
            ApplicationBar.IsVisible = true;
            ApplicationBar.IsMenuEnabled = true;
        }

   3.  增加三個功能表按鈕和兩個MenuItem，如下：

  

public MainPage()
        {
            InitializeComponent();

//初始化一個功能表列,並且設定它可見和Menu可以使用
            ApplicationBar = new ApplicationBar();
            ApplicationBar.IsVisible = true;
            ApplicationBar.IsMenuEnabled = true;

//設定三個功能表按鈕
            ApplicationBarIconButton btnAdd = new ApplicationBarIconButton(new Uri("/Images/appbar.add.rest.png", UriKind.Relative));
            btnAdd.Text = "add";
            ApplicationBarIconButton btnSave = new ApplicationBarIconButton(new Uri("/Images/appbar.save.rest.png", UriKind.Relative));
            btnSave.Text = "save";
            ApplicationBarIconButton btnDelete = new ApplicationBarIconButton(new Uri("/Images/appbar.delete.rest.png", UriKind.Relative));
            btnDelete.Text = "delete";

//將這三個功能表按鈕加入到功能表列中
            ApplicationBar.Buttons.Add(btnAdd);
            ApplicationBar.Buttons.Add(btnSave);
            ApplicationBar.Buttons.Add(btnDelete);

//設定兩個MenuItem
            ApplicationBarMenuItem menuItem1 = new ApplicationBarMenuItem("Menu Item1");
            ApplicationBarMenuItem menuItem2 = new ApplicationBarMenuItem("Menu Item2");

            ApplicationBar.MenuItems.Add(menuItem1);
            ApplicationBar.MenuItems.Add(menuItem2);
        }