M4: 使用CommandBar

本小节将介绍如何使用CommandBar, CommandBar分为PrimaryCommands和SecondaryCommands，在PrimaryCommands中不要放置多于四个按钮。然后将不常使用的命令放到SecondaryCommands中。

在MainPage.xaml页面， 添加Page.BottomAppBar， 在CommandBar中新添加四个AppBarButton。在CommandBar.SecondaryCommands中添加一个Menu Item。

打开Card程序， 在MainPage.xaml页面， 在</Page>之前，新添加Page.BottomAppBar控件。 在Page.BottomAppBar控件中， 新添加CommandBar控件， 修改后代码如下：

<Page.BottomAppBar>
    <CommandBar>
    </CommandBar>
</Page.BottomAppBar>

</Page>

在CommandBar中加入第一个AppBarButton Control， 命名为abtnGetWishes， 设置其Icon属性，Label属性。

<AppBarButton x:Name="abtnGetWishes" Icon="Play" Label="Wishes" />

同样加入其它三个AppBarButton Control， 并设置相应属性。

<AppBarButton x:Name="abtnGetWishes" Icon="Play" Label="Wishes" />
<AppBarButton x:Name="abtnSendFriend" Icon="Send" Label="Wishes" />
<AppBarButton x:Name="abtnOpenFile" Icon="Pictures" Label="Wishes" />
<AppBarButton x:Name="abtnOpenCamera" Icon="Camera" Label="Wishes" />

加入二级菜单项目。

<CommandBar.SecondaryCommands>
    <AppBarButton x:Name="abtnLike" Icon="Like" Label="Like" />
</CommandBar.SecondaryCommands>

在第二和第三个AppBarButton之间加入AppBarSeparator，将命令分组。

<AppBarSeparator />

然后，定义abtnGetWishes的单击事件为GetMessage_Click， 定义abtnSendFriend的单击事件为SendMail_Click。

修改后代码如下：

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton x:Name="abtnGetWishes" Icon="Play" Label="Wishes" Click="GetMessage_Click"/>
        <AppBarButton x:Name="abtnSendFriend" Icon="Send" Label="Send" Click="SendMail_Click"/>
        <AppBarSeparator />
        <AppBarButton x:Name="abtnOpenFile" Icon="Pictures" Label="Open" />
        <AppBarButton x:Name="abtnOpenCamera" Icon="Camera" Label="Camera" />
        <CommandBar.SecondaryCommands>
            <AppBarButton x:Name="abtnLike" Icon="Like" Label="Like" />
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

运行程序， 查看新添加CommandBar效果。