带有GroupBox的WPF Dockpanel未占用所有可用空间

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

我想要实现的非常简单，我想要在应用程序的右上角有3个按钮，在它们下面有一个tabcontrol，占据所有可用空间

在这个tabcontrol中，我现在只使用第一个TabItem。在该选项卡项中，我需要3列，中间是用户调整应用程序大小时唯一增长的列

这些列中的每一列都包含GroupBox，其中包含信息。这些分组框是我的问题。。。他们只是不做我想让他们做的事

我的测试应用程序如下所示：

<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>

2个主要问题：中间的groupbox没有占据所有空间，底部的groupbox没有完全停靠到底部

有线索吗

解决方案：

<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>

---

使用

网格

而不是

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>

---

使用

网格

而不是

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>

当您打开与“DockPanel仅用于学习目的”的对比时，应该有一个很大的免责声明@Elad-完全同意！DockPanel是邪恶的：）所以。。。DockPanel不工作了？我尝试将组合框固定为“顶部”，但它没有按预期填充宽度。这根本不是对接。当你打开与“DockPanel仅供学习之用”@Elad-完全同意时，应该有一个很大的免责声明！DockPanel是邪恶的：）所以。。。DockPanel不工作了？我尝试将组合框固定为“顶部”，但它没有按预期填充宽度。那根本不是对接。