Eclipse插件开发系列（５）：SWT中的布局管理器(2)

作者：陈刚，桂林人,97年毕业于广西师范大学数学系，暂于IBM中国研究中心从事软件开发(2004.2-?)，专注基于java平台的软件开发，我想写一本关于Ｅclipse插件开发的书，有书商原意出版吗？
MSN:　[email protected]
Email:  [email protected]
blog:　glchengang.yeah.net

这一节主讲GridLayout布局管理器

一、GridLayout的几个常用属性

１、GridLayout实例及numColumns 属性运用。

public class GridLayoutApp {
    public static void main(String[] args) {
        GridLayoutApp1 window = new GridLayoutApp1();
        window.open();
    }
    public void open() {
        Display display = new Display();
        Shell shell = new Shell();
        shell.setLayout(new FillLayout());
        shell.setText("SWT Application");
        //--------------核心代码如下:start------------------------
        {
            Composite composite = new Composite(shell, SWT.NONE);
            GridLayout gridLayout = new GridLayout(); //建立一个GridLayout布局管理器
            /*
             * 将这个布局管理器，设置水平２个格子（一个格了可以装一个控件），
             * 水平排完２个格后会自动转到下一行。注意：没有设置垂直分隔的参数
             */
            gridLayout.numColumns = 2;
            composite.setLayout(gridLayout); //将布局管理器应用于composite面板
            /*
             * 以上在composite面板上新建四个按钮,
             * 这些按钮会自动根据GridLayout的布局管理器来分布排列
             */
            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("1111111");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("2222222");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("3333333");
            }
        }
        //--------------核心代码如上:end------------------------
        shell.open();
        while (!shell.isDisposed()) {
            if (!display.readAndDispatch())
                display.sleep();
        }
    }
}

　　效果图如下，可以看到"按钮2222"将水平上的２格被占满后，"按钮3333"在第一行没有空格子可占，自动转到了下一行。

　　　500)this.width=500" border=0

　　numColumns =3时，效果图如下：

　　　500)this.width=500" border=0

 

２、horizontalSpacing属性。
　　　gridLayout.horizontalSpacing = 50　的效果图如下：可以看到水平两个控件的间距宽了很多，这中间的距离就是50像素（默认为5像素)

　　500)this.width=500" border=0

 

3、gridLayout.verticalSpacing 属性与horizontalSpacing类似，只是它是垂直间隔距离;

4、gridLayout.makeColumnsEqualWidth = true;效果图如下。这是设置水平等距的平分整个空间，这里可以看到"22222按钮"是从窗口的中分线开始分布的。此属性默认为false，也就是向左挤着排列，右边会空出很多空间。（这个属性我实践中感觉很少用到）

　　500)this.width=500" border=0

 

 

二、GridData类的使用

      光靠上面的gridLayout来进行整体的布局设置还是无法适应复杂的布局方式的，这时就需要控件自身来做一些调整来配合GridLayout的设置。GridLayout布局中的各个控件就是通过GridData类来改变自身在GridLayout中的更细致的布局。GridLayout与GridData相结合可以变化出很多复杂的布局方式。这里要注意GridData只用于GridLayout布局下的的控件，象FillLayout,RowLayout布局下的控件不能用这个类。

１、GridData.horizontalSpan 属性。指控件占据水平格子的数目。

        //--------------核心代码如下:start------------------------
        {
            Composite composite = new Composite(shell, SWT.NONE);
            GridLayout gridLayout = new GridLayout();
 　　　gridLayout.numColumns = 2;
            composite.setLayout(gridLayout);
　　　{
                Button button = new Button(composite, SWT.NONE);
                button.setText("1111111");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("2222222");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                GridData gridData = new GridData();

                //这里将Button上设置成抢占两个水平格的空间，效果图上可以看到按钮4444就只能跑到第三行去。
                gridData.horizontalSpan = 2;
                button.setLayoutData(gridData);
                button.setText("3333333");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("4444444");
            }
        }
        //--------------核心代码如下:end------------------------

　　效果图如下：　　　　　

　　500)this.width=500" border=0 　　

　　下面是在SWT Desiger软件中的显示图，可以很明显看到“33333按钮”占据的布局空间（红色框部份）。在这里要记住这样一个概念：控件拥有多少空间和它真正在显示上占了多少的空间是两回事。比如地主占有两亩地，但他就种一亩，另一亩自己不用，别人也不给用（这人脑子有病）。同理，在这里“33333按钮”占了两格，但他在默认的情况下只会占一格，要想让它在显示上也占两格请看继续看下面接着的内容。

　　500)this.width=500" border=0

 

２、new GridData(参数)中的参数运用

　　如下我们想让"3333按钮"充满整个红色框的空间怎么办，请看如下代码

                GridData gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL);
                gridData.horizontalSpan = 2;
                button.setLayoutData(gridData);
                button.setText("3333333");

　　GridData.HORIZONTAL_ALIGN_FILL是一个int常量，叫“水平对齐式充满”（从英文就可以看出它的意思了，这个中文名词是我自己杜撰的，不合适再改吧），效果图如下：

　　500)this.width=500" border=0

　　new GridData(参数)中还有很多其它参数，主要分为设置水平方向和设置垂直方向的两种类型，在这里我们主要讲水平方向，垂直方向的类似。

　　在上面的效果图中，可能有些人觉得还不爽，想将“3333按钮”充满整个窗口，如下图：

　　500)this.width=500" border=0

　　SWT Design软件中的设计图如下(大家对照看可以更容易理解）

　　500)this.width=500" border=0

代码则很简单：

GridData gridData = new GridData GridData.HORIZONTAL_ALIGN_FILL);
改为：

GridData gridData = new GridData(GridData.FILL_HORIZONTAL);

     FILL_HORIZONTAL叫“水平抢占式充满”，它会向饿狼一样将所有水平方向空闲的空间都收为已有。

　 有人说“3333按钮”充满整个窗口了，但2222、44444也应该齐头并进才好看。简单！只要将设置“3333按钮”的方法同样用到2222、4444身上就可以了：在2222、4444用“对齐式充满”(对齐3333)，而且4444的GridData.horizontalSpan 属性还要设为2，否则4444不会有变化。

代码如下：

            {
                Button button = new Button(composite, SWT.NONE);
                button.setText("1111111");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                button.setLayoutData(new GridData(GridData.HORIZONTAL_ALIGN_FILL));
                button.setText("2222222");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                GridData gridData = new GridData(GridData.FILL_HORIZONTAL);
                gridData.horizontalSpan = 2;
                button.setLayoutData(gridData);
                button.setText("3333333");
            }
            {
                Button button = new Button(composite, SWT.NONE);
                final GridData gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL);
                gridData.horizontalSpan = 2;
                button.setLayoutData(gridData);
                button.setText("4444444");
            }

效果图如下：

　　500)this.width=500" border=0

   　ＯＫ，最后我们让“3333按钮”来一个垂直方向的抢占式充满。“3333按钮”的代码如下，只要将new GridData()的参数设置成FILL_BOTH（两个方向都是抢占式充满）就行了

GridData gridData = new GridData(GridData.FILL_BOTH);

效果图如下，333变高了。

　　500)this.width=500" border=0

 

   上面的参数都是一个常量，这里给出两个常量合用的例子，用"|"符号隔开。效果图就免了自己试试吧。

GridData gridData = new GridData(GridData.FILL_HORIZONTAL | GridData.VERTICAL_ALIGN_FILL);
//表示水平抢占式充满，垂直对齐式充满。

本文地址：http://com.8s8s.com/it/it16378.htm