仅增长的 GridSplitter

Question

我有一个非常简单的要求，但我似乎找不到解决方案。看看我的示例 XAML 代码：

<Grid ShowGridLines="True" VerticalAlignment="Top" Margin="5">
    <Grid.RowDefinitions>
        <RowDefinition MinHeight="100"/>
        <RowDefinition MinHeight="100"/>
        <RowDefinition MinHeight="100"/>
    </Grid.RowDefinitions>

    <Grid.Resources>
        <Style TargetType="GridSplitter">
            <Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="VerticalAlignment" Value="Bottom"/>
            <Setter Property="Height" Value="1"/>
            <Setter Property="Background" Value="Black"/>
        </Style>
    </Grid.Resources>

    <GridSplitter/>
    <GridSplitter Grid.Row="1"/>
    <GridSplitter Grid.Row="2"/>
</Grid>

我有三行，起始高度为 100。我希望用户能够拖动任何行的边缘以使其更高，因此我在每一行中都放置了一个 GridSplitter。

问题是：

GridSplitter 控件在行或列之间重新分配空间 在网格中，而不更改网格的尺寸。例如， 当 GridSplitter 调整两列的大小时，ActualWidth 属性 一列增加，同时 ActualWidth 另一列的属性减少了相同的量。

上面的 XAML 不起作用，拖动时没有任何行改变大小，因为 GridSplitter 试图从另一行获取高度并将其添加到正在调整大小的行。由于没有任何行可以变得更小 (MinHeight="100")，因此没有任何反应。

但我不想要从其他行获取高度。我想独立增加一行的大小，这反过来会改变Grid 的整体高度。如果我将中间行拖高 50 像素，我希望该行为 150 像素，而其他两行保持 100 像素，使整个网格为 350 像素。

我缺少的GridSplitter 上是否有任何设置允许这样做？或者我可以使用其他一些控件吗？

Answer 1

这是你所期待的吗？

<StackPanel>
    <TextBlock Text="{Binding ActualHeight, 
                      ElementName=grid, 
                      StringFormat='Grid Actual Height: {0}'}" FontSize="30"/>
    <Grid x:Name="grid" Background="Aqua">
        <Grid.Resources>
            <Style TargetType="GridSplitter">
                <Setter Property="HorizontalAlignment" Value="Stretch"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="Height" Value="5"/>
                <Setter Property="ShowsPreview" Value="False"/>
                <Setter Property="Background" Value="Black"/>
            </Style>
            <Style TargetType="TextBlock">
                <Setter Property="Text" 
                        Value="{Binding ActualHeight, 
                                RelativeSource={RelativeSource AncestorType=StackPanel}, 
                                StringFormat='Row Actual Height: {0}'}"/>
                <Setter Property="FontSize" Value="30"/>
                <Setter Property="HorizontalAlignment" Value="Center"/>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition MinHeight="100" Height="100" />
            <RowDefinition Height="Auto" />
            <RowDefinition MinHeight="100" Height="100" />
            <RowDefinition Height="Auto" />
            <RowDefinition MinHeight="100" Height="100" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0" Background="Tan">
            <TextBlock />
        </StackPanel>
        <GridSplitter Grid.Row="1"/>
        <StackPanel Grid.Row="2" Background="Brown">
            <TextBlock />
        </StackPanel>
        <GridSplitter Grid.Row="3"/>
        <StackPanel Grid.Row="4" Background="Bisque">
            <TextBlock />
        </StackPanel>
        <GridSplitter Grid.Row="5" ResizeBehavior="PreviousAndCurrent"/>
    </Grid>
</StackPanel>

问题在于您将GridSplitter 添加到Grid 控件的方式。您可以在GridSplitter 文档中获得有关其工作原理的更多详细信息。这也包括如何使用ResizeBehavior；我曾经让它在最后一行工作