如何:使用 GridSplitter 调整列的大小

此示例演示如何创建垂直 GridSplitter 区域,以便重新分配两 Grid 列之间的空间,而无需更改该列的尺寸 Grid

示例:

如何创建覆盖列边缘的 GridSplitter

若要在 Grid 中指定一个 GridSplitter 来调整相邻列的大小,请将附加属性 Column 设置为您要调整的列之一。 Grid如果有多个行,请将RowSpan附加属性设置为行数。 然后将HorizontalAlignment属性设置为LeftRight(您设置的对齐方式取决于要调整大小的两列)。 最后,将 VerticalAlignment 属性设置为 Stretch.

<GridSplitter Grid.Column="1" 
              Grid.RowSpan="3" 
              HorizontalAlignment="Left" 
              VerticalAlignment="Stretch"
              Background="Black" 
              ShowsPreview="true"
              Width="5"/>

没有其自己列的 GridSplitter 可能会被 Grid 中的其他控件遮挡。 有关如何防止此问题的详细信息,请参阅 确保 GridSplitter 可见

如何创建占用列的 GridSplitter

若要指定一个在Grid中占据列的GridSplitter,请将Column附加属性设置为您想调整大小的列之一。 如果网格有多个行,请将 RowSpan 附加属性设置为行数。 然后,将HorizontalAlignment设置为Center,将VerticalAlignment属性设置为Stretch,并将包含GridSplitter的列的Width设置为Auto

下面的示例演示了如何定义一个占用一列并调整其两侧列大小的垂直线 GridSplitter

<Grid.ColumnDefinitions>
  <ColumnDefinition/>
  <ColumnDefinition Width="Auto" />
  <ColumnDefinition/>
</Grid.ColumnDefinitions>
<GridSplitter Grid.Column="1"
              HorizontalAlignment="Center"
              VerticalAlignment="Stretch"
              Background="Black" 
              ShowsPreview="True"
              Width="5"
              />

另请参阅