Como: adicionar linhas e colunas para uma grade

Artigo
08/01/2011

The Windows Presentation Foundation (WPF) Grid control enables you to quickly and easily position and align controls by creating grid-based layouts. Em tempo de design, você pode adicionar linhas e colunas para um Grid de controle no WPF Designer. Por padrão, novas linhas e colunas, use Star dimensionamento.

Importante
If you set the size of a row or column to Auto before you add content to it, you cannot see it in the designer. This can make it hard to position controls in the correct row or column. To avoid this, you can use star sizing while you work, and change to Auto when you are done.

This topic discusses three ways that you can add rows and columns to a Grid. You can also remove rows and columns from a grid. For more information, see Como: Remover Linhas e Colunas de uma Grade.

Using the Designer

In the WPF Designer, when you select a Grid control, rails appear on the top and left sides. You can use the rails to add rows and columns directly on to the Grid. ExibiçãoXAML é atualizada automaticamente com as novas linhas e colunas.

Observação
If the FlowDirection property is set to RightToLeft, the rail for the rows appears on the right side of the Grid.

To add rows to a grid by using the designer

No WPF Designer, selecione um Grid de controle.
Move the pointer over the outer edge of the side rail. The pointer changes to cross hairs and a gridline appears indicating where the row will be added.
Click the rail to set the row.

The gridline is fixed in place and a gridline indicator appears in the rail at the end of the gridline.

Dica

You can adjust the size of the row by dragging the gridline inside the grid or the gridline indicator in the rail.
(Optional) Repeat steps 2 and 3 to add more rows.

To add columns to a grid by using the designer

In the WPF Designer, select a Grid control.
Move the pointer over the top edge of the top rail. The pointer changes to cross hairs and a gridline appears indicating where the column will be added.
Click the rail to set the column.

The gridline is fixed in place and a gridline indicator appears in the rail at the end of the gridline.

Dica

You can adjust the size of the column by dragging the gridline inside the grid or the gridline indicator in the rail.
(Optional) Repeat steps 2 and 3 to add more columns.

Using the Collection Editor

You can also add rows and columns to a Grid by using the collection editor. When you use the collection editor to configure rows and columns, Design view and XAML view are updated automatically.

To add rows to a grid by using the collection editor

In the WPF Designer, select a Grid control.
In the Properties window, locate the RowDefinitions property, and click the ellipsis button in the property value column.

The Collection Editor dialog box appears.
Click Add to add a new row.
(Optional) Set the properties of the row.
(Optional) Repeat steps 3 and 4 to add more rows.
Click OK to close the Collection Editor and return to the WPF Designer.

To add columns to a grid by using the collection editor

In the WPF Designer, select a Grid control.
In the Properties window, locate the ColumnDefinitions property, and click the ellipsis button in the property value column.

The Collection Editor dialog box appears.
Click Add to add a new column.
(Optional) Set the properties of the column.
(Optional) Repeat steps 3 and 4 to add more columns.
Click OK to close the Collection Editor and return to the WPF Designer.

Using the XAML Editor

You can also add rows and columns to a Grid manually by typing in the XAML editor. Design view is automatically updated with the new rows and columns.

To add rows to a grid by using the XAML editor

In the XAML editor, locate a Grid element.
Add a Grid.RowDefinitions element as a child of the Grid element. The code should look like the following:
```
<Grid>
    <Grid.RowDefinitions>
    </Grid.RowDefinitions>
</Grid>
```

Add RowDefinition elements. The following markup shows an example:

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

To add columns to a grid by using the XAML editor

In the XAML editor, locate a Grid element.
Add a Grid.ColumnDefinitions element as a child of the Grid element. The code should look like the following:
```
<Grid>
    <Grid.ColumnDefinitions>
    </Grid.ColumnDefinitions>
</Grid>
```

Add ColumnDefinition elements. The following markup shows an example:

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

Consulte também

Partilhar via