windows phone (26) ApplicationBar應用程序欄

本文轉載自查看原文 2012-05-14 09:05 2311 wp 7/ 移動開發

在應用程序中，如果需要幾個按鈕或者菜單來執行一些普通的命令，就應該考慮使用ApplicationBar,因為silverlight並沒有定義任何常用的菜單或者工具，我們通常稱ApplicationBar為應用程序欄，該類定義在命名空間Microsoft.Phone.Shell中，在改命名空間中還定義了ApplicationBarIconButton和ApplicationBarMenuItem,這些類都派生自Object而非DeendecyObject,UIElement和FramworkElement類，嚴格的說ApplicationBar並不是可視化樹的一部分（未映射到 xmlns），ApplicationBar對象在xaml文件中作為PhoneApplicationPage的ApplicationBar屬性存在，當手機水平放置或者垂直放置時都是一樣的效果，且無法自定義ApplicationBar；ApplicationBar最多可以包含四個按鈕，因為一般使用圖片進行設置按鈕，這些按鈕通常稱之為圖標，且圖標一般為png格式，圖標的寬和高都應為48像素，並通常是透明的；【作者：神舟龍】

示例

下面的示例就是實現一個簡易的播放器，並且有播放，暫停，重新開始和轉至結尾，四個功能圖標，首先從新浪下載圖標，參考書給的微軟的下載地址已經刪除，並在項目里建立一個Image文件，用於保存四個圖片

並把每個圖片的屬性中的【生成操作】設置為內容，如果設置生成操作為Resource，ApplicationBar就無法智能的找到這些圖像；因為ApplicationBar不是標准的silverlight的一部分，因此XML命名空間聲明需要將XML的“Shell”命名空間與.NET命名空間Microsoft.Phone.Shell關聯起來，標准的MainPage.xaml已經為我們做好了這些

xmlns:shell= " clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone "

下面就是設置這四個按鈕，我們直接把IDE已經注釋掉的部分重新啟用，稍微改一下就ok

<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible= " True " IsMenuEnabled= " True ">
            <shell:ApplicationBar.Buttons>
            <shell:ApplicationBarIconButton x:Name= " appbarRewindButton " IconUri= " /Images/appbar.transport.rew.rest.png " Text= " 重置 " IsEnabled= " False " Click= " appbarRewindButton_Click "/>
            <shell:ApplicationBarIconButton x:Name= " appbarPlayButton " IconUri= " /Images/appbar.transport.play.rest.png " Text= " 開始 "  IsEnabled= " False " Click= " appbarPlayButton_Click "/>
            <shell:ApplicationBarIconButton x:Name= " appbarPauseButton " IconUri= " /Images/appbar.transport.pause.rest.png " Text= " 暫定 "  IsEnabled= " False " Click= " appbarPauseButton_Click "/>
            <shell:ApplicationBarIconButton x:Name= " appbarEndButton " IconUri= " /Images/appbar.transport.ff.rest.png " Text= " 結束 "  IsEnabled= " False " Click= " appbarEndButton_Click "/>
            </shell:ApplicationBar.Buttons>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

從上面代碼中可以看到ApplicationBar有一個Buttons屬性，該屬性是該類的內容屬性，所以該屬性不是必須出現的，Buttons集合最多可以包含四個ApplicationBarIconButton 對象，每個ApplicationBarIconButton 對象可以設置ICONURI，X：Name和Text，其中ICONURI表示路徑，Text表示說明文字；當你按下一個圖標時，該圖標會產生一定的偏移，作為操作反饋，如果按下省略號，則會把Text設置的文字進行顯示

如果你不希望ApplicationBar在開始時進行顯示，可以設置

<shell:ApplicationBar IsVisible= " False ">

ApplicationBar 也定義了前景色和背景色，如果改變了手機的主題顏色，那么默認的ApplicationBar 顏色也會有改變

ApplicationBar還可以設置Opacity屬性，默認情況下是1，此時ApplicationBar占用頁面內容區域之外的區域空間，如果設置為其他值比如0.5，此時ApplicationBar則與頁面的其他內容共享空間，但是圖標總是在最前端顯示，文檔建議設置值為1,0.5,0

<shell:ApplicationBar IsVisible= " True " Opacity= " 0.5 ">

效果：

從上面代碼中可以看到每個圖標都是被禁用的IsEnabled="False"，那么怎么從隱藏文件代碼設置禁用那，前面說過ApplicationBarIconButton 是在buttons集合中的所以我們可以用索引的形式獲得某個圖標，並設置屬性，比如最后一個圖標禁用可以這樣寫

((ApplicationBarIconButton) this.ApplicationBar.Buttons[ 0]).IsEnabled = false;

同理可以在隱藏代碼中設置其他的屬性值

下面是示例的主要代碼

xaml文件代碼：

View Code

