原文:与众不同 windows phone (3) - Application Bar（应用程序栏）

[索引页]
[源码下载]

与众不同 windows phone (3) - Application Bar（应用程序栏）

作者：webabcd

介绍
与众不同 windows phone 7.5 (sdk 7.1) 之应用程序栏

  • 概述
  • XAML 方式生成 AppBar
  • Code 方式生成并更新 AppBar
  • Resource 方式加载 AppBar

示例
1、AppBar 的 概述
Summary.xaml

<phone:PhoneApplicationPage

    x:Class="Demo.ApplicationBarDemo.Summary"

    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"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"

    shell:SystemTray.IsVisible="True">

    <Grid x:Name="LayoutRoot" Background="Transparent">

        <TextBlock TextWrapping="Wrap">

            <Run>AplicationBar 概述</Run>

            <LineBreak />

            <LineBreak />

            <Run>1、自带图标地址在类似如下的地址：C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.1\Icons\</Run>

            <LineBreak />

            <Run>2、ApBar 图标大小 48*48，核心图像 26*26 以便不与圆圈重叠（圆圈由系统自动绘制）</Run>

            <LineBreak />

            <Run>3、设计图标时注意：以白色为透明背景色，这样系统会对不同主题背景（现在有两种，深和浅）自动适应</Run>

            <LineBreak />

            <Run>4、DefaultSize 的 ApBar 高度为 72 像素；Minimized 的 ApBAr 高度为 30 像素</Run>

            <LineBreak />

            <Run>5、DefaultSize 的 ApBar 默认不会显示按钮的提示文本，需要单击右侧三个圆点后才会显示</Run>

        </TextBlock>

    </Grid>

</phone:PhoneApplicationPage>

2、演示 XAML 方式生成 AppBar
XAMLDemo.xaml

<phone:PhoneApplicationPage

    x:Class="Demo.ApplicationBarDemo.XAMLDemo"

    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"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    mc:Ignorable="d" d:DesignHeight="696" d:DesignWidth="480"

    shell:SystemTray.IsVisible="True">

    <phone:PhoneApplicationPage.ApplicationBar>

        <!--

            ApplicationBar - 应用程序栏

                Mode - 应用程序栏的样式。ApplicationBarMode.Default：默认（显示图标）；ApplicationBarMode.Minimized：最小化（右侧有3个圆点，用于提示单击可弹出 ApBar）

                IsVisible - 是否显示 ApBar

                IsMenuEnabled - 是否显示 ApBar 的 MenuItem

                BackgroundColor - AppBar 的背景色

                ForegroundColor - AppBar 的前景色

            ApplicationBarIconButton - ApBar 的 IconButon

                IconUri - 按钮图标的地址

                Text - 用于描述按钮功能的文本

                Click - 单击按钮后所触发的事件

            ApplicationBarMenuItem - ApBar 的 MenuItem

                Text - 菜单项的文本

                Click - 单击菜单项后所触发的事件

        -->        

        <shell:ApplicationBar Mode="Default" Opacity="1.0" IsMenuEnabled="False" IsVisible="True" BackgroundColor="Blue" ForegroundColor="AntiqueWhite">

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.add.rest.png" Text="添加" Click="ApplicationBarIconButton_Click" />

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.delete.rest.png" Text="删除" Click="ApplicationBarIconButton_Click" />

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.save.rest.png" Text="保存" Click="ApplicationBarIconButton_Click" />

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.download.rest.png" Text="下载" Click="ApplicationBarIconButton_Click" />

            <shell:ApplicationBar.MenuItems>

                <shell:ApplicationBarMenuItem Text="menu item 1" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 2" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 3" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 4" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 5" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 6" Click="ApplicationBarMenuItem_Click" />

                <shell:ApplicationBarMenuItem Text="menu item 7" Click="ApplicationBarMenuItem_Click" />

            </shell:ApplicationBar.MenuItems>

        </shell:ApplicationBar>

    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>

XAMLDemo.xaml.cs

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;

using Microsoft.Phone.Shell;

namespace Demo.ApplicationBarDemo

{

    public partial class XAMLDemo : PhoneApplicationPage

    {

        public XAMLDemo()

        {

            InitializeComponent();

        }

        private void ApplicationBarIconButton_Click(object sender, EventArgs e)

