Question

我目前正在使用Windows 10，我正在使用AppBar和Command Bar控件。我创建了一个Appbar，在其中添加了一个包含appBar按钮的commandBar。现在问题是它为commandBar和AppBar显示更多图标。您能否建议我如何删除它？

我的代码在下面

CommandBar commandBar = new CommandBar();
if (this.BottomAppBar == null)
{
       this.BottomAppBar = new AppBar();
       this.BottomAppBar.IsOpen = true;
       this.BottomAppBar.IsSticky = true;
}

commandBar.PrimaryCommands.Clear();
commandBar.IsSticky = true;
commandBar.IsOpen = true;
commandBar.ClosedDisplayMode = AppBarClosedDisplayMode.Compact;
AppBarButton appBarButton = new AppBarButton();
appBarButton.Foreground = MCSExtensions.GetColorFromHex(foreground_color);
appBarButton.Icon = new BitmapIcon() { UriSource = new Uri("ms-appx:///Images/submit.png", UriKind.Absolute) };
appBarButton.Label = formButton.B_NAME;

commandBar.PrimaryCommands.Add(appBarButton);
this.BottomAppBar.Content=commandBar;

以上是产生以下输出

我真正想要的是左侧栏，即commandBar，而不是灰色部分。有人可以建议我做错了吗？我也试过在网格中添加CommmandBar但它根本没有显示。

更新

CommandBar commandBar=new CommmandBar();
commandBar.IsOpen=true;
commandBar.IsSticky=true;
commandBar.ClosedDisplayMode=AppBarClosedDisplatMode.Compact;
AppBarButton appBarButton = new AppBarButton();
appBarButton.Foreground = MCSExtensions.GetColorFromHex(foreground_color);
appBarButton.Icon = new BitmapIcon() { UriSource = new Uri("ms-appx:///Images/submit.png", UriKind.Absolute) };
appBarButton.Label = formButton.B_NAME;

commandBar.PrimaryCommands.Add(appBarButton);
pageLayoutRootGrid.Children.Add(commandBar);

我还尝试在AppBar中添加StackPanel，如下所示，但没有给出正确的结果。

if (this.BottomAppBar == null)
{
       this.BottomAppBar = new AppBar();
       this.BottomAppBar.IsOpen = true;
       this.BottomAppBar.IsSticky = true;
}
StackPanel appBarPanel=new StackPanel();
appBarPanel.Orientation=Orientation.Horizontal;          
AppBarButton appBarButton = new AppBarButton();
appBarButton.Foreground = MCSExtensions.GetColorFromHex(foreground_color);
appBarButton.Icon = new BitmapIcon() { UriSource = new Uri("ms-appx:///Images/submit.png", UriKind.Absolute) };
appBarButton.Label = formButton.B_NAME;

appBarPanel.Children.Add(appBarButton);
this.BottomAppBar.Content=appBarPanel;

Answer 1

对于xaml：

<Page.BottomAppBar>
    <CommandBar>
        <CommandBar.PrimaryCommands>
            <AppBarButton Icon="Accept"/>
        </CommandBar.PrimaryCommands>
    </CommandBar>
</Page.BottomAppBar>

此行会让您的用户界面混乱：

this.BottomAppBar = new AppBar();

从我的xaml中可以看到，在BottomAppBar中只创建了1个CommandBar

编辑：如果您想使用代码，请使用：

var commandBar = new CommandBar();
commandBar.PrimaryCommands.Add(new AppBarButton() { Label = "test" });
commandBar.VerticalAlignment = VerticalAlignment.Bottom;
this.root.Children.Add(commandBar);

<强>更新

完整的xaml代码：

<Page
    x:Class="CommandBarSample.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:CommandBarSample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" x:Name="root">

    </Grid>
</Page>

背后的代码：

public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();



            var commandBar = new CommandBar();
            commandBar.VerticalAlignment = VerticalAlignment.Bottom;
            var appBarButton = new AppBarButton() { Icon = new SymbolIcon(Symbol.Accept), Label = "Accept" };
            commandBar.PrimaryCommands.Add(appBarButton);

            root.Children.Add(commandBar);
        }
    }

如何在Windows 10中删除更多appbar？

1 个答案: