Silverlight之布局

1.Grid：大多数情况下最灵活的布局，通过行与列来安排位置

<Grid ShowGridLines="True">

    <Grid.RowDefinitions>  <!--行-->

      <RowDefinition Height="60" />

      <RowDefinition Height="auto" />

      <RowDefinition Height="60" />

    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>  <!--列-->

      <ColumnDefinition Width="175" />

      <ColumnDefinition Width="175" />

      <ColumnDefinition Width="175" />

   </Grid.ColumnDefinitions>

 

  <Button Grid.Column="0" Grid.Row="0" Content="Button 1"/> <!--第一行第一列-->

   <Button Grid.Column="2" Grid.Row="0" Content="Button 2"/> <!--第一行第三列-->

   <Button Grid.Column="1" Grid.Row="2" Content="Button 3"/> <!--第三行第二列-->

  </Grid>

 

2.StackPanel：垂直或水平堆叠元素的布局控件(默认是垂直的)

 <StackPanel Orientation="Horizontal">  <!--Horizontal横向，Vertical纵向-->

     <Button Margin="10" Content="Button 1" FontSize="18" Width="150" Height="45" />

     <Button Margin="10" Content="Button 2" FontSize="18" Width="150" Height="45" />

     <Button Margin="10" Content="Button 3" FontSize="18" Width="150" Height="45" />

   </StackPanel>

 

3.Canvas：最基础的布局控件，被用于通过坐标绝对地定位元素

 <Canvas>

    <Button Canvas.Top="50" Canvas.Left="50" Content="Button 1"/>

    <Button Canvas.Top="150" Canvas.Left="20" Content="Button 2"/>

    <Button Canvas.Top="70" Canvas.Left="80" Canvas.ZIndex="99" Content="Button 3"/>

  </Canvas>