        {

            MessageBox.Show("选择的 IconButton 是：" + ((ApplicationBarIconButton)sender).Text);

        }

        private void ApplicationBarMenuItem_Click(object sender, EventArgs e)

        {

            MessageBox.Show("选择的 MenuItem 是：" + ((ApplicationBarMenuItem)sender).Text);

        }

    }

}

3、演示 Code 方式生成并更新 AppBar
CodeDemo.xaml

<phone:PhoneApplicationPage

    x:Class="Demo.ApplicationBarDemo.CodeDemo"

    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"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"

    shell:SystemTray.IsVisible="True">

    <StackPanel Orientation="Vertical">

        <!--用于演示动态改变 ApBar 的 Mode-->

        <TextBlock Text="设置 ApplicationBarMode" Foreground="{StaticResource PhoneAccentBrush}" />

        <StackPanel Orientation="Horizontal">

            <RadioButton Checked="ModeChanged" Name="btnDefaultSize" Content="DefaultSize 模式" />

            <RadioButton Checked="ModeChanged" Name="btnMinimized" Content="Minimized 模式" />

        </StackPanel>

        <!--用于演示动态改变 ApBar 的 IsVisible-->

        <TextBlock Text="是否显示" Foreground="{StaticResource PhoneAccentBrush}" />

        <StackPanel Orientation="Horizontal">

            <RadioButton Checked="VisibilityChanged" Name="btnVisible" Content="显示" />

            <RadioButton Checked="VisibilityChanged" Name="btnHidden" Content="隐藏" />

        </StackPanel>

    </StackPanel>

</phone:PhoneApplicationPage>

CodeDemo.xaml.cs

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;

using Microsoft.Phone.Shell;

namespace Demo.ApplicationBarDemo

{

    public partial class CodeDemo : PhoneApplicationPage

    {

        public CodeDemo()

        {

            InitializeComponent();

            this.Loaded += new RoutedEventHandler(CodeDemo_Loaded);

        }

        void CodeDemo_Loaded(object sender, RoutedEventArgs e)

        {

            /*

             * ApplicationBar - 应用程序栏

             *     Mode - 应用程序栏的样式。ApplicationBarMode.Default：默认（显示图标）；ApplicationBarMode.Minimized：最小化（右侧有3个圆点，用于提示单击可弹出 ApBar）

             *     IsVisible - 是否显示 ApBar

             *     IsMenuEnabled - 是否显示 ApBar 的 MenuItem

             *     BackgroundColor - AppBar 的背景色

             *     ForegroundColor - AppBar 的前景色

             *

             * ApplicationBarIconButton - ApBar 的 IconButon

             *     Buttons - IconButon 的集合

             *     IconUri - 按钮图标的地址

             *     Text - 用于描述按钮功能的文本

             *     Click - 单击按钮后所触发的事件

             *

             * ApplicationBarMenuItem - ApBar 的 MenuItem

             *     MenuItems - MenuItem 的集合

             *     Text - 菜单项的文本

             *     Click - 单击菜单项后所触发的事件

             */

            ApplicationBar = new ApplicationBar();

            ApplicationBar.Mode = ApplicationBarMode.Default;

            ApplicationBar.Opacity = 1.0;

            ApplicationBar.IsVisible = true;

            ApplicationBar.IsMenuEnabled = true;

            ApplicationBarIconButton btnAdd = new ApplicationBarIconButton();

            btnAdd.IconUri = new Uri("/ApplicationBarDemo/Assets/appbar.add.rest.png", UriKind.Relative);

            btnAdd.Text = "添加";

            btnAdd.Click += delegate { MessageBox.Show("选择了 添加 按钮"); };

            ApplicationBar.Buttons.Add(btnAdd);

            ApplicationBarMenuItem item1 = new ApplicationBarMenuItem();

            item1.Text = "menu item 1";

            item1.Click += delegate { MessageBox.Show("选择了 menu item 1 菜单"); };

            ApplicationBar.MenuItems.Add(item1);

            btnDefaultSize.IsChecked = true;

            btnVisible.IsChecked = true;

        }

        // 动态修改该 AppBar 的 Mode

        private void ModeChanged(object sender, RoutedEventArgs e)

        {

            string option = ((RadioButton)sender).Name;

            switch (option)

            {

                case "btnDefaultSize":

                    ApplicationBar.Mode = ApplicationBarMode.Default;

                    break;

                case "btnMinimized":

                    ApplicationBar.Mode = ApplicationBarMode.Minimized;

                    break;

            }

        }

