SWT/JFace RowLayout 佈局管理器：流式排列與靈活換行完全指南

前言

RowLayout 是 SWT 中類似 HTML 流式佈局的管理器。元件按順序左右（或上下）排列，空間不足時自動換行。支援元件保持原有尺寸、邊距/間距控制、單元件尺寸覆蓋，比 FillLayout 靈活得多，適合工具欄、標籤雲、動態按鈕組等場景。

核心屬性

RowData：單元件尺寸覆蓋

// 預設使用元件 computeSize() 計算尺寸
// 若需強制指定尺寸：
button.setLayoutData(new RowData(100, 35)); // 寬 100px，高 35px

// 僅指定寬度，高度自動
button.setLayoutData(new RowData(80, SWT.DEFAULT));

完整範例 1：基礎水平流式佈局

public class RowLayoutSample {
    public static void main(String[] args) {
        Display display = new Display();
        Shell shell = new Shell(display);
        shell.setText("RowLayout Demo");

        RowLayout layout = new RowLayout();
        // layout.wrap = true;      // 預設 true
        // layout.pack = true;      // 預設 true
        // layout.justify = false;  // 預設 false
        // layout.spacing = 5;
        shell.setLayout(layout);

        Button b1 = new Button(shell, SWT.PUSH);
        b1.setText("button1");
        b1.setLayoutData(new RowData(100, 35)); // 固定尺寸

        List list = new List(shell, SWT.BORDER);
        list.add("item 1"); list.add("item 2"); list.add("item 3");
        // List 使用首選尺寸

        Button b2 = new Button(shell, SWT.PUSH);
        b2.setText("button #2");
        // 無 RowData，使用首選尺寸

        shell.pack();
        shell.open();
        while (!shell.isDisposed()) {
            if (!display.readAndDispatch()) display.sleep();
        }
        display.dispose();
    }
}

完整範例 2：動態新增按鈕（結合 Composite）

public class DynamicRowLayout {
    public static void main(String[] args) {
        Display display = new Display();
        Shell shell = new Shell(display);
        shell.setLayout(new RowLayout());

        // 外層容器：黃色背景，RowLayout
        final Composite container = new Composite(shell, SWT.BORDER);
        container.setLayout(new RowLayout());
        container.setBackground(display.getSystemColor(SWT.COLOR_YELLOW));

        container.addControlListener(new ControlListener() {
            public void controlResized(ControlEvent e) {
                System.out.println("Container resized: " + container.getSize());
            }
            public void controlMoved(ControlEvent e) {}
        });

        // 新增按鈕
        Button addBtn = new Button(shell, SWT.PUSH);
        addBtn.setText("Add new button");
        addBtn.addSelectionListener(new SelectionAdapter() {
            int count = 0;
            public void widgetSelected(SelectionEvent e) {
                Button btn = new Button(container, SWT.PUSH);
                btn.setText("Button #" + (count++));
                // 關鍵：動態新增後必須重新佈局
                container.layout(true);
                container.pack(); // 可選：調整容器大小
                shell.layout(true);
                shell.pack(true);
            }
        });

        shell.pack();
        shell.open();
        while (!shell.isDisposed()) {
            if (!display.readAndDispatch()) display.sleep();
        }
        display.dispose();
    }
}

進階配置場景

1. 垂直流式（標籤列表）

RowLayout layout = new RowLayout(SWT.VERTICAL);
layout.wrap = false; // 垂直模式通常不換行
layout.pack = true;
layout.spacing = 8;
layout.marginLeft = layout.marginRight = 10;

2. 兩端對齊

RowLayout layout = new RowLayout();
layout.justify = true; // 元件會被拉伸填滿行寬
// 注意：pack 建議設 false，否則元件保持原尺寸無法拉伸

3. 固定高度行（工具欄風格）

RowLayout layout = new RowLayout();
layout.pack = false; // 元件高度填滿行高
layout.spacing = 2;
layout.marginHeight = 2;
// 所有按鈕高度一致，美觀

RowLayout vs FillLayout vs GridLayout

常見問題與解決

1. 元件被截斷：檢查 wrap=true、父容器寬度足夠、pack=true 導致元件過寬。
2. 動態新增不顯示：必須呼叫 parent.layout(true) 觸發重新佈局。
3. justify 不生效：需 pack=false 允許元件拉伸。
4. 垂直模式間距異常：垂直模式下 spacing 控制上下間距，marginTop/Bottom 控制邊距。

總結

RowLayout 是「流式佈局的甜蜜點」：

• 比 FillLayout 靈活：支援換行、尺寸控制、兩端對齊。
• 比 GridLayout 簡單：無需預定列數、無 span/grab 複雜度。
• 核心參數：wrap（換行）、pack（保持尺寸）、justify（對齊）、RowData（單元件尺寸）。
• 動態場景：layout(true) + pack() 是關鍵。

當你需要「像文字一樣流動排列元件」時，RowLayout 是首選。