您现在的位置：程式碼之家 >> 編程語言 > >> Java 程式設計 >> Java 相關知識

SWT/JFace 佈局管理全攻略：五大 Layout 深度解析與實戰

編輯：Java 相關知識

在視覺化編程盛行的今天，多數 GUI 開發工具都提供了拖拉式的控件排版功能。然而對於 Java 開發者而言，成熟穩定的視覺化工具較少，許多時候仍需手寫代碼來控制界面佈局。SWT（Standard Widget Toolkit）作為 Eclipse 的圖形庫，提供了強大的佈局管理機制，讓開發者能精確控制控件位置與大小。本文將系統講解 SWT 中五種核心佈局——FillLayout、RowLayout、GridLayout、FormLayout 與 StackLayout——的特性、用法與實戰技巧。

一、FillLayout：最簡單的線性佈局

FillLayout 是最基礎的佈局，它將所有子控件沿水平或垂直方向依次排列，並強制每個控件擁有相同的寬度或高度。適用於工具欄、按鈕組等簡單場景。

基本用法

FillLayout layout = new FillLayout(); // 預設水平
shell.setLayout(layout);

若需垂直排列，可指定類型：

FillLayout layout = new FillLayout(SWT.VERTICAL);
shell.setLayout(layout);

或直接在構造函數傳入：new FillLayout(SWT.VERTICAL)。

效果展示

圖 1 展示水平排列的三個按鈕，各自佔據相同寬度：

圖 1 使用水平 FillLayout 的 Shell 界面

圖 2 則為垂直排列效果：

圖 2 使用垂直 FillLayout 的 Shell 界面

二、RowLayout：流式行佈局，支援換行與間距

RowLayout 與 FillLayout 類似，但更靈活：控件大小可不一致，且會在一行排滿後自動換行。配合 RowData 可單獨設置每個控件的尺寸。

關鍵屬性

spacing：控件間距
marginLeft、marginTop：起始邊距
justify：為 true 時嘗試拉伸控件填滿行/列

代碼範例

RowLayout layout = new RowLayout(SWT.HORIZONTAL);
layout.spacing = 30;
layout.marginLeft = 30;
layout.marginTop = 30;
shell.setLayout(layout);

RowData rowData = new RowData();
rowData.height = 50;
rowData.width = 100;
Button btn1 = new Button(shell, SWT.PUSH);
btn1.setText("按鈕1");
btn1.setLayoutData(rowData); // 僅 btn1 套用固定尺寸

圖 3 展示 RowLayout 效果，按鈕 1 尺寸固定，其餘按鈕自適應：

圖 3 RowLayout 效果圖

三、GridLayout：最強大、最常用的網格佈局

GridLayout 是 SWT 佈局的核心，支援多列、跨列/跨行、嵌套 Composite 等複雜結構，能滿足 90% 以上的界面需求。

構造函數

GridLayout()：單列，列寬不等
GridLayout(int numColumns, boolean makeColumnsEqualWidth)：指定列數與是否等寬

GridData 精細控制

每個控件通過 GridData 設置佈局數據：

horizontalSpan、verticalSpan：跨列/跨行
grabExcessHorizontalSpace：是否搶佔多餘空間
horizontalAlignment、verticalAlignment：對齊方式（BEGINNING, CENTER, END, FILL）
widthHint、heightHint：建議尺寸

綜合實戰範例

GridLayout layout = new GridLayout();
layout.numColumns = 3;
layout.makeColumnsEqualWidth = true;
shell.setLayout(layout);

// 第 1 行第 1 列：按鈕 1
GridData data = new GridData(GridData.FILL_BOTH);
data.widthHint = 200;
Button one = new Button(shell, SWT.PUSH);
one.setText("按鈕1");
one.setLayoutData(data);

// 第 1 行第 2-3 列：嵌套 Composite 放 3 個按鈕
Composite composite = new Composite(shell, SWT.NONE);
data = new GridData(GridData.FILL_BOTH);
data.horizontalSpan = 2;
composite.setLayoutData(data);

GridLayout innerLayout = new GridLayout();
innerLayout.numColumns = 1;
innerLayout.marginHeight = 15;
innerLayout.marginRight = 150;
composite.setLayout(innerLayout);
// ... 在 composite 上添加按鈕 2、3、4

