【万里征程——Windows App开发】应用栏

最新推荐文章于 2015-09-08 21:49:00 发布

nomasp

最新推荐文章于 2015-09-08 21:49:00 发布

阅读量5.4k

点赞数 6

分类专栏： Windows 10 Windows App开发文章标签： windows-10 app 应用栏 wp8 系统

本文链接：https://blog.csdn.net/NoMasp/article/details/44872097

版权

基本的用法我们在【万里征程——Windows App开发】页面布局和基本导航中已经讲过了，这里继续补充关于应用栏的更多用法。

Icon

在之前的学习中，我们知道Icon属性中有很多很多系统预定义，但也许这些还是不够的，现在就来增加几种用法咯。

字符集应用

<AppBarToggleButton Label="Sigma" Click="AppBarButton_Click">
    <AppBarToggleButton.Icon>
        <FontIcon Glyph="&#x03A3;"/>
    </AppBarToggleButton.Icon>
</AppBarToggleButton>

那么什么是字符集应用呢？请参阅维基百科。

PathIcon

我们也可以用路径来绘制一个属于自己的图形哦，下面的图形大概就是9点钟的样子啦。

<AppBarToggleButton Label="Time" Click="AppBarButton_Click">
    <AppBarToggleButton.Icon>                              
        <PathIcon Data="F1 M 20,20 21,1L 21,21L 8,21"/>
    </AppBarToggleButton.Icon>
</AppBarToggleButton>

这里写图片描述

如何适应不同的分辨率

如何适应不同的分辨率这也是值得我们去解决的问题，毕竟不论是从8英寸的平板还是25英寸的台式机，甚至还有4英寸至7英寸的手机，在应用栏按钮太多而屏幕不够大时，多余的按钮该怎么办呢？

默认情况下，应用栏图标的宽度都是确定好的100像素哦。那么我们先来看两张图片好了，由于Windows 10是可以直接调整Modern应用的大小的（而不是windows 8那种只能全屏显示），所以我直接拉伸Modern大小以模拟分辨率的概率啦。

这里写图片描述

    <Page.BottomAppBar>
        <AppBar x:Name="bottomAppBar" IsSticky="True">
            <Grid>          
                <StackPanel x:Name="leftBottomAppBar" 
                            Orientation="Horizontal">
                    <AppBarButton Label="Like" Icon="Like"/>
                    <AppBarButton Label="Dislike" Icon="Dislike"/>
                    <AppBarButton Label="Delete" Icon