http://msdn.microsoft.com/zh-cn/library/system.windows.controls.grid(v=vs.95).aspx

 Grid控件：

 支持网格布局的控件，可定义网格的行数和列数，可根据屏幕尺寸自动缩放。

 Grid.Row   : 表示第几行，数值从0开始。获取或设置一个值，该值指示 Grid 中的子内容应出  现在哪个行内。

 Grid.Column: 表示第几列，数值从0开始。获取或设置一个值，该值指示 Grid 中的子内容应出  现在哪列中。

 Grid.RowSpan：获取或设置一个值，该值指示 Grid 中的子内容所跨越的总行数。

 Grid.ColumnSpan：获取或设置一个值，该值指示 Grid 中的子内容所跨越的总列数。

 完全按照附加属性Grid.Row,Grid.Column，Grid.RowSpan,Grid.ColumnSpan来决定其大小和位  置。

 通过使用 Grid.Column 和 Grid.Row 附加属性，在 Grid 的特定单元格中定位对象。

 列和行可以利用 Star 缩放来按比例分配剩余空间。当选择 Star 作为行或列的高度或宽度时，  该行或列将得到一个剩余可用空间的加权比例分配。Star 大小调整是默认行为。

 示例一：

  1. <Grid x:Name="LayoutRoot" Background="Transparent"> 
  2.         <Grid.RowDefinitions> 
  3.             <RowDefinition Height="80"></RowDefinition> 
  4.             <RowDefinition Height="80"></RowDefinition> 
  5.             <RowDefinition Height="120"></RowDefinition> 
  6.             <RowDefinition Height="90"></RowDefinition> 
  7.         </Grid.RowDefinitions> 
  8.         <Grid.ColumnDefinitions> 
  9.             <ColumnDefinition Width="150"></ColumnDefinition> 
  10.             <ColumnDefinition></ColumnDefinition> 
  11.         </Grid.ColumnDefinitions> 
  12.         <TextBlock Name="textBlock1" Text="UserName:" HorizontalAlignment="Center" VerticalAlignment="Center"  ></TextBlock> 
  13.         <TextBlock Name="textBlock2" Text="PassWord:" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center"  ></TextBlock> 
  14.         <TextBlock Name="textBlock3" Text="Country:" Grid.Row="2" HorizontalAlignment="Center" VerticalAlignment="Center" ></TextBlock> 
  15.          
  16.         <TextBox Name="textBox1" Grid.Column="1"  Width="200"></TextBox> 
  17.         <TextBox Name="textBox2" Grid.Column="2"  Grid.Row="1" Width="200"></TextBox> 
  18.         <ListBox  Grid.Column="1" Grid.Row="2"> 
  19.             <ListBoxItem>中国</ListBoxItem> 
  20.             <ListBoxItem>美国</ListBoxItem> 
  21.             <ListBoxItem>英国</ListBoxItem> 
  22.         </ListBox> 
  23.          
  24.         <Button Content="登录" Grid.Row="3" Grid.ColumnSpan="2" HorizontalAlignment="Center" Width="150" Height="71"></Button> 
  25.     </Grid> 

 效果是：

 容器控件Grid _容器控件Grid

 示例二：通过C#代码添加控件：

 XAML代码：

  1. <!--LayoutRoot 是包含所有页面内容的根网格--> 
  2.     <Grid x:Name="LayoutRoot" Background="Transparent"> 
  3.         <Grid.RowDefinitions> 
  4.             <RowDefinition Height="90"/> 
  5.             <RowDefinition Height="90"/> 
  6.             <RowDefinition Height="160"/> 
  7.             <RowDefinition Height="120"/> 
  8.         </Grid.RowDefinitions> 
  9.         <Grid.ColumnDefinitions> 
  10.             <ColumnDefinition Width="150"></ColumnDefinition> 
  11.             <ColumnDefinition></ColumnDefinition> 
  12.         </Grid.ColumnDefinitions>     
  13.  

  1.     </Grid> 

 

 C#代码：

  1. private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e) 
  2.         { 
  3.             TextBlock textBlock1 = new TextBlock(); 
  4.             textBlock1.Text = "UserName"; 
  5.             textBlock1.HorizontalAlignment = System.Windows.HorizontalAlignment.Center; 
  6.             textBlock1.VerticalAlignment = System.Windows.VerticalAlignment.Center; 
  7.             LayoutRoot.Children.Add(textBlock1); 
  8.  
  9.             TextBlock textBlock2 = new TextBlock(); 
  10.             textBlock2.Text = "PassWord"; 
  11.             textBlock2.HorizontalAlignment = System.Windows.HorizontalAlignment.Center; 
  12.             textBlock2.VerticalAlignment = System.Windows.VerticalAlignment.Center; 
  13.             Grid.SetRow(textBlock2,1); 
  14.             LayoutRoot.Children.Add(textBlock2); 
  15.  
  16.             TextBlock textBlock3 = new TextBlock(); 
  17.             textBlock3.Text = "Country"; 
  18.             textBlock3.VerticalAlignment = System.Windows.VerticalAlignment.Center; 
  19.             textBlock3.HorizontalAlignment = System.Windows.HorizontalAlignment.Center; 
  20.             Grid.SetRow(textBlock3,2); 
  21.             LayoutRoot.Children.Add(textBlock3); 
  22.  
  23.             TextBox textBox1 = new TextBox(); 
  24.             Grid.SetColumn(textBox1,1); 
  25.             textBox1.Width = 200; 
  26.             textBox1.Height = 80; 
  27.             LayoutRoot.Children.Add(textBox1); 
  28.  
  29.             TextBox textBox2 = new TextBox(); 
  30.             textBox2.Width = 200; 
  31.             textBox2.Height = 80; 
  32.             Grid.SetColumn(textBox2,1); 
  33.             Grid.SetRow(textBox2,1); 
  34.             LayoutRoot.Children.Add(textBox2); 
  35.  
  36.  
  37.             ListBox listBox1 = new ListBox(); 
  38.             listBox1.HorizontalAlignment = System.Windows.HorizontalAlignment.Center; 
  39.             listBox1.VerticalAlignment = System.Windows.VerticalAlignment.Center; 
  40.             listBox1.Items.Add("北京"); 
  41.             listBox1.Items.Add("上海"); 
  42.             listBox1.Items.Add("杭州"); 
  43.             Grid.SetRow(listBox1,2); 
  44.             Grid.SetColumn(listBox1,1); 
  45.             LayoutRoot.Children.Add(listBox1); 
  46.  
  47.             Button button1 = new Button(); 
  48.             button1.Content = "登录"; 
  49.             button1.Width = 100; 
  50.             button1.Height = 71; 
  51.             Grid.SetRow(button1,3); 
  52.             Grid.SetColumn(button1,1); 
  53.             LayoutRoot.Children.Add(button1); 
  54.   
  55.         } 

