WPF三行Grid布局异常：可折叠行、GridSplitter与DataGrid适配问题

我明白你想要实现一个带可折叠TextBox的Grid布局，结合GridSplitter让TextBox和DataGrid灵活分配空间，同时TextBox不会随输入自动扩展高度。下面给你梳理实现思路和完整代码：

核心布局要点 #

• 采用Grid的三行结构：第一行放置TextBox，第二行是GridSplitter，第三行放置DataGrid
• 通过绑定CheckBox.IsChecked控制TextBox所在行的Visibility
• 配置TextBox属性，确保输入时高度不自动扩展
• 利用Grid的*高度分配规则，让显示状态下的TextBox和DataGrid共享空间，折叠时DataGrid自动占满整个Grid

完整XAML代码示例 #

<DockPanel>
    <StackPanel DockPanel.Dock="Top" Orientation="Horizontal" Margin="5">
        <CheckBox x:Name="ShowTextBox" Content="显示文本框" IsChecked="True" />
    </StackPanel>

    <Grid>
        <Grid.RowDefinitions>
            <!-- TextBox所在行：绑定CheckBox控制可见性，用*分配空间 -->
            <RowDefinition Height="*" Visibility="{Binding IsChecked, ElementName=ShowTextBox, Converter={StaticResource BooleanToVisibilityConverter}}" />
            <!-- GridSplitter：固定高度，横向拉伸 -->
            <RowDefinition Height="5" Visibility="{Binding IsChecked, ElementName=ShowTextBox, Converter={StaticResource BooleanToVisibilityConverter}}" />
            <!-- DataGrid所在行：始终用*分配空间，TextBox折叠时自动占满整个Grid -->
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <!-- TextBox：禁止自动扩展高度，内容过多时显示滚动条 -->
        <TextBox Grid.Row="0" 
                 Margin="5"
                 AcceptsReturn="False"  <!-- 禁止回车换行，避免高度被撑大 -->
                 VerticalScrollBarVisibility="Auto"  <!-- 内容超出时显示滚动条 -->
                 VerticalContentAlignment="Top"
                 Text="输入文本试试，高度不会自动变化哦" />

        <!-- GridSplitter：支持上下调整行高度 -->
        <GridSplitter Grid.Row="1"
                      HorizontalAlignment="Stretch"
                      Background="#CCCCCC"
                      ResizeDirection="Rows" />

        <!-- DataGrid：自动填充所在行空间 -->
        <DataGrid Grid.Row="2"
                  Margin="5"
                  AutoGenerateColumns="False">
            <!-- 示例列，可根据业务需求修改 -->
            <DataGrid.Columns>
                <DataGridTextColumn Header="序号" Binding="{Binding Id}" />
                <DataGridTextColumn Header="内容" Binding="{Binding Content}" />
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</DockPanel>

关键细节说明 #

1. 行可见性绑定：
   TextBox和GridSplitter所在的行都绑定到CheckBox的IsChecked属性，借助BooleanToVisibilityConverter实现勾选显示、取消折叠的效果。此时DataGrid所在行的*高度会自动占满整个Grid。

2. TextBox高度控制：

   • 若不需要多行输入，设置AcceptsReturn="False"即可避免文本行数增加导致高度扩展；
   • 若需要支持多行但高度固定，可改为AcceptsReturn="True"，同时添加MaxHeight属性（比如MaxHeight="150"），配合VerticalScrollBarVisibility="Auto"，内容超过高度时会显示滚动条，TextBox本身高度保持不变。

3. GridSplitter配置：
   设置ResizeDirection="Rows"确保只能上下调整行高度，HorizontalAlignment="Stretch"让Splitter铺满Grid宽度，方便拖动调整空间比例。

补充：BooleanToVisibilityConverter的声明 #

如果你的项目中没有全局声明这个转换器，需要在Window/UserControl的Resources中添加：

<Window.Resources>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
</Window.Resources>

这样就能完美实现你想要的效果：TextBox折叠时DataGrid占满空间，显示时两者通过Splitter调整比例，且TextBox高度不会随输入自动变化。

内容的提问来源于stack exchange，提问作者senfen