Comment : ajouter des lignes et des colonnes à une grille

Article
08/10/2011

Le contrôle Grid de Windows Presentation Foundation (WPF) vous permet de positionner et d'aligner rapidement et facilement des contrôles en créant des dispositions basées sur une grille. Au moment du design, vous pouvez ajouter des lignes et des colonnes à un contrôle Grid dans Concepteur WPF. Par défaut, les nouvelles lignes et colonnes utilisent le dimensionnement Star.

Important

Si vous affectez à la taille d'une ligne ou d'une colonne la valeur Auto avant d'y ajouter du contenu, vous ne pourrez pas le voir dans le concepteur. Cela peut alors être difficile de positionner des contrôles dans la bonne ligne ou colonne. Pour éviter ceci, vous pouvez utiliser le redimensionnement star lorsque vous travaillez, puis passer à Auto lorsque vous avez fini.

Cette rubrique traite de trois façons d'ajouter des lignes et des colonnes à un Grid. Vous pouvez également supprimer des lignes et des colonnes d'une grille. Pour plus d'informations, consultez Comment : supprimer des lignes et des colonnes d'une grille.

Utilisation du concepteur

Dans le Concepteur WPF, lorsque vous sélectionnez un contrôle Grid, des rails apparaissent sur les haut et côtés gauche. Vous pouvez utiliser les rails pour ajouter directement des lignes et des colonnes au Grid. Le mode XAML est automatiquement mis à jour avec les nouvelles lignes et colonnes.

Notes

Si la propriété FlowDirection a la valeur RightToLeft, le rail des lignes apparaît du côté droit du Grid.

Pour ajouter des lignes à une grille en utilisant le concepteur

Dans Concepteur WPF, sélectionnez un contrôle Grid.
Déplacez le pointeur sur le bord externe du rail latéral. Le pointeur prend la forme d'une croix et un quadrillage apparaît pour indiquer l'endroit où la ligne sera ajoutée.
Cliquez sur le rail pour définir la ligne.

Le quadrillage est fixe et un indicateur de quadrillage apparaît dans le rail à l'extrémité du quadrillage.

Conseil

Vous pouvez ajuster la taille de la ligne en faisant glisser le quadrillage à l'intérieur de la grille ou l'indicateur de quadrillage dans le rail.
(Facultatif) Répétez les étapes 2 et 3 pour ajouter plus de lignes.

Pour ajouter des colonnes à une grille en utilisant le concepteur

Dans le Concepteur WPF, sélectionnez un contrôle Grid.
Déplacez le pointeur sur le bord supérieur du rail supérieur. Le pointeur prend la forme d'une croix et un quadrillage apparaît pour indiquer l'endroit où la colonne sera ajoutée.
Cliquez sur le rail pour définir la colonne.

Le quadrillage est fixe et un indicateur de quadrillage apparaît dans le rail à l'extrémité du quadrillage.

Conseil

Vous pouvez ajuster la taille de la colonne en faisant glisser le quadrillage à l'intérieur de la grille ou l'indicateur de quadrillage dans le rail.
(Facultatif) Répétez les étapes 2 et 3 pour ajouter plus de colonnes.

Utilisation de l'éditeur de collections

Vous pouvez également ajouter des lignes et des colonnes à un Grid en utilisant l'éditeur de collections. Lorsque vous utilisez l'éditeur de collections pour configurer des lignes et des colonnes, le mode Design et le mode XAML sont automatiquement mis à jour.

Pour ajouter des lignes à une grille en utilisant l'éditeur de collections

Dans le Concepteur WPF, sélectionnez un contrôle Grid.
Dans la fenêtre Propriétés, recherchez la propriété RowDefinitions et cliquez sur le bouton de sélection dans la colonne Valeur de la propriété.

La boîte de dialogue Éditeur de collections s'affiche.
Cliquez sur Ajouter pour ajouter une nouvelle ligne.
(Facultatif) Définissez les propriétés de la ligne.
(Facultatif) Répétez les étapes 3 et 4 pour ajouter plus de lignes.
Cliquez sur OK pour fermer l'éditeur de collections et retourner au Concepteur WPF.

Pour ajouter des colonnes à une grille en utilisant l'éditeur de collections

Dans le Concepteur WPF, sélectionnez un contrôle Grid.
Dans la fenêtre Propriétés, recherchez la propriété ColumnDefinitions et cliquez sur le bouton de sélection dans la colonne Valeur de la propriété.

La boîte de dialogue Éditeur de collections s'affiche.
Cliquez sur Ajouter pour ajouter une nouvelle colonne.
(Facultatif) Définissez les propriétés de la colonne.
(Facultatif) Répétez les étapes 3 et 4 pour ajouter plus de colonnes.
Cliquez sur OK pour fermer l'éditeur de collections et retourner au Concepteur WPF.

Utilisation de l'éditeur XAML

Vous pouvez également ajouter manuellement des lignes et des colonnes à un Grid en utilisant l'éditeur XAML. Le mode Design est automatiquement mis à jour avec les nouvelles lignes et colonnes.

Pour ajouter des lignes à une grille en utilisant l'éditeur XAML

Dans l'éditeur XAML repérez un élément Grid.
Ajoutez un élément Grid.RowDefinitions en tant qu'enfant de l'élément Grid. Ce code doit se présenter comme suit :
```
<Grid>
    <Grid.RowDefinitions>
    </Grid.RowDefinitions>
</Grid>
```

Ajoutez des éléments RowDefinition. Le code suivant illustre un exemple :

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

Pour ajouter des colonnes à une grille en utilisant l'éditeur XAML

Dans l'éditeur XAML, repérez un élément Grid.
Ajoutez un élément Grid.ColumnDefinitions en tant qu'enfant de l'élément Grid. Ce code doit se présenter comme suit :
```
<Grid>
    <Grid.ColumnDefinitions>
    </Grid.ColumnDefinitions>
</Grid>
```

Ajoutez des éléments ColumnDefinition. Le code suivant illustre un exemple :

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="100" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="5*" />
</Grid.ColumnDefinitions>

Voir aussi

Partager via