共用方式為

操作說明：使用 GridSplitter 調整資料列的大小

  • 發行項

這個範例顯示如何使用水平 GridSplitter，在不變更 Grid 維度的情況下轉散布 Grid 中兩個資料列之間的空間。

範例

如何建立重疊資料列邊緣的 GridSplitter

若要指定會調整 Grid 中相鄰資料列大小的 GridSplitter，請將 Row 附加屬性設定為您想調整大小的其中一個資料列。 如果您的 Grid 有多個資料行，請設定 ColumnSpan 附加屬性以指定資料行數目。 然後將 VerticalAlignment 設定為 Top 或 Bottom (所設定的對齊方式取決於您要調整大小的兩個資料列)。 最後，將 HorizontalAlignment 屬性設定為 Stretch。

下列範例示範如何定義會調整相鄰資料列大小的水平 GridSplitter。

<GridSplitter Grid.Row="1" 
              Grid.ColumnSpan="3" 
              HorizontalAlignment="Stretch" 
              VerticalAlignment="Top"
              Background="Black" 
              ShowsPreview="true"
              ResizeDirection="Rows"
              Height="5"/>

不佔用自己資料列的 GridSplitter，可能會被 Grid 中的其他控制項遮蔽。 如需有關如何防止此問題的詳細資訊，請參閱確保 GridSplitter 是可見的。

如何建立佔有資料列的 GridSplitter

若要指定會在 Grid 中佔據資料列的 GridSplitter，請將 Row 附加屬性設定為您想調整大小的其中一個資料列。 如果您的 Grid 有多個資料行，請將 ColumnSpan 附加屬性設定為資料行的數目。 然後將 VerticalAlignment 設定為 Center、將 HorizontalAlignment 屬性設定為 Stretch，並將包含 GridSplitter 資料列的 Height 設定為 Auto。

下列範例顯示如何定義會佔據一個資料列並調整其兩端資料列大小的水平 GridSplitter。

<Grid.RowDefinitions>
  <RowDefinition Height="50*" />
  <RowDefinition Height="Auto" />
  <RowDefinition Height="50*" />
</Grid.RowDefinitions>

<StackPanel Grid.Row="0" Grid.Column="1" Background="Tan"/>
<GridSplitter Grid.Row="1"
              HorizontalAlignment="Stretch"
              VerticalAlignment="Center"
              Background="Black" 
              ShowsPreview="True"
              Height="5"
           />
<StackPanel Grid.Row="2" Grid.Column="0" Background="Brown"/>

另請參閱