Procedura: ridimensionare le colonne con un GridSplitter
In questo esempio viene illustrato come creare un oggetto GridSplitter verticale per ridistribuire lo spazio tra due colonne in un oggetto Grid senza modificare le dimensioni dell'oggetto Grid.
Esempio
Come creare un oggetto GridSplitter che si sovrapponga al bordo di una colonna
Per specificare un oggetto GridSplitter che ridimensiona colonne adiacenti in un oggetto Grid, impostare la proprietà connessa Column su una delle colonne da ridimensionare. Se l'oggetto Grid contiene più righe, impostare la proprietà associata RowSpan sul numero di righe. Impostare quindi la proprietà HorizontalAlignment su Left o su Right (l'allineamento impostato dipende dalle due colonne che si desidera ridimensionare). Impostare infine la proprietà VerticalAlignment su Stretch.
<GridSplitter Grid.Column="1"
Grid.RowSpan="3"
HorizontalAlignment="Left"
VerticalAlignment="Stretch"
Background="Black"
ShowsPreview="true"
Width="5"/>
Un oggetto GridSplitter che non ha una propria colonna può essere nascosto da altri controlli nell'oggetto Grid. Per ulteriori informazioni su come evitare questo problema, vedere Procedura: assicurarsi che GridSplitter sia visibile.
Come creare un oggetto GridSplitter che occupa una colonna
Per specificare un oggetto GridSplitter che occupa una colonna in un oggetto Grid, impostare la proprietà connessa Column su una delle colonne da ridimensionare. Se l'oggetto Grid contiene più righe, impostare la proprietà RowSpan associata sul numero di righe. Impostare quindi la proprietà HorizontalAlignment su Center, impostare la proprietà VerticalAlignment su Stretch e la proprietà Width della colonna che contiene l'oggetto GridSplitter su Auto.
Nell'esempio riportato di seguito viene illustrato come definire un oggetto GridSplitter verticale che occupa una colonna e ridimensiona le colonne ai lati.
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto" />
<ColumnDefinition/>
</Grid.ColumnDefinitions>
...
<GridSplitter Grid.Column="1"
HorizontalAlignment="Center"
VerticalAlignment="Stretch"
Background="Black"
ShowsPreview="True"
Width="5"
/>