当前页面: 开发资料首页 → Eclipse 专题 → Eclipse界面编写实例(2)--理解布局2
Eclipse界面编写实例(2)--理解布局2
摘要: Eclipse界面编写实例(2)--理解布局2
第二节 标准布局
2.1. FillLayout
FillLayout是最简单的布局类，它把组件摆放在一行或者一列，并强制组件大小一致。一般的，组件的高度与最高组件一致，宽度与最宽组件一致。FillLayout不折行，不能设置边界距离和间距。可以使用它布局任务栏或工具栏，或者在Group中的一组选择框。当容器只有一个子组件时也可以使用它。例如如果一个Shell只有一个Group子组件，FillLayout将使Group完全充满Shell。
以下是相关代码。首先创建了一个FillLayout，然后设置它的type域值为SWT.VERTICAL，再把它设置到容器上（一个Shell）。示例的Shell有三个按钮，B1, B2, 和 Button 3。注意在FillLayout中，所有的子组件尺寸都相同，并且充满了全部可用的空间：
FillLayout fillLayout = new FillLayout();
fillLayout.type = SWT.VERTICAL;
shell.setLayout(fillLayout);
new Button(shell, SWT.PUSH).setText("B1");
new Button(shell, SWT.PUSH).setText("Wide Button 2");
new Button(shell, SWT.PUSH).setText("Button 3");
下图显示了水平和垂直布局时，以及在初始状态和调整大小之后，FillLayout的不同表现：
<table style="MARGIN-LEFT: -35.9pt; BORDER-COLLAPSE: collapse; mso-padding-alt: 0cm 0cm 0cm 0cm" cellSpacing=0 cellPadding=0 border=0> <tr> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 145.75pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=194> <?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />
初始状态
</td>
<td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 148.05pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=197>
调整大小后
</td></tr>
<tr>
<td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 145.75pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=194>
fillLayout.type = SWT.HORIZONTAL
(default)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 151.9pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=203><?xml:namespace prefix = v ns = "urn:schemas-microsoft-com:vml" />
fillLayout.type = SWT.VERTICAL
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 151.9pt; PADDING-TOP: 0cm; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent" vAlign=top width=203>2.2 RowLayout
RowLayout比FillLayout更常用，它可以提供折行显示，以及可设置的边界距离和间距。它有几个可设置的域。另外可以对每个组件通过setLayoutData方法设置RowData，来设置它们的大小。
2.2.1 RowLayout的可设置域
type （*2.0新添加*）
type域控制RowLayout是水平还是垂直布局组件。默认为水平布局。
wrap
wrap域控制RowLayout在当前行没有足够空间时是否折行显示组件。默认折行显示。
pack
pack域为true时，组件使用他们的原始尺寸，并且排列时尽量远离左边（and they will be aligned as far to the left as possible？）。如果pack域为false，组件将填充可用的空间，跟FillLayout类似。默认为true。
justify
justify域为true时，组件将在可用的空间内从左到右伸展。如果容器变大了，那么多余的空间被平均分配到组件上。如果pack和justify同时设为true，组件将保持它们的原始大小，多余的空间被平均分配到组件之间的空隙上。默认的false。
MarginLeft, MarginTop, MarginRight, MarginBottom 以及 Spacing
这些域控制组件之间距离（spacing，均以像素记），以及组件与容器之间的边距。默认的，RowLayout保留了3个像素的边距和间距。下图示意了边距和间距：
2.2.2 RowLayout 示例
下面的代码创建了一个RowLayout，并设置各个域为非默认值，然后把它设置到一个Shell：
RowLayout rowLayout = new RowLayout();
rowLayout.wrap = false;
rowLayout.pack = false;
rowLayout.justify = true;
rowLayout.type = SWT.VERTICAL;
rowLayout.marginLeft = 5;
rowLayout.marginTop = 5;
rowLayout.marginRight = 5;
rowLayout.marginBottom = 5;
rowLayout.spacing = 0;
shell.setLayout(rowLayout);
如果使用默认设置，只需要一行代码即可：
shell.setLayout(new RowLayout());
下图显示了设置不同域值的结果：
<table style="MARGIN-LEFT: 5.4pt; WIDTH: 481.85pt; BORDER-COLLAPSE: collapse; mso-padding-alt: 0cm 0cm 0cm 0cm" cellSpacing=0 cellPadding=0 width=642 border=0>
<tr> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 134.7pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=180>
初始状态
</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 167.65pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=224>调整尺寸后
</td></tr> <tr> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 134.7pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=180>wrap = true
pack = true
justify = false
type = SWT.HORIZONTAL
(默认)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 179.5pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=239>wrap = false
(没有足够空间时裁边)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 179.5pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=239>pack = false
(所有组件尺寸一致)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 179.5pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=239>justify = true
(组件根据可用空间进行伸展)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 179.5pt; PADDING-TOP: 0cm; BORDER-BOTTOM: windowtext 0.75pt solid; BACKGROUND-COLOR: transparent" vAlign=top width=239>type = SWT.VERTICAL
(组件垂直按列排列)
</td> <td style="BORDER-RIGHT: windowtext 0.75pt solid; PADDING-RIGHT: 5.4pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 5.4pt; PADDING-BOTTOM: 0cm; BORDER-LEFT: #d4d0c8; WIDTH: 179.5pt; PADDING-TOP: 0cm; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent" vAlign=top width=239>2.2.3 在RowLayout 上配合使用RowData
每个由RowLayout控制的组件可以通过RowData来设置其的原始的尺寸。以下代码演示了使用RowData改变一个Shell里的按钮的原始尺寸：
import org.eclipse.swt.*;
import org.eclipse.swt.widgets.*;
import org.eclipse.swt.layout.*;
public class RowDataExample {
public static void main(String[] args) {
Display display = new Display();
Shell shell = new Shell(display);
shell.setLayout(new RowLayout());
Button button1 = new Button(shell, SWT.PUSH);
button1.setText("Button 1");
button1.setLayoutData(new RowData(50, 40));
Button button2 = new Button(shell, SWT.PUSH);
button2.setText("Button 2");
button2.setLayoutData(new RowData(50, 30));
Button button3 = new Button(shell, SWT.PUSH);
button3.setText("Button 3");
button3.setLayoutData(new RowData(50, 20));
shell.pack();
shell.open();
while (!shell.isDisposed()) {
if (!display.readAndDispatch()) display.sleep();
}
}
}
以下是运行结果：
(待续)