我无法在WP 8.1中的CommandBar中为AppBarButton应用自定义样式

时间:2015-02-19 13:34:57

标签: windows-phone-8.1 styling appbar commandbar

我有一个非常具体的问题。我找不到这个确切问题的答案,所以我使用了试错法来查明问题。以下是我遇到问题的示例代码:

<Page.BottomAppBar>
    <CommandBar x:Name="MainMenuCommandBar" ClosedDisplayMode="Minimal">
        <CommandBar.PrimaryCommands>
            <AppBarButton x:Name="otherCommandButton" Label="Egyéb" Icon="List" Click="otherCommandButton_Click" Style="{StaticResource appbarButton}">
                <AppBarButton.Flyout>
                    <MenuFlyout>
                        <MenuFlyoutItem x:Name="SecondaryFlyout1" Text="Névjegy" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout2" Text="Adatbázis mentés" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout3" Text="Adatbázis visszaállítás" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout4" Text="Terminál törlése" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout5" Text="Jelszavas védelem" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout6" Text="Nyelv váltás" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout7" Text="Betűméret" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                        <MenuFlyoutItem x:Name="SecondaryFlyout8" Text="Kilépés" Style="{StaticResource BottomAppBarFlyoutStyle}"/>
                    </MenuFlyout>
                </AppBarButton.Flyout>
            </AppBarButton>
            <AppBarButton x:Name="refreshCommandButton" Label="Frissítés(Bank)" Icon="Refresh" Style="{StaticResource appbarButton}"/>
            <AppBarButton x:Name="syncCommandButton" Label="Szinkronizál(PC)" Icon="Sync" Style="{StaticResource appbarButton}"/>
        </CommandBar.PrimaryCommands>
    </CommandBar>
</Page.BottomAppBar>

我想在命令栏中为appbarbuttons应用自定义样式,因为标签中的文本太长,我看不到整个文本。所以我想,我会把文字缩小,或者appbarbutton更宽。设计师向我展示了这些变化,但是当我运行程序时,没有任何变化。无论我做什么,appbarbuttons都使用默认样式。因此,当我运行程序时,文本不会变小。

在此之后,我试图找出问题所在。我也尝试编辑模板,但“编辑副本”命令显示为灰色。我觉得这很奇怪,因为我穿过MSDN,在那里我看到appbarbuttons实际上有一种我可以编辑的风格。我复制了默认样式,进行了更改,将其作为自定义样式应用到我的app.xaml中,但我遇到了和以前一样的问题。无论我改变风格,都没有任何改变。在所有这些失败之后,我将一个appbarbutton OUTSIDE命令栏。在这种情况下,一切正常。我可以编辑模板的副本,这些更改反映了我运行程序的时间。另一个奇怪的例子是,menuflyoutitems可以在命令栏中设置样式。

对于冗长的解释感到抱歉,我想呈现我已经知道的内容。我的问题很简单,有没有办法在命令栏中设置appbarbutton的样式?或者,如果没有,是否有任何替代方法来创建自定义命令栏?

1 个答案:

答案 0 :(得分:5)

Windows Phone上的CommandBar是系统UI,除了设置它的前景色和背景色之外,不能由应用自定义。

如果您想自定义各个按钮,则需要为他们实现自己的面板,而不是使用应用栏。您可以在页面底部放置一个水平“堆栈面板”,并在其中包含自定义的AppBarButtons。如果你想让它成为鞋子和隐藏你需要设置自己的逻辑来检测触发输入,然后应用动画来打开和关闭它。