Silverlight 4 - 布局了解

今天，熟悉下Silverlight布局。

  Silverlight提供了多种布局控件，但最常用的是：

  Canvas  StackPanel  Grid

  Canvas

你可以通过在Canvas中附加属性来定位元素，也就是绝对坐标来定位元素。每个子对象都呈现在 Canvas 区域中。通过指定 x(代表的是Canvas.Left) 和 y(代表的是Canvas.Top) 坐标，可以控制对象在 Canvas 中的定位。（注：由于绝对定位不考虑浏览器窗口的大小或浏览器大小调整，因此一般最好使用Grid 或 StackPanel 作为容器）

例子：

下面演示如何定位与Canvas的左侧和顶部各相距30像素的按钮。

代码块：

效果：

在这里还有个属性要注意一下：附加属性的Zindex，设置其值可使控件在另个控件上或下。

 

这可能有助于像是游戏开发或者高物理环境这样对计算非常精确的场合。

StackPanel

StackPanel支持用行或列进行布局（默认是垂直）。在特定情形下，例如，要将一组对象排列在竖直或水平列表（例如，项的水平或竖直菜单）中，StackPanel 很有用。

例子：

 

效果：

 

其中Margin属性，设置控件的外边距，在上面的代码中表示边长为30像素的正方形外边距为5像素。

Grid

Grid控件就像HTML中的Table，不同的是，Grid是先指定，后使用。通过<Grid.RowDeFinitions> 和 <Grid.ColumnDeFinitions>来定义Grid的行和列，使用Grid.Row和Grid.Column两个附加属性指定子元素在Grid中显示的位置，这是一种非常灵活的布局方式。

例子：

效果：

注意按钮上的附加属性（Grid.Column、Grid.Row）是如何告诉元素把自己定位在容器的哪个位置的。

布局的初步了解了，明天看下导航。距离又进了一步，

。