(X) Hide this
    • Login
    • Join
      • Generate New Image
        By clicking 'Register' you accept the terms of use .
        Login with Facebook

Tip: How to define the count of rows and columns in a Grid control?

(0 votes)
Denislav Savkov
>
Denislav Savkov
Joined Feb 11, 2008
Articles:   14
Comments:   6
More Articles
0 comments   /   posted on Sep 04, 2008
Tags:   grid , denislav-savkov
Categories:   Controls

The System.Windows.Controls.Grid control is one of the most commonly used containers in Silverlight. It allows you to organize its content into rows and columns as a regular grid. By default a Grid control has only one cell and everything you add goes there overlapping the previous content. In order to define multiple rows and columns to your Grid control you have to add as many <RowDefinition> and <ColumnDefinition> as you need, see the sample below.

Xaml

<Page
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <Grid x:Name="MyGrid" ShowGridLines="True">
     <Grid.RowDefinitions>
       <RowDefinition></RowDefinition>
       <RowDefinition></RowDefinition>
       <RowDefinition></RowDefinition>
     </Grid.RowDefinitions>
     <Grid.ColumnDefinitions>
       <ColumnDefinition></ColumnDefinition>
       <ColumnDefinition></ColumnDefinition>
       <ColumnDefinition></ColumnDefinition>
     </Grid.ColumnDefinitions>
   </Grid>
</Page>

C#

Grid MyGrid = new Grid();
 
RowDefinition row1 = new RowDefinition();
RowDefinition row2 = new RowDefinition();
RowDefinition row3 = new RowDefinition();
MyGrid.RowDefinitions.Add( row1 );
MyGrid.RowDefinitions.Add( row2 );
MyGrid.RowDefinitions.Add( row3 );
ColumnDefinition col1 = new ColumnDefinition();
ColumnDefinition col2 = new ColumnDefinition();
ColumnDefinition col3 = new ColumnDefinition();
MyGrid.ColumnDefinitions.Add( col1 );
MyGrid.ColumnDefinitions.Add( col2 );
MyGrid.ColumnDefinitions.Add( col3 );

As you can see we have added 3 rows and 3 columns definitions in our Grid control. So finally what we get is a grid with 9 cells ordered 3x3.

That's it!

 


Subscribe

Comments

No comments

Add Comment

Login to comment:
  *      *       
Login with Facebook