上一篇博客中大概的新建了一个应用，几乎是空白的。如果是初学者的话现在当然想往里面加点东西对不对。那么这篇博客就来看看页面的布局都是怎样的。
首先安装上一篇博客中的顺序来新建一个项目。新建好之后就点开MainPage.xaml开始敲代码啦。^_^
<Grid Background=”{ThemeResource ApplicationPageBackgroundThemeBrush}”><Grid.RowDefinitions><RowDefinition Height=”100″/><RowDefinition Height=”auto”/><RowDefinition Height=”*”/></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition Width=”4*”/><ColumnDefinition Width=”6*”/></Grid.ColumnDefinitions><StackPanel Grid.Row=”0″ Grid.ColumnSpan=”2″ Orientation=”Horizontal”><TextBlock Text=”页面布局” Foreground=”Red” FontSize=”40″ Margin=”12″Width=”200″ Height=”80″ /><TextBlock Text=”基本导航” Foreground=”Green” FontSize=”40″ Margin=”12″Width=”200″ Height=”80″ /></StackPanel><.Column=”0″><Button Content=”导航到第二页” Foreground=”Blue” FontSize=”35″Margin=”12,480,0,0″ Name=”btnGoSecondPage” Click=”btnGoSecondPage_Click”/></Grid><Canvas Grid.Row=”1″ Grid.Column=”1″ HorizontalAlignment=”Center” VerticalAlignment=”Center”><Rectangle Fill=”Blue”/><Rectangle Fill=”Yellow” Height=”100″ Width=”100″ Canvas.Left=”50″ Canvas.Top=”20″/><Rectangle Fill=”White” Height=”100″ Width=”100″ Canvas.Left=”70″ Canvas.Top=”90″/></Canvas></Grid>
下面就来依次介绍上面这段代码到底做了写什么啦： 1）首先将最外围的Grid控件分成了3行2列。其中第一行的高度是100像素；第二行的高度是自动的，所谓自动呢，就是会根据将来在其中添加的控件的所占的高度来决定的；第三行的高度就是剩余的啦，这么说可能不够清楚到底星号是什么意思。那再看看切成的这两列就好啦，它的宽度比就是4：6咯。很显然不一定是飞得比例加起来等于10什么的啦，4：100也是可以得哦。
2）在最外层的Grid内嵌套了一个StackPanel，并且将其定位在第一行，而且横跨2列。Grid最擅长的就是操作具体的像素，它可以将任何控件精确的定位到任何一点。而StackPanel最重要的Orientation属性则可以安排其内的控件的排列方式，比如这里就是让两个TextBlock控件按水平方向来排列啦。
3）在这里又嵌套了Grid，里面有一个Button，Foreground属性是定义字体颜色，FontSize属性是定义字体大小。下面重点来看看Margin属性。我们定义的Marin=”12,480,0,0”，从左至右依次是左、上、右和下四个方向距离外围边框的距离。
在设计器中已经标注了左边距是12，而上边距没有体现出来，但确实是480。还记得之前的那个auto么，在这里就体现出来了啦，因为下边距是0，所以Grid的分割线就刚好在Button下面啦。但为什么右边的分割线不刚好在Button的右边呢，这是因为我们之前的2列是按照4：6的比例来切的呀，而不是设置的auto。
4）Canvas位于其外围的Grid控件的正中央，HorizontalAligment和VerticalAlignment分别表示水平方向和垂直方向的摆放位置。Canvas.Top和Canvas.Left分别表示离Canvas最上边和最下边的距离。
5）给Button设置一个名字，然后敲下Click=”“之后，就会出现如下图所示的啦，这是直接按下Enter键就可以直接命名咯。小技巧啦。
然后双击Click事件的名字后，直接按F12键就会自动生成一个事件并且跳转到C#文件啦。下面这段代码就是会让页面从MainPage跳转到SecondPage咯。
(object sender, RoutedEventArgs e){if (this.Frame != null) {this.Frame.Navigate(typeof(SecondPage)); }}
写完这段代码也先别急着调试啦，因为还没有创建SecondPage呀。创建好之后最好再往里面加点东西哦，不然跳转过去了就是黑茫茫的一片还以为是出Bug了呢。比如我就是加了一个简单的TextBlock啦。
<TextBlock Text=”Second Page” FontSize=” 50″/>
我再来简单介绍一下VS中常用的一些东东啦，在下面的图中。方框1处可以让设计器和XAML代码的位置对换哦，截图里我就是将设计器放到了右边，，不过只是为了截图啦，设计器还是在左边比较习惯。
方框2处可以让设计器和XAML代码上下摆列和左右摆列也可以不显示它们中的某一个。旁边还可以设置网格对齐以及设计器的缩放比例。
方框3和方框4中可以设置的东西就太多啦，可以设置渐变色，也可以设置Click事件，还可以设置控件的布局等。
相信大家还都不够尽兴，不就是跳转个页面嘛，得来回传递点东西才好呢。
常用属性世上并没有用来鼓励工作努力的赏赐，
