WPF Dockbox与groupboxes没有占用所有可用空间

Question

我想重新构建一个应用程序的布局，所以我做了一个测试应用程序，在对原始项目进行更改之前获得我想要的内容。

我想要实现的很简单，我需要应用程序右上角的3个按钮以及它们下方的tabcontrol，并占用所有可用空间。

而在那个tabcontrol中，我现在只使用第一个TabItem。在那个tabitem中，我需要3列，中间是用户调整应用程序时唯一增长的列。

这些列中的每一列都包含groupboxes，并且里面有信息。这些群组是我的问题......他们只是不做我想让他们做的事情。

我的测试程序是这样的：

<Window x:Class="WpfDockingTests.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="774" Width="991"> 
    <DockPanel> 
     <StackPanel DockPanel.Dock="Top" Orientation="Horizontal" FlowDirection="RightToLeft"> 
      <Button 
       Height="31"     
       Width="126" 
       Content="Button 1" 
       HorizontalAlignment="Right"/> 
      <Button 
       Height="31"     
       Width="126" 
       Content="Button 2" 
       HorizontalAlignment="Right"/> 
     </StackPanel> 

     <TabControl DockPanel.Dock="Top"> 
      <TabItem Header="FirstTab"> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="375" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="280" /> 
        </Grid.ColumnDefinitions> 
        <DockPanel Grid.Column="0" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"> 
         <GroupBox DockPanel.Dock="Top" Height="300"/> 
         <GroupBox DockPanel.Dock="Top"> 
          <DockPanel VerticalAlignment="Stretch"> 
           <Button Name="a1" Content="Test" DockPanel.Dock="Top"/> 
           <Button Name="a2" Content="Test2" DockPanel.Dock="Top" /> 
           <Button Name="a3" Content="Test3" DockPanel.Dock="Top"/> 
          </DockPanel> 
         </GroupBox> 
         <GroupBox DockPanel.Dock="Bottom" Height="200"/> 
        </DockPanel>      
       </Grid> 
      </TabItem> 
      <TabItem Header="SecondTab" /> 
     </TabControl> 
    </DockPanel> 
</Window> 

两个主要问题：中间组框不占用所有的空间，底部组框不停靠一路底部。

任何线索？

解决方案：

<TabControl DockPanel.Dock="Top"> 
      <TabItem Header="FirstTab"> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="375" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="280" /> 
        </Grid.ColumnDefinitions> 
        <Grid Grid.Column="0" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="300" /> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="200" /> 
         </Grid.RowDefinitions> 
         <GroupBox Grid.Row="0"/> 
         <GroupBox Grid.Row="1"> 
          <DockPanel VerticalAlignment="Stretch"> 
           <Button Name="a1" Content="Test" DockPanel.Dock="Top"/> 
           <Button Name="a2" Content="Test2" DockPanel.Dock="Top" /> 
           <Button Name="a3" Content="Test3" DockPanel.Dock="Bottom"/> 
          </DockPanel> 
         </GroupBox> 
         <GroupBox Grid.Row="2"/> 
        </Grid>      
       </Grid> 
      </TabItem> 
      <TabItem Header="SecondTab" /> 
     </TabControl> 

Answer 1

使用Grid，而不是DockPanel：

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <StackPanel Grid.Row="0" FlowDirection="RightToLeft" Orientation="Horizontal"> 
     <Button Width="126" Height="31" HorizontalAlignment="Right" Content="Button 1"/> 
     <Button Width="126" Height="31" HorizontalAlignment="Right" Content="Button 2"/> 
    </StackPanel> 
    <TabControl Grid.Row="1"> 
     <TabItem Header="FirstTab"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="375"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="280"/> 
      </Grid.ColumnDefinitions> 
      <GroupBox Height="300" Grid.Column="0"/> 
      <GroupBox Grid.Column="1"> 
       <StackPanel> 
        <Button Name="a1" Content="Test"/> 
        <Button Name="a2" Content="Test2"/> 
        <Button Name="a3" Content="Test3"/> 
       </StackPanel> 
      </GroupBox> 
      <GroupBox Height="200" DockPanel.Dock="Bottom"/> 
     </Grid> 
     </TabItem> 
     <TabItem Header="SecondTab"/> 
    </TabControl> 
</Grid>