        // 动态修改该 AppBar 的 IsVisible

        private void VisibilityChanged(object sender, RoutedEventArgs e)

        {

            string option = ((RadioButton)sender).Name;

            switch (option)

            {

                case "btnVisible":

                    ApplicationBar.IsVisible = true;

                    break;

                case "btnHidden":

                    ApplicationBar.IsVisible = false;

                    break;

            }

        }

    }

}

4、演示 Resource 方式加载 AppBar
App.xaml

    <Application.Resources>

        <shell:ApplicationBar x:Key="AppBar1" IsVisible="True" IsMenuEnabled="True">

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.add.rest.png" Text="添加" />

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.delete.rest.png" Text="删除" />

            <shell:ApplicationBar.MenuItems>

                <shell:ApplicationBarMenuItem Text="MenuItem 1" />

                <shell:ApplicationBarMenuItem Text="MenuItem 2" />

            </shell:ApplicationBar.MenuItems>

        </shell:ApplicationBar>

        <shell:ApplicationBar x:Key="AppBar2" IsVisible="True" IsMenuEnabled="True">

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.save.rest.png" Text="保存" />

            <shell:ApplicationBarIconButton IconUri="/ApplicationBarDemo/Assets/appbar.download.rest.png" Text="下载" />

            <shell:ApplicationBar.MenuItems>

                <shell:ApplicationBarMenuItem Text="MenuItem 3" />

                <shell:ApplicationBarMenuItem Text="MenuItem 4" />

            </shell:ApplicationBar.MenuItems>

        </shell:ApplicationBar>

    </Application.Resources>

ResourceDemo.xaml

<phone:PhoneApplicationPage

    x:Class="Demo.ApplicationBarDemo.ResourceDemo"

    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"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"

    shell:SystemTray.IsVisible="True"

    ApplicationBar = "{StaticResource AppBar1}">

    <!--以资源集合中的名为 AppBar1 的资源来配置此页的 AplicationBar（XAML 方式）-->

    <StackPanel Orientation="Vertical">

        <!--用资源集合中的资源来配置此页的 AplicationBar（Code 方式）-->

        <Button Name="btnAppBar1" Content="AppBar1" Click="btnAppBar1_Click" />

        <Button Name="btnAppBar2" Content="AppBar2" Click="btnAppBar2_Click" />

    </StackPanel>

</phone:PhoneApplicationPage>

ResourceDemo.xaml.cs

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;

using Microsoft.Phone.Shell;

namespace Demo.ApplicationBarDemo

{

    public partial class ResourceDemo : PhoneApplicationPage

    {

        public ResourceDemo()

        {

            InitializeComponent();

        }

        private void btnAppBar1_Click(object sender, RoutedEventArgs e)

        {

            // 以资源集合中的名为 AppBar1 的资源来配置此页的 AplicationBar（Code 方式）

            ApplicationBar = ((ApplicationBar)Application.Current.Resources["AppBar1"]);

        }

        private void btnAppBar2_Click(object sender, RoutedEventArgs e)

        {

            // 以资源集合中的名为 AppBar2 的资源来配置此页的 AplicationBar（Code 方式）

            ApplicationBar = ((ApplicationBar)Application.Current.Resources["AppBar2"]);

        }

    }

}

OK
[源码下载]

