具有多个兄弟姐妹的 WPF GridSplitter 无法按预期工作

WPF GridSplitter with multiple siblings not doen't work as expected

我在论坛上搜索了一圈,没有找到类似的问题。我有以下 WPF 代码。

<Window x:Class="WpfApp5.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp5"
        mc:Ignorable="d"
        Title="MainWindow" Height="238.788" Width="406.407">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBox TextWrapping="Wrap" Text="TextBox1 should be resized while moving the GridSplitter"/>
        <GridSplitter HorizontalAlignment="Stretch" Height="5"  Grid.Row="1" />
        <StackPanel Grid.Row="2" Orientation="Horizontal" Background="Black">
            <TextBlock Padding="5" Text="I want this black section have fixed height while moving the GridSplitter" Foreground="Aqua" VerticalAlignment="Center" />
        </StackPanel>
        <TextBox Grid.Row="3" TextWrapping="Wrap" Text="TextBox2 should be resized while moving the GridSplitter"/>
    </Grid>
</Window>

当用户拖动网格拆分器时,只有两个文本框应该调整大小。但是我得到的是这样的:

我该如何解决这个问题?

StackPanel 和第二个 TextBox 移动到单个 Panel:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBox TextWrapping="Wrap" Text="TextBox1 should be resized while moving the GridSplitter"/>
    <GridSplitter HorizontalAlignment="Stretch" Height="5"  Grid.Row="1" />
    <DockPanel Grid.Row="2">
        <StackPanel Orientation="Horizontal" Background="Black" DockPanel.Dock="Top">
            <TextBlock Padding="5" Text="I want this black section have fixed height while moving the GridSplitter" Foreground="Aqua" VerticalAlignment="Center" />
        </StackPanel>
        <TextBox TextWrapping="Wrap" Text="TextBox2 should be resized while moving the GridSplitter"/>
    </DockPanel>
</Grid>

很简单,通过“StackPanel”设置VerticalAlignment="Center"

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBox TextWrapping="Wrap" Text="TextBox1 should be resized while moving the GridSplitter"/>
    <GridSplitter HorizontalAlignment="Stretch" Height="5"  Grid.Row="1" />
    <StackPanel Grid.Row="2" Orientation="Horizontal" Background="Black" VerticalAlignment="Center">
        <TextBlock Padding="5" Text="I want this black section have fixed height while moving the GridSplitter" Foreground="Aqua" VerticalAlignment="Center" />
    </StackPanel>
    <TextBox Grid.Row="3" TextWrapping="Wrap" Text="TextBox2 should be resized while moving the GridSplitter"/>
</Grid>

我发现问题不是因为GridSplitter只能拆分前后两个siblings,而是错误的RowDefinition!在问题的代码片段中,第一个和第四个 RowDefinition 设置为 Height="*",这迫使他们将额外的 space 平均分配。这就是为什么当您拖动拆分器时,第一行和第四行始终保持相同的高度。如果我根据以下设置更改它们,它就会按预期工作。

   <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="150" />
            <RowDefinition Height="5" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <TextBox TextWrapping="Wrap" Text="TextBox1 should be resized while moving the GridSplitter" />
        <GridSplitter HorizontalAlignment="Stretch" Height="5" Grid.Row="1" />
        <StackPanel Grid.Row="2" Orientation="Horizontal" Background="Black">
            <TextBlock Padding="5" Text="I want this black section have fixed height while moving the GridSplitter"
                       Foreground="Aqua" VerticalAlignment="Center" />
        </StackPanel>
        <TextBox Grid.Row="3" TextWrapping="Wrap" Text="TextBox2 should be resized while moving the GridSplitter" />
    </Grid>

所以不用再嵌套了