WPF-功能区上的定位按钮

Question

我正在将WebKitBrowser 集成到 C# 应用程序中，使用 WPF 为应用程序实现 GUI。

刚刚向应用程序添加了“选项卡式查看”功能（用户可以在其中选择一个选项卡来查看应用程序，并选择另一个选项卡来查看应用程序窗口内的 Web 浏览器），我现在想将导航按钮添加到表单，类似于标准网络浏览器的表单（即“返回”、“前进”和“刷新”按钮）。

我的.xaml 文件中有以下标记：

<Grid>
    <Menu IsMainMenu="True" Background="White">
        ...
        <Ribbon x:Name="NavMenu" SelectedIndex="0" Width="928" Height="30">
            <RibbonButton SmallImageSource="...\navigateBack.png" Height="5" Width="5" />
        </Ribbon>
    </Menu>
    <TabControl agent="clr-namespace:Agent" Margin="0,29,-0.4,0.4">
        <TabItem Header="Application">
            ...
        </TabItem>
        <TabItem Header="Browser">
            ...
        </TabItem>
    </TabControl>
</Grid>

但是，当我运行我的应用程序时，虽然我可以看到我添加的“菜单”Ribbon（在应用程序MainMenu 旁边，在TabControl 上方），但我已经添加到功能区似乎很“低”（即显示在“选项卡”控件后面），所以我只能看到按钮的顶部。

在 Visual Studio 的设计视图中，我可以看到功能区显示在与 MainMenu 相同的高度，因此其内容应该显示在选项卡上方，但此刻，我添加的按钮到功能区正在选项卡后面显示...

有没有办法可以设置按钮在功能区上的位置，使其绑定到功能区的顶部，这样整个按钮就会显示在选项卡上方？

我已尝试寻找可以在 XAML 中的 <RibbonButton /> 标记上设置的 position 或 x 和 y 属性，但似乎无法在这里找到任何我想要的东西 - 任何人有什么建议吗？

Answer 1

更规范的布局方式如下（这可能会纠正问题）

<Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Menu IsMainMenu="True" Background="White">
        ...
        <Ribbon x:Name="NavMenu" SelectedIndex="0">
            <RibbonButton SmallImageSource="...\navigateBack.png"  />
        </Ribbon>
    </Menu>
    <TabControl agent="clr-namespace:Agent" Margin="0,0,-0.4,0.4" Grid.Row="1">
        <TabItem Header="Application">
            ...
        </TabItem>
        <TabItem Header="Browser">
            ...
        </TabItem>
    </TabControl>
</Grid>