与众不同 windows phone (3) - Application Bar（应用程序栏）的更多相关文章

  1. Windows Phone 8.1 新特性 - 控件之应用程序栏

    2014年4月3日的微软Build 2014 大会上,Windows Phone 8.1 正式发布.相较于Windows Phone 8,不论从用户还是开发者的角度,都产生了很大的变化.接下来我们会用 ...

  2. Windows Phone 8.1 新功能 - 应用栏控件

    2014年4月3日的微软Build 2014 大会上.Windows Phone 8.1 正式公布. 相较于Windows Phone 8.不论从用户还是开发人员的角度,都产生了非常大的变化. 接下来 ...

  3. 与众不同 windows phone (16) - Media（媒体）之编辑图片, 保存图片到相册, 与图片的上下文菜单“应用程序...”和“共享...”关联, 与 Windows Phone 的图片中心集成

    原文:与众不同 windows phone (16) - Media(媒体)之编辑图片, 保存图片到相册, 与图片的上下文菜单"应用程序..."和"共享..." ...

  4. 与众不同 windows phone (27) - Feature（特性）之搜索的可扩展性, 程序的生命周期和页面的生命周期, 页面导航, 系统状态栏

    原文:与众不同 windows phone (27) - Feature(特性)之搜索的可扩展性, 程序的生命周期和页面的生命周期, 页面导航, 系统状态栏 [索引页][源码下载] 与众不同 wind ...

  5. 与众不同 windows phone (28) - Feature（特性）之手机方向, 本地化, 应用程序的试用体验, 系统主题资源, 本地数据的加密解密

    原文:与众不同 windows phone (28) - Feature(特性)之手机方向, 本地化, 应用程序的试用体验, 系统主题资源, 本地数据的加密解密 [索引页][源码下载] 与众不同 wi ...

  6. 与众不同 windows phone (37) - 8.0 文件系统: StorageFolder, StorageFile, 通过 Uri 引用文件, 获取 SD 卡中的文件

    [源码下载] 与众不同 windows phone (37) - 8.0 文件系统: StorageFolder, StorageFile, 通过 Uri 引用文件, 获取 SD 卡中的文件 作者:w ...

  7. 与众不同 windows phone (38) - 8.0 关联启动: 使用外部程序打开一个文件或URI, 关联指定的文件类型或协议

    [源码下载] 与众不同 windows phone (38) - 8.0 关联启动: 使用外部程序打开一个文件或URI, 关联指定的文件类型或协议 作者:webabcd 介绍与众不同 windows ...

  8. 与众不同 windows phone (15) - Media（媒体）之后台播放音频

    原文:与众不同 windows phone (15) - Media(媒体)之后台播放音频 [索引页][源码下载] 与众不同 windows phone (15) - Media(媒体)之后台播放音频 ...

  9. 与众不同 windows phone (14) - Media（媒体）之音频播放器, 视频播放器, 与 Windows Phone 的音乐和视频中心集成

    原文:与众不同 windows phone (14) - Media(媒体)之音频播放器, 视频播放器, 与 Windows Phone 的音乐和视频中心集成 [索引页][源码下载] 与众不同 win ...

随机推荐

  1. Global文件（修正篇）

    什么是Global文件 Global.asax文件俗称为一个类,继承于Httpapplication类.位于应用程序根目录下.也可称为应用程序文件. 概述: Global文件是可选的,一般在创建应用程 ...

  2. cocos2d-实现读取.plist文件（使用数组CCArray）

    学习札记之cocos2d-x2.1.1实现读取.plist文件(使用数组CCArray) <?xml version="1.0" encoding="UTF-8&q ...

  3. 侧滑UI

    1.视图 activity_main.xml <com.zyhui.cehua.SlidingMenu xmlns:android="http://schemas.android.co ...

  4. Java中的异常详解

    一.异常定义 阻止当前方法或作用域继续执行的问题,称为异常 二.异常分析      所有不正常类都继承Throwable类,这个类主要有两个子类Error类和Exception类.Error指系统错误 ...

  5. 更换Winform 皮肤(下)----完全GDI+绘制

    skin皮肤和DLL程序及文件:下载 链接:http://www.cnblogs.com/DebugLZQ/archive/2013/04/15/3021659.html

  6. Git 将本次修改追加在上一次修改上面

    Git 将本次修改追加在上一次修改上面 git add . git commit --amend 之后就是进入日志提交页面 确保change-Id那条记录出现在最后一行,如: zh-->en 修 ...

  7. Android 判断当前线程是否为主线程

    public static boolean isInMainThread() { return Looper.myLooper() == Looper.getMainLooper(); }

  8. SAP超时问题

    其他常用的参数如下: login/system_client 登录时默认的Client号 login/password_expiration_time 密码有效期 login/fails_to_use ...

  9. Ubuntu 安装启动Tomcat

    首先下载ubuntu 的tar包 官网: http://tomcat.apache.org/download-80.cgi 安装启动 1 .下载对应的tar 2 .解压任意文件夹下,更改名字tomca ...

  10. getAttribute()获取属性

    Js:getAttribute[转] 一份文档就是一棵节点树. ●节点分为不同的类型:元素节点.属性节点和文本节点等. ●getElementById()方法将返回一个对象,该对象对应着文档里的一个特 ...