效果图是：

容器控件Grid _容器控件Grid_02

  示例三：

  1. <!--LayoutRoot contains the root grid where all other page content is placed--> 
  2.    <Grid x:Name="LayoutRoot" Background="Transparent"> 
  3.        <Grid.RowDefinitions> 
  4.            <RowDefinition Height="Auto"/> 
  5.            <RowDefinition Height="*"/> 
  6.        </Grid.RowDefinitions> 
  7.  
  8.        <!--TitlePanel contains the name of the application and page title--> 
  9.        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
  10.            <TextBlock x:Name="ApplicationTitle" Text="SIMPLE GRID" Style="{StaticResource PhoneTextNormalStyle}"/> 
  11.            <TextBlock x:Name="PageTitle" Text="main page" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> 
  12.        </StackPanel> 
  13.  
  14.        <!--ContentPanel - place additional content here--> 
  15.        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 
  16.            <Grid.RowDefinitions> 
  17.                <RowDefinition Height="Auto" /> 
  18.                <RowDefinition Height="*" /> 
  19.                <RowDefinition Height="Auto" /> 
  20.            </Grid.RowDefinitions> 
  21.            <Grid.ColumnDefinitions> 
  22.                <ColumnDefinition Width="2*" /> 
  23.                <ColumnDefinition Width="*" /> 
  24.            </Grid.ColumnDefinitions> 
  25.            <TextBlock Grid.Row="0" 
  26.                       Grid.Column="0" 
  27.                       Grid.ColumnSpan="2" 
  28.                       Text="Heading at top of Grid" 
  29.                       HorizontalAlignment="Center" /> 
  30.            <Image Grid.Row="1" 
  31.                   Grid.Column="0" 
  32.                   Source="/PhoneApp2;component/Images/1-12101Q43P9.jpg" /> 
  33.            <Ellipse Grid.Row="1" 
  34.                     Grid.Column="1" 
  35.                     Stroke="{StaticResource PhoneAccentBrush}" 
  36.                     StrokeThickness="6" /> 
  37.            <TextBlock Grid.Row="2" 
  38.                       Grid.Column="0" 
  39.                       Grid.ColumnSpan="2" 
  40.                       Text="Footer at bottom of Grid" 
  41.                       HorizontalAlignment="Center" /> 
  42.        </Grid> 
  43.    </Grid> 

 结果图：

 容器控件Grid _容器控件Grid_03