// 最後一行：跨 3 列、跨 2 行的大按鈕
data = new GridData();
data.horizontalAlignment = GridData.FILL;
data.grabExcessHorizontalSpace = true;
data.horizontalSpan = 3;
data.verticalSpan = 2;
data.heightHint = 150;
Button five = new Button(shell, SWT.PUSH);
five.setText("按鈕5");
five.setLayoutData(data);

shell.pack();
shell.open();

此例展示了多列、跨列、嵌套 Composite、搶佔空間等核心技巧，是掌握 GridLayout 的最佳範本。

四、FormLayout：最高靈活度的附著式佈局

FormLayout 複雜但強大，通過 FormData + FormAttachment 實現控件邊緣與父容器邊緣、或其他控件邊緣的相對定位。適合需精確響應式調整的界面。

核心概念

FormAttachment：描述一條邊（left/top/right/bottom）的位置，可基於百分比、絕對偏移、或另一控件的邊緣。
numerator：百分比值（0-100），表示距父容器對應邊的比例。

常見場景與代碼

1. 按百分比定位

FormData data = new FormData();
data.left = new FormAttachment(40); // 距左邊 40%
button.setLayoutData(data);

2. 固定寬度居中（同時設 left/right）

data.left = new FormAttachment(40);
data.right = new FormAttachment(60); // 寬度佔 20%，永遠水平居中

注意：left < right，且 left + (100-right) = 按鈕寬度比例。若 left==right 則寬度為 0。

3. 絕對偏移

data.left = new FormAttachment(0, 20);  // 距左邊 20 像素
data.top = new FormAttachment(0, 40);   // 距頂部 40 像素
// 等同於 setLocation(20, 40)

4. 相對其他控件定位

// 按鈕 1
Button btn1 = new Button(shell, SWT.PUSH);
FormData d1 = new FormData();
d1.top = new FormAttachment(20);
d1.left = new FormAttachment(40);
d1.right = new FormAttachment(50);
btn1.setLayoutData(d1);

// 按鈕 2：水平置中於 btn1，垂直緊貼 btn1 底部
Button btn2 = new Button(shell, SWT.PUSH);
FormData d2 = new FormData();
d2.left = new FormAttachment(btn1, 0, SWT.CENTER);
d2.top = new FormAttachment(btn1);
btn2.setLayoutData(d2);

FormAttachment(control, offset, alignment) 可實現豐富的相對定位邏輯。

五、StackLayout：卡片式切換佈局

StackLayout 位於 org.eclipse.swt.custom 包，將多個控件疊放在同一位置，同一時刻僅顯示 topControl 指定的控件。常用於向導、分頁、視圖切換。

關鍵點

僅有一個屬性 topControl，預設為 null（無控件顯示）。
切換顯示需手動設置 topControl 並調用 shell.layout() 重新佈局。
所有子控件尺寸位置相同，由 StackLayout 統一管理。

實戰：按鈕循環切換

StackLayout layout = new StackLayout();
shell.setLayout(layout);

Button one = new Button(shell, SWT.PUSH); one.setText("按鈕1");
Button two = new Button(shell, SWT.PUSH); two.setText("按鈕2");
Button three = new Button(shell, SWT.PUSH); three.setText("按鈕3");

layout.topControl = one; // 初始顯示第一個

// 選擇監聽器：點擊當前按鈕切換到下一個
class CycleAdapter extends SelectionAdapter {
    Shell shell; StackLayout layout;
    CycleAdapter(Shell s, StackLayout l) { shell = s; layout = l; }
    public void widgetSelected(SelectionEvent e) {
        Control[] children = shell.getChildren();
        int idx = 0;
        for (; idx < children.length; idx++)
            if (children[idx] == layout.topControl) break;
        idx = (idx + 1) % children.length;
        layout.topControl = children[idx];
        shell.layout();
    }
}
CycleAdapter adapter = new CycleAdapter(shell, layout);
one.addSelectionListener(adapter);
two.addSelectionListener(adapter);
three.addSelectionListener(adapter);

點擊當前顯示的按鈕，三個按鈕循環輪換顯示。

總結與選型建議

佈局	適用場景	複雜度	靈活度
FillLayout	工具欄、按鈕組等等寬/等高線性排列	極低	低
RowLayout	流式排列、需換行、控件大小不一	低	中
GridLayout	表單、對話框、複雜結構、嵌套佈局	中	高
FormLayout	精確響應式、控件間複雜相對定位	高	最高
StackLayout	卡片切換、向導頁面、視圖切換	低	特定用途