c# - 应用栏中的多个按钮

Question

恐怕我在这里遗漏了一些简单的东西，但我正在尝试在我的应用栏中放置多个按钮。

这是初始应用栏的代码

<common:LayoutAwarePage.TopAppBar>
    <AppBar HorizontalAlignment="Left">
        <Button  x:Name="resetButton" Content="Reset" HorizontalAlignment="Left" VerticalAlignment="Stretch" Click="resetButton_Click" />
    </AppBar>
</common:LayoutAwarePage.TopAppBar>

现在这段代码可以工作了，但我想添加第二个按钮。

我认为这很容易做到，我尝试过:

<common:LayoutAwarePage.TopAppBar>
    <AppBar HorizontalAlignment="Left"> <!-- line 19 -->
        <Button  x:Name="resetButton" Content="Reset" HorizontalAlignment="Left" VerticalAlignment="Stretch" Click="resetButton_Click" />
        <Button  x:Name="newButton" Content="NewButton" />  <!-- line 21 -->
    </AppBar>
</common:LayoutAwarePage.TopAppBar>

但我收到以下错误:

The property "Content" can only be set once. (line 19)
The property "Content" can only be set once. (line 21)
Duplication assignment to the 'Content' property of the 'AppBar' object (line 21)

我认为 AppBar 控件可能缺少某些内容。我如何在其中放置第二个按钮？

Answer 1

只需将所有内容放在 AppBar 中的 StackPanel 中

<common:LayoutAwarePage.TopAppBar>
    <AppBar HorizontalAlignment="Left"> <!-- line 19 -->
        <StackPanel Orientation="Horizontal">
            <Button  x:Name="resetButton" Content="Reset" HorizontalAlignment="Left" VerticalAlignment="Stretch" Click="resetButton_Click" />
            <Button  x:Name="newButton" Content="NewButton" />  <!-- line 21 -->
        </StackPanel>
    </AppBar>
</common:LayoutAwarePage.TopAppBar>

为了更好地控制，您可以使用 Grid，这将允许您在两边都有内容:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="auto"/>
    </Grid.ColumnDefinitions>
    <StackPanel x:Name="LeftPanel" Orientation="Horizontal" Grid.Column="0" HorizontalAlignment="Left">
        <!-- Left Content here -->
    </StackPanel>
    <StackPanel x:Name="RightPanel" Orientation="Horizontal" Grid.Column="1" HorizontalAlignment="Right">
        <!-- Right Content here -->
    </StackPanel>
</Grid>