Java圖形化：佈局方式

佈局方式

• FlowLayout:流佈局
• BorderLayout:邊框佈局
• GridLayout:網格佈局

FlowLayout（流佈局）

像Word打字，元件從左向右排列，一列排滿後自動換下一行。元件預設居中對齊，可以設定左/右對齊。
流佈局會維持元件的原始大小。
流佈局是JPanel（皮膚）的預設佈局。
容器可以使用setLayout()方法改變佈局。

示例程式碼：

import java.awt.FlowLayout;
import javax.swing.JButton;
import javax.swing.JFrame;

public class TestLowLayout {
    public static void main(String[] args) {
        JFrame jf = new JFrame("流佈局Demo");
        FlowLayout fl = new FlowLayout();
        jf.setLayout(fl);
        JButton jb1 = new JButton("按鈕1");
        JButton jb2 = new JButton("按鈕2");
        jf.add(jb1);
        jf.add(jb2);
        jf.setSize(600, 300);
        jf.setLocation(300, 200);
        jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        jf.setVisible(true);
    }

}

圖示：

BorderLayout(邊框佈局)

邊框佈局把整個視窗分成了5個部分：

• 上北
• 下南
• 左西
• 右東
• 中

其中，北和南是整行，但是中、西、東都不是整列。一般只會出現2個或3個部分。元件放入時需要指定放在哪個區域，預設在中部。每個部分只能存放一個元件，如果存放多個就會覆蓋前面的。如果想存放多個必須藉助皮膚（Panel）。元件在邊框佈局中不保持原始大小，會充滿整個區域，JFrame的預設佈局就是邊框佈局。如果某個部分不出現，這個區域會被出現的部分擠佔。

示例程式碼：

import java.awt.BorderLayout;
import javax.swing.JButton;
import javax.swing.JFrame;

public class TestBorderLayout {
    public static void main(String[] args) {
        JFrame jf = new JFrame("BorderLayout視窗");
        
        JButton jb = new JButton("中");
        JButton jb1 = new JButton("北");
        JButton jb2 = new JButton("南");
        JButton jb3 = new JButton("西");
        JButton jb4 = new JButton("東");
        
        jf.add(jb);
        jf.add(jb1,BorderLayout.NORTH);
        jf.add(jb2,BorderLayout.SOUTH);
        jf.add(jb3,BorderLayout.WEST);
        jf.add(jb4,BorderLayout.EAST);
        
        jf.setSize(600, 300);
        jf.setLocation(600, 600);
        jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        jf.setVisible(true);
    }
}

圖示：

GridLayout(網格佈局)

把視窗分成幾行幾列的表格方式，構造時需要指定行數和列數。元件在網狀佈局中不保持原始大小，會充滿整個區域。元件在網狀佈局中，一個格子只存放一個元件，自動向後走。

示例程式碼：

import java.awt.GridLayout;
import javax.swing.JButton;
import javax.swing.JFrame;

public class TestGridLayout {
    public static void main(String[] args) {
        JFrame jf = new JFrame("網格佈局Test");
        GridLayout gl = new GridLayout(5,4);
        jf.setLayout(gl);
        for (int i=0; i < 20; i++) {
            JButton jb = new JButton("按鈕 "+i);
            jf.add(jb);
        }
        // 自動調整大小
        jf.pack();
        jf.setLocation(300, 200);
        jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        jf.setVisible(true);
    }
}

圖示：

應用1：計算器

import java.awt.BorderLayout;
import java.awt.GridLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;

public class ComputerTest {
    public static void main(String[] args) {
        JFrame jf = new JFrame("計算器");
        JTextField jtf = new JTextField("0",20);
        jf.add(jtf,BorderLayout.NORTH);
        String[] lab = {"CE","C","+/-","BackS","7","8","9","+","4","5","6","-","1","2","3","*","0",".","=","/"};
        JPanel jp = new JPanel();
        GridLayout gl = new GridLayout(5,4);
        jp.setLayout(gl);
        for (int i=0; i<lab.length; i++) {
            JButton jb = new JButton(lab[i]);
            jp.add(jb);
        }
        jf.add(jp);
        // 自動調節視窗大小
        jf.pack();
        //  禁止改變視窗大小
        jf.setResizable(false);
        jf.setLocation(300, 200);
        jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        jf.setVisible(true);
    }
}

圖示：