Windows 8.1 新增控件之 CommandBar

原文:Windows 8.1 新增控件之 CommandBar

上一篇为大家介绍了AppBar 的相关内容,本篇继续介绍CommandBar 的使用方法。与AppBar 相比而言,CommandBar 在开发使用方面较为单一,在按键布局上分为主控区(Primary Commands)与辅控区(Secondary Commands),默认情况下,主控区显示在菜单右侧,辅控区在左侧。

如果应用菜单栏中只包含AppBarButton、AppBarToggleButton、AppBarSeparator 这几个控件,且没有特殊布局格式要求,及可以使用CommandBar 控件。当应用尺寸变化时,CommandBar 也会随之调整尺寸。

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton x:Uid="Camera" Icon="Camera" Label="Camera"/>
        <AppBarToggleButton x:Uid="Suffle" Icon="Shuffle" Label="Shuffle"/>
        <AppBarToggleButton x:Uid="Account" Icon="Account" Label="Account"/>
        <AppBarButton x:Uid="Like" Icon="Like" Label="Like"/>
        <AppBarButton x:Uid="Dislike" Icon="Dislike" Label="Dislike"/>

        <AppBarSeparator/>

        <AppBarButton x:Uid="Add" Icon="Add" Label="Add"/>
        <AppBarToggleButton x:Uid="Remove" Icon="Remove" Label="Remove"/>
        <AppBarButton x:Uid="Delete" Icon="Delete" Label="Delete"/>
    </CommandBar>
</Page.BottomAppBar>

如上面代码,默认所有控件都是分配在主控区及菜单栏右侧,将Add、Remove、Delete 按键放入辅控区是什么样子呢,如下:

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton x:Uid="Camera" Icon="Camera" Label="Camera"/>
        <AppBarToggleButton x:Uid="Suffle" Icon="Shuffle" Label="Shuffle"/>
        <AppBarToggleButton x:Uid="Account" Icon="Account" Label="Account"/>
        <AppBarButton x:Uid="Like" Icon="Like" Label="Like"/>
        <AppBarButton x:Uid="Dislike" Icon="Dislike" Label="Dislike"/>

        <AppBarSeparator/>

        <CommandBar.SecondaryCommands>
            <AppBarButton x:Uid="Add" Icon="Add" Label="Add"/>
            <AppBarToggleButton x:Uid="Remove" Icon="Remove" Label="Remove"/>
            <AppBarButton x:Uid="Delete" Icon="Delete" Label="Delete"/>
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

如上图所示,写入SecondaryCommands 的按键被分配到了菜单栏左侧。关于CommandBar 介绍就到这里,大家可以动手操练一下。

时间: 2024-09-18 22:35:40

Windows 8.1 新增控件之 CommandBar的相关文章

Windows 8.1 新增控件之 DatePicker

原文:Windows 8.1 新增控件之 DatePicker 大年初一来介绍一个简单易用的DatePicker 控件,这个控件是新增的?印象里很早就有了啊,Anyway来看看Windows 8.1 里的DataPicker 有什么功能吧. 先来看看这个代码,很简单就是一个选择生日的DatePicker <DatePicker x:Name="datePicker" Header="Brithday"/> 但是这个日期好像有些怪怪的,生日应该不会超过20

Windows 8.1 新增控件之 Hyperlink

原文:Windows 8.1 新增控件之 Hyperlink Hyperlink 控件应该不用过多介绍大家肯定十分清楚其作用,它的功能就像HTML中的<a href="">标签一样,只不过是在XAML中实现. 使用Hyperlink 标记的文字在应用中会以特殊颜色显示,当用户点击或触碰该文字时就会自动转到NavigateUri 指向的地址链接.如下代码所示: <TextBlock FontSize="50" FontWeight="Bol

Windows 8.1 新增控件之 MenuFlyout

原文:Windows 8.1 新增控件之 MenuFlyout 开始这篇讲解前,我们先来温习一下Flyout 的内容,当触发应用中某个Button 时会有Flyout 出现提示用户该操作接下来将会发生什么.Flyout 简单来说就是一个轻量级信息提示需要用户确认或忽略.再回来看MenuFlyout 呢,你肯定发现就是多了一个"Menu",没错MenuFlyout 就是为开发者增加了一个菜单控制功能. MenuFlyout 也同样是一个轻量级控件,可以在Flyout 中添加一些简单的控制

Windows 8.1 新增控件之 TimePicker

原文:Windows 8.1 新增控件之 TimePicker 之前已经为大家介绍过DatePicker 控件的相关内容,有日期控件当然就得有时间控件,本篇将和各位一起了解TimePicker 的使用方法. 先来介绍一下ClockIdentifier 属性,默认情况下TimePicker 是12小时制的,ClockIdentifier 可用来设定TimePicker 以12小时制或24小时制显示.如下面代码所示: <TimePicker ClockIdentifier="24HourClo

Windows 8.1 新增控件之 Flyout

原文:Windows 8.1 新增控件之 Flyout 本篇为大家介绍Flyout 控件,Flyout 属于一种轻量级交互控件,可以支持信息提示或用户交互.与传统Dialog 控件不同的是Flyout 控件可通过直接点击对话框外部区域忽略. Flyout 控件一般常与Button 结合使用,所以Button 控件默认增加了Flyout 属性,当使用Flyout 属性后,点击Button 时就会自动显示Flyout 内容,如下代码所示: <Button Content="Delete Fil

Windows 8.1 应用再出发 - 几种新增控件(1)

原文:Windows 8.1 应用再出发 - 几种新增控件(1) Windows 8.1 新增的一些控件,分别是:AppBar.CommandBar.DatePicker.TimePicker.Flyout.MenuFlyout.SettingsFlyout.Hub 和 Hyperlink.我们分成两篇来介绍,本篇先为大家介绍AppBar.CommandBar.DatePicker 和 TimePicker. 1. AppBar  Windows 8.1引入了几种新的控件来帮助我们更快捷的创建应

Windows 8.1 应用再出发 (WinJS) - 几种新增控件(1)

原文:Windows 8.1 应用再出发 (WinJS) - 几种新增控件(1) Windows 8.1 和 WinJS 引入了以下新控件和功能,分别是:AppBarCommand.BackButton.Hub.ItemContainer.NavBar.Repeater.WebView. 本篇我们先来介绍 AppBarCommand.BackButton.Hub.ItemContainer,其余三种放在下一篇中介绍. 1. AppBarCommand Windows 8.1 加入了AppBarC

重新想象 Windows 8.1 Store Apps (76) - 新增控件: SearchBox

原文:重新想象 Windows 8.1 Store Apps (76) - 新增控件: SearchBox [源码下载] 重新想象 Windows 8.1 Store Apps (76) - 新增控件: SearchBox 作者:webabcd 介绍重新想象 Windows 8.1 Store Apps 之新增控件 SearchBox - 搜索框(数据源在本地,从输入法编辑器中获取相关信息) SearchBox - 搜索框(数据源在服务端,为搜索建议增加图标.描述等) SearchBox - 搜

重新想象 Windows 8.1 Store Apps (73) - 新增控件: DatePicker, TimePicker

原文:重新想象 Windows 8.1 Store Apps (73) - 新增控件: DatePicker, TimePicker [源码下载] 重新想象 Windows 8.1 Store Apps (73) - 新增控件: DatePicker, TimePicker 作者:webabcd 介绍重新想象 Windows 8.1 Store Apps 之新增控件 DatePicker - 日期选择控件 TimePicker - 时间选择控件 示例1.演示 DatePicker 的应用Date