对于以前用Windows Form来开发客户端
![](/icons/56556chengxu.gif)
![](/icons/56556de.gif)
![](/icons/56556chengxu.gif)
员
![](/icons/56556dou.gif)
在使用WPF开发客户端
![](/icons/56556de.gif)
![](/icons/56556chengxu.gif)
时
![](/icons/56556dou.gif)
在窗体布局上将是他必须面对
![](/icons/56556de.gif)
![](/icons/56556yi.gif)
个坎
![](/icons/56556dou2.gif)
布局产生困惑
![](/icons/56556de.gif)
![](/icons/56556yi.gif)
个典型场景如下:
我们在开发WPF窗体时候
![](/icons/56556dou.gif)
我们会发现
![](/icons/56556dou.gif)
当我们把菜单Control控件(Menu)、工具条(ToolBar、ToolBarPanel)、状态条(StatusBar)这些最常见
![](/icons/56556de.gif)
页面元素拖动到WPF窗体
![](/icons/56556de.gif)
时候
![](/icons/56556dou2.gif)
我们会发现WPF窗体中
![](/icons/56556dou.gif)
这些页面元素可以放置在任何位置
![](/icons/56556dou.gif)
而不是的前Windows Form那样:主菜单在最上面
![](/icons/56556dou.gif)
状态条在最下面
![](/icons/56556dou2.gif)
WPF中每
![](/icons/56556yi.gif)
个元素如何布局变得更加灵活了
![](/icons/56556dou.gif)
这样可以让美工更好
![](/icons/56556de.gif)
设计出更漂亮
![](/icons/56556de.gif)
页面
![](/icons/56556dou.gif)
但是也会让
![](/icons/56556yi.gif)
些缺乏艺术细胞
![](/icons/56556de.gif)
技术人员页面布局变得巨难看无比
![](/icons/56556dou2.gif)
比如我最近在写个简单
![](/icons/56556de.gif)
调查系统客户端维护工具
![](/icons/56556dou.gif)
使用WPF
![](/icons/56556chengxu.gif)
来开发
![](/icons/56556dou.gif)
这个页面布局
![](/icons/56556de.gif)
事情
![](/icons/56556dou.gif)
就让我非常头大
![](/icons/56556dou2.gif)
WPF跟布局有关
![](/icons/56556de.gif)
Control控件很多
![](/icons/56556dou.gif)
![](/icons/56556System.gif)
.Windows.Controls.Panel是这些所有布局有关
![](/icons/56556de.gif)
类
![](/icons/56556de.gif)
基类
![](/icons/56556dou2.gif)
需要注意
![](/icons/56556de.gif)
是
![](/icons/56556dou.gif)
我们在页面布局上
![](/icons/56556yi.gif)
般都是使用这个类
![](/icons/56556de.gif)
扩展类来处理布局
![](/icons/56556dou.gif)
而不是使用这个类
![](/icons/56556dou2.gif)
这些扩展类包括:
![](/icons/56556System.gif)
.Windows.Controls.Canvas (画布)
![](/icons/56556System.gif)
.Windows.Controls.DockPanel (停靠布局)
![](/icons/56556System.gif)
.Windows.Controls.Grid (表格)
![](/icons/56556System.gif)
.Windows.Controls.StackPanel (堆栈布局)
![](/icons/56556System.gif)
.Windows.Controls.VirtualizingPanel (虚堆栈布局)
![](/icons/56556System.gif)
.Windows.Controls.WrapPanel (覆盖布局)
我自己在使用中觉得:对于我们从Window Form习惯来
![](/icons/56556de.gif)
技术人员
![](/icons/56556dou.gif)
使用Grid(表格)布局就可以满足我们绝大多数
![](/icons/56556de.gif)
布局需求
![](/icons/56556dou.gif)
而且简单
![](/icons/56556dou2.gif)
下面我们就来介绍如何使用Grid布局Control控件来进行窗体布局设计
![](/icons/56556dou2.gif)
Grid布局Control控件很类似HTML标签中
![](/icons/56556de.gif)
Table标签
![](/icons/56556dou2.gif)
我们事先把
![](/icons/56556yi.gif)
个区域划分成区别
![](/icons/56556de.gif)
表格
![](/icons/56556dou.gif)
然后决定
![](/icons/56556dou.gif)
某些Control控件放在那个表格中
![](/icons/56556dou.gif)
那些Control控件是要跨多少个表格来放置
![](/icons/56556dou2.gif)
比如下面窗体效果
![](/icons/56556dou.gif)
是由后面
![](/icons/56556de.gif)
XAML文件来实现这个效果
![](/icons/56556de.gif)
![](http://www.crazycoder.cn/WebFiles/20091/3bb887f1-b72e-4352-80e1-0f67c3ece8a3.jpg)
图2
此外
![](/icons/56556dou.gif)
我们还可以使用Grid.ColumnSpan、Grid.RowSpan来实现
![](/icons/56556yi.gif)
块布局跨多个表格项
![](/icons/56556de.gif)
情况
![](/icons/56556dou2.gif)
小结
我个人觉得
![](/icons/56556dou.gif)
把
![](/icons/56556yi.gif)
个窗体或者页面用表格拆分
![](/icons/56556dou.gif)
然后我们在每个表格项中增加我们规划好
![](/icons/56556de.gif)
Control控件
![](/icons/56556dou.gif)
这种布局方案在没有比较好
![](/icons/56556de.gif)
美术细胞下
![](/icons/56556dou.gif)
比较容易做出
![](/icons/56556yi.gif)
个至少不难看
![](/icons/56556de.gif)
页面布局
![](/icons/56556dou2.gif)
基于以上
![](/icons/56556de.gif)
考虑
![](/icons/56556dou.gif)
我觉得我们技术人员开发
![](/icons/56556yi.gif)
些WPF窗体或者页面
![](/icons/56556de.gif)
时候
![](/icons/56556dou.gif)
GridControl控件应该是我们最常用到
![](/icons/56556de.gif)
![](/icons/56556dou2.gif)
也应该是最应该掌握
![](/icons/56556de.gif)
Control控件