HOW TO：使用 GridSplitter 建立使用者可調整大小的應用程式
您可以使用 GridSplitter 控制項結合 Grid 容器控制項，建立可由使用者在執行階段重新調整大小的視窗配置。 例如，在將 UI 分成幾個區域的應用程式中，使用者可以視想要看到哪些區域的詳細內容，而拖曳分隔器將區域放大。
當您將 GridSplitter 控制項加入至 Grid 時，它就是方格控制項的子系，而且必須放置在資料列和資料行中，和任何其他子控制項一樣。 GridSplitter 的寬度和高度必須為非零，使用者才能在執行階段抓取並拖曳它。
GridSplitter 的最佳做法包括：
將 GridSplitter 放在不含任何其他控制項的專用資料列或資料行中。
將內含 GridSplitter 之資料列的高度或資料行的寬度設定為 Auto。
將單一的 Grid 專用於 GridSplitter。 將其他容器面板加入至 Grid 以完成配置。
若要建立垂直 GridSplitter
在 [設計] 檢視中，選取 Grid。 如需詳細資訊，請參閱 HOW TO：在設計介面上選取並移動項目。
在您希望顯示 GridSplitter 的位置，加入資料行。 如需詳細資訊，請參閱 HOW TO：在方格中加入資料列和資料行。
注意
在某些情況下，可能很難在設計工具中放置資料列和資料行。這種時候，您可以使用 XAML 編輯器設定 Grid。如需範例 XAML 標記，請參閱本主題結尾的範例區段。
從 [工具箱] 中，將 GridSplitter 控制項拖曳至加入的資料行中。
在 [屬性] 視窗中，為 GridSplitter 設定下列屬性：
屬性
值
可能的值
ResizeBehavior
BasedOnAlignment
BasedOnAlignment
CurrentAndNext
PreviousAndCurrent
PreviousAndNext
ResizeDirection
Columns
Auto
資料行
Rows
Grid.Column
您要放置 GridSplitter 的資料行 (資料行編號是以零起始的)。
Grid.ColumnSpan
1
Grid.Row
0
Grid.RowSpan
Grid 中的資料列總數。
Width
非零的數字， 例如 10。
Height
Auto
HorizontalAlignment
Stretch
Left
Center
Right
Stretch
VerticalAlignment
Stretch
Top
Center
Bottom
Stretch
Margin
0
在 [設計] 檢視中，選取 Grid。
將內含 GridSplitter 之 ColumnDefinition 的 [Width] 設定為 [Auto]。
若要建立水平 GridSplitter
在 [設計] 檢視中，選取 Grid。 如需詳細資訊，請參閱 HOW TO：在設計介面上選取並移動項目。
在您希望顯示 GridSplitter 的位置，加入資料列。 如需詳細資訊，請參閱 HOW TO：在方格中加入資料列和資料行。
注意
在某些情況下，可能很難在設計工具中放置資料列和資料行。這種時候，您可以使用 XAML 編輯器設定 Grid。如需範例 XAML 標記，請參閱本主題結尾的範例區段。
從 [工具箱] 中，將 GridSplitter 控制項拖曳至加入的資料列中。
在 [屬性] 視窗中，為 GridSplitter 設定下列屬性：
屬性
值
可能的值
ResizeBehavior
BasedOnAlignment
BasedOnAlignment
CurrentAndNext
PreviousAndCurrent
PreviousAndNext
ResizeDirection
Rows
Auto
資料行
Rows
Grid.Column
0
Grid.ColumnSpan
Grid 中的資料行總數。
Grid.Row
您要放置 GridSplitter 的資料列 (資料列編號是以零起始的)。
Grid.RowSpan
1
Width
Auto
Height
非零的數字， 例如 10。
HorizontalAlignment
Stretch
Left
Center
Right
Stretch
VerticalAlignment
Stretch
Top
Center
Bottom
Stretch
Margin
0
在 [設計] 檢視中，選取 Grid。
將內含 GridSplitter 之 RowDefinition 的 [Height] 設定為 [Auto]。
範例
下列 XAML 會建立一個水平 GridSplitter：
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
<RowDefinition MinHeight="70" />
</Grid.RowDefinitions>
<DockPanel Grid.Row="0" Grid.RowSpan="1" HorizontalAlignment="Stretch" Margin="0" Background="LightBlue" Name="DockPanel1">
</DockPanel>
<GridSplitter Grid.Row="1" Grid.RowSpan="1" ResizeDirection="Rows" Width="Auto" Height="10" HorizontalAlignment="Stretch" Margin="0" Name="GridSplitter1" />
<Grid Grid.Row="2" HorizontalAlignment="Stretch" Margin="0" Background="PaleGoldenrod" Name="Grid1">
</Grid>
</Grid>