Partager via


Comment : redimensionner des colonnes avec un GridSplitter

Mise à jour : novembre 2007

Cet exemple montre comment créer un GridSplitter vertical pour redistribuer l'espace entre deux colonnes dans une Grid sans modifier les dimensions de la Grid.

Exemple

Comment créer un GridSplitter qui chevauche le bord d'une colonne

Pour spécifier un GridSplitter qui redimensionne les colonnes adjacentes dans une Grid, affectez à la propriété attachéeColumn l'une des colonnes que vous souhaitez redimensionner. Si votre Grid a plusieurs lignes, affectez à la propriété attachée RowSpan le nombre de lignes. Puis, affectez à la propriété HorizontalAlignment la valeur Left ou Right (l'alignement défini dépend des deux colonnes que vous souhaitez redimensionner). Enfin, affectez à la propriété VerticalAlignment la valeur Stretch.

L'exemple suivant montre comment définir un GridSplitter vertical qui redimensionne les colonnes adjacentes. Pour l'exemple complet, consultez GridSplitters redimensionnant les lignes et les colonnes, exemple.

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

Un GridSplitter qui n'a pas sa propre colonne peut être masqué par d'autres contrôles dans la Grid. Pour plus d'informations sur la manière d'éviter ce problème, consultez Comment : vérifier qu'un GridSplitter est visible.

Comment créer un GridSplitter qui occupe une colonne

Pour spécifier un GridSplitter qui occupe une colonne dans une Grid, affectez à la propriété attachéeColumn l'une des colonnes que vous souhaitez redimensionner. Si votre grille a plusieurs lignes, affectez à la propriété attachée RowSpan le nombre de lignes. Puis, affectez à HorizontalAlignment la valeur Center, affectez à la propriété VerticalAlignment la valeur Stretch, et affectez à la Width de la colonne qui contient le GridSplitter la valeur Auto.

L'exemple suivant montre comment définir un GridSplitter vertical qui occupe une colonne et redimensionne les colonnes de chaque côté. Pour l'exemple complet, consultez GridSplitters redimensionnant les lignes et les colonnes, exemple.

<Grid.ColumnDefinitions>
  <ColumnDefinition/>
  <ColumnDefinition Width="Auto" />
  <ColumnDefinition/>
</Grid.ColumnDefinitions>


...


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

Voir aussi

Référence

GridSplitter

Autres ressources

Exemples de GridSplitter

Rubriques Comment relatives à GridSplitter