< Grid x:Name ="LayoutRoot" Background ="Transparent" >
         < Grid.RowDefinitions >
             < RowDefinition Height ="Auto" />
             < RowDefinition Height ="*" />
         </ Grid.RowDefinitions >

         
         < StackPanel x:Name ="TitlePanel" Grid.Row ="0" Margin ="12,17,0,28" >
             < TextBlock x:Name ="ApplicationTitle" Text ="我的應用程序" Style =" {StaticResource PhoneTextNormalStyle} " />
             < TextBlock x:Name ="PageTitle" Text ="頁面名稱" Margin ="9,-7,0,0" Style =" {StaticResource PhoneTextTitle1Style} " />
         </ StackPanel >

         
         < Grid x:Name ="ContentPanel" Grid.Row ="1" Margin ="12,0,12,0" Background ="DarkCyan" >
             < MediaElement Name ="mediaElement" Source ="http://www.charlespetzold.com/Media/Walrus.wmv"
             AutoPlay ="False" MediaFailed ="mediaElement_MediaFailed" MediaOpened ="mediaElement_MediaOpened"
             CurrentStateChanged ="mediaElement_CurrentStateChanged"
              ></ MediaElement >
             
             < TextBlock x:Name ="statusText" HorizontalAlignment ="Left" VerticalAlignment ="Bottom" ></ TextBlock >
             
             < TextBlock x:Name ="errorText" HorizontalAlignment ="Right" VerticalAlignment ="Bottom" TextWrapping ="Wrap" ></ TextBlock >
         </ Grid >
     </ Grid >

     
     < phone:PhoneApplicationPage.ApplicationBar >
         < shell:ApplicationBar IsVisible ="True" >
             < shell:ApplicationBar.Buttons >
             < shell:ApplicationBarIconButton x:Name ="appbarRewindButton" IconUri ="/Images/appbar.transport.rew.rest.png" Text ="重置" IsEnabled ="False" Click ="appbarRewindButton_Click" />
             < shell:ApplicationBarIconButton x:Name ="appbarPlayButton" IconUri ="/Images/appbar.transport.play.rest.png" Text ="開始"   IsEnabled ="False" Click ="appbarPlayButton_Click" />
             < shell:ApplicationBarIconButton x:Name ="appbarPauseButton" IconUri ="/Images/appbar.transport.pause.rest.png" Text ="暫定"   IsEnabled ="False" Click ="appbarPauseButton_Click" />
             < shell:ApplicationBarIconButton x:Name ="appbarEndButton" IconUri ="/Images/appbar.transport.ff.rest.png" Text ="結束"   IsEnabled ="False" Click ="appbarEndButton_Click" />
             </ shell:ApplicationBar.Buttons >
         </ shell:ApplicationBar >

     </ phone:PhoneApplicationPage.ApplicationBar >

代碼影藏文件，需要先引入命名空間

using Microsoft.Phone.Shell;

隱藏文件全部代碼如下

View Code

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
// ApplicationBarIconButton用到
using Microsoft.Phone.Shell;

namespace MoviePlayer
{
     public partial class MainPage : PhoneApplicationPage
    {
         // 構造函數
         public MainPage()
        {
            InitializeComponent();
            appbarEndButton=(ApplicationBarIconButton) this.ApplicationBar.Buttons[ 3];
            appbarPauseButton = (ApplicationBarIconButton) this.ApplicationBar.Buttons[ 2];
            appbarPlayButton = (ApplicationBarIconButton) this.ApplicationBar.Buttons[ 1];
            appbarRewindButton = (ApplicationBarIconButton) this.ApplicationBar.Buttons[ 0];

        }
         /// <summary>
         /// 失敗時發生
         /// </summary>
         /// <param name="sender"></param>
         /// <param name="e"></param>
         private void mediaElement_MediaFailed( object sender, ExceptionRoutedEventArgs e)
        {
            errorText.Text = e.ErrorException.Message;
        }
         /// <summary>
         /// 打開時發生
         /// </summary>
         /// <param name="sender"></param>
         /// <param name="e"></param>
         private void mediaElement_MediaOpened( object sender, RoutedEventArgs e)
        {
            appbarRewindButton.IsEnabled = true;
            appbarEndButton.IsEnabled = true;

        }
         /// <summary>
         /// 狀態更改是發生
         /// </summary>
         /// <param name="sender"></param>
         /// <param name="e"></param>
         private void mediaElement_CurrentStateChanged( object sender, RoutedEventArgs e)
        {
            statusText.Text = mediaElement.CurrentState.ToString();
             if (mediaElement.CurrentState==MediaElementState.Stopped||mediaElement.CurrentState==MediaElementState.Paused)
            {
                appbarPlayButton.IsEnabled = true;
                appbarPauseButton.IsEnabled = false;
            }
             else if (mediaElement.CurrentState==MediaElementState.Playing)
            {
                appbarPlayButton.IsEnabled = false;
                appbarPauseButton.IsEnabled = true;
            }
        }
         // 重置
         private void appbarRewindButton_Click( object sender, EventArgs e)
        {
            mediaElement.Position = TimeSpan.Zero;
        }
         // 播放
         private void appbarPlayButton_Click( object sender, EventArgs e)
        {
            mediaElement.Play();
        }
         // 暫定
         private void appbarPauseButton_Click( object sender, EventArgs e)
        {
            mediaElement.Pause();
        }
         // 結束
         private void appbarEndButton_Click( object sender, EventArgs e)
        {
            mediaElement.Position = mediaElement.NaturalDuration.TimeSpan;
        }
    }
}

效果圖：

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 Windows phone 7之工具欄(ApplicationBar) 與眾不同 windows phone (3) - Application Bar（應用程序欄） Windows Phone 8初學者開發—第3部分：編寫第一個Windows Phone 8應用程序創建分辨率自適應的Windows Phone 8應用程序 Windows Phone 8初學者開發—第7部分：本地化應用程序 [Windows 8] 開發初體驗：對話框（MessageBox）和程序任務欄（ApplicationBar）菜鳥學Windows Phone 8開發(1)——創建第一個應用程序與眾不同 windows phone (16) - Media（媒體）之編輯圖片, 保存圖片到相冊, 與圖片的上下文菜單“應用程序...”和“共享...”關聯, 與 Windows Phone 的圖片中心集成如何測試Windows應用程序 7 | 如何測試Windows應用程序