d在上一次文章中,我们介绍了Canvas的布局。我们也知道,在Silverlight中有Canvas,StackPanel,Grid三种布局方式,今天我们就来详细地说一下StackPanel的布局。
Stack,栈!这个词我们大家再熟悉不过,一种先进后出的数据结构。我觉得用这个来比喻我们这种布局方式蛮形象。呵呵,稍后再说这个。
StackPanel其实像极了JAVA GUI中的FlowLayout,流布局。
我们来看个例子:
效果如下:
想起来FlowLayout了么?
我们看看默认的布局方式:
1. 默认情况下,是水平布局。像不像一个栈底在上的栈,我们把每个控件不停地压进去呢?
2. 默认情况下,是Stretch,也就是拉伸方式来填充我们的控件屏幕。
好,那我们如何改变。
先来看第一种情况,让我们将水平布局改成垂直布局。
效果如下:
看到啦!拉伸效果,垂直布局。
接下来,我们不允许按钮以拉伸方式来填充控件空间。很简单,我们来显式地设置控件的长和宽就OK了!看代码:
垂直布局情况下也是一样,只不过我们在水平布局的时候设置的是控件的Width属性,而当我们垂直布局的时候只需要设置控件的Height属性罢了!
接下来,我们看一个小技巧,在上文中,我们看到我们可以自己定制控件的长宽,使其避免以拉伸方式填充屏幕。但是我们这个时候发现,控件都是以居中方式布局。
好了,我们在上文中提出了两种默认的布局情况,在这里我们提出第三条:
3. 默认情况下,是居中布局。
同样,我们也是考虑如何修改,这里给出两种修改的方式:
1. 为每个控件提供自己独有的布局方式:
当然,我们还可以用我们熟悉的Margin属性来改变布局方式:
我们看到的并非我们想象中的代码,而是:
其实,他的Margin的距离是这样的:(我们在这里只限于讨论水平布局的情况):
Left – Right: 于居中布局的距离
Top:于顶部控件(如果是最顶部控件则是屏幕最上方)的距离
Buttom:于底部控件(如果是最底部控件则是屏幕最下方)的距离
恩!好了,说过的水平的布局,垂直的布局其实也是一样:
我们来看下代码:
所得到的效果如下:
好了,StackPanel的基本布局方式就说到这里,关于StackPanel的技巧型用法也像我上文中所说的Panel局部一样,不再赘述。
在这里,我谈下对StackPanel的看法。个人认为,在实际应用中,StackPanel的应用并不广泛,他没有Panel的灵活,也没有Grid的定制,因此相对属于一个鸡肋的布局控件。
好了,今天就说到这。