Partager via


Comment : redimensionner des lignes avec un GridSplitter

Mise à jour : novembre 2007

Cet exemple montre comment utiliser un GridSplitter horizontal pour redistribuer l'espace entre deux lignes dans une Grid sans modifier les dimensions de la Grid.

Exemple

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

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

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

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

Un GridSplitter qui n'occupe pas sa propre ligne 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 ligne

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

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

<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"/>

Voir aussi

Référence

GridSplitter

Autres ressources

Exemples de GridSplitter

Rubriques Comment relatives à GridSplitter