Devexpress之LayoutControl的使用及其控件布局设计

引言

Devexpress给我们提供了更加美观、更加丰富控件，但在学习和使用的同时经常会遇到诸多麻烦。今天在使用Devexpress的LayoutControl控件进行界面控件的布局设计时遇到了如下的麻烦：

1.添加控件后，不知道如何修改控件的尺寸

2.由1引起的不知道如何讲两个控件放在同一行

经过摸索解决了以上问题。首先看我的需求是通过LayoutControl控件设计图1所示的窗体：

图1

 

下面从该界面的设计过程，说明上面两个问题的解决办法：

1.向窗体中添加LayoutControl控件

在将该控件拖入窗体后，最好立即设置该控件的尺寸和位置，否则修改起来会比较麻烦（准确的说我还不知道怎么修改）。拖入后，在如图2所示的情况下，开始修改尺寸和位置（在这里设置的是填充整个窗体）

图2

 

2.向LayoutControl中添加控件

（1）添加GroupBox控件名为groupControl1，拖入后如图3所示，控件默认填充整个GroupControl，而且在界面中或者groupControl1的属性中是无法直接修改大小的。

图3

 

（2）隐藏控件的layoutControlItem(Text)。在向LayoutControl中添加控件后，会默认在其左侧添加一个layoutControlItem，隐藏该部分的方法是右键layoutControlItem，点击【Hide Text】，隐藏后如图4所示。

图4                 

 

（3）修改groupControl1的尺寸。

右键layoutControlGroup1(鼠标必须在该控件上右键)，在弹出的菜单中点击【CustomizeLayout】→【Layout Tree View】→【layoutControlItem1】，如图5，6所示。

（注意：在添加多个控件后会对应多个layoutControlItem*（*代表序号，1,2,3...），修改某一个控件时，必须找到其对应的layoutControlItem*进行属性的修改）

 

图5