Windows Phone 中的命令栏

Question

我在 windows phone 中使用命令栏使用下面的代码

<Page.BottomAppBar>
        <CommandBar Foreground="White">
            <CommandBar.PrimaryCommands>
                <AppBarButton x:Uid="Share">
                    <AppBarButton.Icon>
                        <BitmapIcon UriSource="/Assets/Share.png"/>
                    </AppBarButton.Icon>
                </AppBarButton>
                <AppBarButton Icon="Favorite"></AppBarButton>
                <AppBarButton Icon="Comment"></AppBarButton>
            </CommandBar.PrimaryCommands>
        </CommandBar>
    </Page.BottomAppBar>

我得到一个没有任何背景的页脚图标，如下所示。只是显示图标图像。

但我需要一个像这样的页脚图标，每个图标都有一些圆形背景，前景为白色

请指导我达到预期

Answer 1

试着按照以下：

1) 在 Blend 中打开您要修改的页面。单击实际控件并右键单击。

2) 从弹出窗口 window 选择创建新模板并定义为应用程序

3) 它在 App.xaml 中创建默认模板的副本。现在在样式结束前查找标记 ContentPresenter。它将包装在名称为 ContentRoot 的 StackPanel 中。用边框包裹它。

<Border BorderBrush="{TemplateBinding Foreground}" CornerRadius="50" BorderThickness="2" Margin="10,0">

最后应该是下面这样了

<Border BorderBrush="{TemplateBinding Foreground}" CornerRadius="50" BorderThickness="2" Margin="10,0">
    <StackPanel x:Name="ContentRoot" MinHeight="{ThemeResource AppBarThemeCompactHeight}">
        <ContentPresenter x:Name="Content" AutomationProperties.AccessibilityView="Raw" Content="{TemplateBinding Icon}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Center" Height="20" Width="20" Margin="0,12,0,4"/>
        <TextBlock x:Name="TextLabel" Foreground="{TemplateBinding Foreground}" FontSize="12" FontFamily="{TemplateBinding FontFamily}" Margin="0,0,0,6" TextAlignment="Center" TextWrapping="Wrap" Text="{TemplateBinding Label}"/>
    </StackPanel>
</Border>

现在返回您的页面并将样式设置为此样式键。喜欢下面。

<AppBarButton Icon="Favorite" Style="{StaticResource AppBarButtonStyle1}" ></AppBarButton>

这就是融合之美。不只是这个控件，您可以修改任何具有样式模板的控件。

祝你好运。

Windows Phone 中的命令栏

Command Bar in Windows Phone

xaml

windows-phone