win8学习之 布局

win8中有三种布局：Canvas布局，stackPanel布局，Grid布局

一、 Canvas布局

    这个布局就相当于绝对定位，因为是绝对的，所以可想而知，这个不重要。

    用法：

      <Canvas>

           <Button content="按钮1" Canvas.Left="10" Canvas.Top="10"/>

      </Canvas>

二、StackPanel布局

   这个布局挺重要的，并且这个布局可以嵌套

   它默认把它包含的内容按垂直向下排列 也可以通过Orientation属性来改他的排列方向

用法：

      <StackPanel Orientation="Vertical">
            <StackPanel Orientation="Horizontal">
                <Button Content="哈哈"></Button>
                <Button Content="嘿嘿"></Button>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button Content="呵呵"></Button>
                <Button Content="嘎嘎"></Button>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button Content="嘎嘎"></Button>
                <Button Content="嘿嘿"></Button>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button Content="呵呵"></Button>
                <Button Content="哈哈"></Button>
            </StackPanel>
        </StackPanel>

效果如下：

 

 三、Grid布局

   这个布局就相当于表格，鉴于c#就可以知道他也挺重要的

   用法：

       <Grid Name="grid1">
            <Grid.RowDefinitions>
                <RowDefinition Height="111"/>
                <RowDefinition Height="111"/>
                <RowDefinition Height="111"/>
                <RowDefinition Height="111"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="111"/>
                <ColumnDefinition Width="111"/>
                <ColumnDefinition Width="111"/>
                <ColumnDefinition Width="111"/>
            </Grid.ColumnDefinitions>
            <TextBlock Text="哈哈" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Left" Width="111"></TextBlock>
        </Grid>

   效果如下：