Java AWT容器布局

• 由于Java图形界面要考虑平台的适应性，因此，容器内元素的排列通常不采用通过坐标点确定部件位置的方式，而是采用特定的布局方式来安排部件。
• 容器的布局设计是通过设置布局管理器来实现的，java,awt包中共定义了5中布局管理器，与之对应有5种布局策略，通过setLayout()方法可设置容器的布局方式，具体格式如下：

public void setLayout(LayoutManager mgr);

• 如不进行设置，则各种容器采用默认的布局管理器。
• 窗体容器默认采用BorderLayout布局，而面板容器默认采用FlowLayout布局。

FlowLayout（流式布局）

• 流式布局方式将部件按照加入的先后次序从左到右排放，放不下再换至下一行，同时按照参数要求安排部件间的纵横间隔和对其方式，其构造方法如下：
  • public FlowLayout()：居中对齐方式，部件纵横间隔为5个像素。
  • public FlowLayout(int align,int hgap,int vgap):3个参数分别指定对齐方式，纵，横间距。
  • public FlowLayout(int align)：参数规定每行部件的对齐方式，部件纵横间距默认为5个像素，其中FlowLayout提供了如下代表对齐方式的常量，FlowLayout.LEFT（居左）,FlowLayout.CENTER（居中）,FlowLayout.RIGHT（居右）
• 在创建了布局方式后可通过方法add（部件名）将部件加入到容器中。

[例11-3]：将大小不断递增的9个按钮放入窗体中。

class FlowLayoutExample extends Frame {
    public FlowLayoutExample() {
        this.setLayout(new FlowLayout(FlowLayout.LEFT, 10, 10));
        String spaces = "";// 用来使按钮的大小变化。
        for (int i = 1; i <= 9; i++) {
            this.add(new Button("B#" + i + spaces));
            spaces += " ";
        }
    }

    public static void main(String[] args) {
        Frame x = new FlowLayoutExample();
        x.setSize(200, 100);
        x.setVisible(true);
    }
}

• 说明：初始运行时，由于窗体空间太小，所以窗体中还有些部件没显示出来，用鼠标将窗体拉大一些，可以发现控件的大小不会改变，但窗体被部件的位置关系会发生变动。
• 注意：使用FlowLayout布局的一个重要特点是布局管理器不会改变控件的大小。

BorderLayout（边缘或方位布局）

• 方位布局方式将容器内部空间分为东（East)，南（South)，西（West)，北（North)，中（Center)5个区域，5个区域的的尺寸充满容器的整个空间，运行时，每个区域的实际尺寸由区域的内容确定，构造方法如下：
  • public BorderLayout()：居中对齐方式，部件纵横间隔为0个像素。
  • public FlowLayout(int hgap,int vgap):2个参数分别指定对齐方式，纵，横间距。
• 加入部件的add()方法有以下两种形态：
  • add（方位，部件）
  • add（部件，方位）
• 其中，方位可以是方位字符串和方位常量，用于指明部件安排在哪些区域，方位常量有BorderLayout.CENTER,BorderLayout.NORTH等，而方位字符串必须是首字母为大写的小写单词形式（例如Center)
• 如果某个区域没有分配部件，则其他部件将按图中区域扩展的方向占据该区域，可以看出，南北方向部件只能水平扩展，东西方向部件只能垂直扩展，而中央部件则可向水平，垂直两方向扩展，当容器在水平方向上变宽或变窄时，东和西两处的部件不会变化，当容器在垂直方向伸展变化时，南和北两处的部件不会变化。
• 如果容器中仅有一个部件时，如果部件加入在北方，则它仅占用北区，其他地方为空白，但如果是加入到中央，则该部件将占满整个容器。
• 将以下代码替换例11-3构造方法中的内容，将标识为North,East,South,West,Center的按钮加入到同名的方位。

class BorderLayoutExample extends Frame {
    public BorderLayoutExample() {
        String[] borders = {"North", "East", "South", "West", "Center"};
        this.setLayout(new BorderLayout(10, 10));
        for (int i = 0; i < 5; i++) {
            this.add(borders[i], new Button(borders[i]));
        }
    }

    public static void main(String[] args) {
        Frame x = new BorderLayoutExample();
        x.setSize(200, 100);
        x.setVisible(true);
    }
}

• BorferLayout布局的特点是部件的尺寸被布局管理器强行控制，即与其所在区域的尺寸相同，如果某个区域无部件，则其他区域将按缩放规则自动占用其位置。

[例11-4]：实现一个简单的图像浏览器，部署"上一张”,"下一张”两个按钮，单击按钮可前后翻阅图片。

class PhotoExplorer {
    public static void main(String[] args) throws IOException {
        Frame x = new ShowAnimator();
        x.setSize(400, 400);
        x.setVisible(true);
        x.setTitle("PhotoExplorer");
    }
}

class ShowAnimator extends Frame implements ActionListener {
    Image[] m_image;// 保存图片序列的Image数组。
    int totallmages = 2;// 图片序列中图片总数。
    int pos = 0;// 当前显示图片的序号。
    Button b1, b2;

    public ShowAnimator() throws IOException {
        m_image = new Image[totallmages];
        for (int i = 0; i < totallmages; i++){
            m_image[i] = ImageIO.read(new File("src/images/" + i + ".png")); // 将图片加载进来。
        }
        b1 = new Button("上一张");
        b2 = new Button("下一张");
        setLayout(new BorderLayout());
        Panel operate = new Panel();
        operate.setLayout(new FlowLayout(FlowLayout.CENTER));
        operate.add(b1);
        operate.add(b2);
        add(BorderLayout.SOUTH, operate);// 操作控制面板安排在底部。
        b1.addActionListener(this);
        b2.addActionListener(this);
        addWindowListener(new WindowAdapter() {
            public void windowClosing(WindowEvent we) {
                System.exit(0);
            }
        });
    }

    public void paint(Graphics g) {
        g.drawImage(m_image[pos], getInsets().left, getInsets().top, null);// 显示当前图片。
    }

    public void actionPerformed(ActionEvent e) {
        if (e.getSource() == b1)// 区分事件源。
        {
            if (pos > 0) {
                --pos;// 上一张。
                System.out.println(pos);
            }
        } else {
            pos = ++pos % totallmages;// 下一张。
            System.out.println(pos);
        }
        repaint();
    }
}

• 说明：在界面设计中引入一个面板来安排翻动图片的两个按钮，并通过BorderLayout布局将面板安排在底部，这种嵌套布局设计在图形界面布局设计中经常出现。

GridLayout（网格布局）

• GridLatout布局的方式将容器的空间分为若干行乘若干列的网格区域，部件按从左到右。从上到下的次序被加到各单元格中，部件的大小将调整为单元格大小相同，其构造方法如下：
  • public GridLayout()：所有部件在一行中。
  • public GridLayout(int rows,int cols)：通过参数指定布局的行和列数。
  • public GridLayout(int rows,int cols,int hgaps,int vgaps)：通过参数指定划分的行和列数以及部件间的水平和垂直间距。
• 设定布局后，可通过方法add（部件名）将部件加入到容器中。
• 以下代码替换例11-3构造方法中的内容：

class GridLayoutExample extends Frame {
    public GridLayoutExample() {
        this.setLayout(new GridLayout(3, 3, 10, 10));
        for (int i = 1; i <= 9; i++) {
            this.add(new Button("Button#" + i));
        }
    }

    public static void main(String[] args) {
        Frame x = new GridLayoutExample();
        x.setSize(200, 100);
        x.setVisible(true);
    }
}

• 说明：该布局的特点是部件整齐排列，行列位置关系固定，如果调整容器的大小，部件的大小也将发生变化。

CardLayout（卡片式布局）

• CardLayout布局方式将部件叠成卡片的形式，每个加入部件占用一块卡片，最初显示第一块卡片，最初显示第一块卡片，以后通过卡片翻动显示其他卡片，构造方法如下：
  • public CardLayout()：显示部件将占满整个容器，不留边界。
  • public CardLayout(int hgap,int vgap)：容器边界分别流出水平和垂直间隔，部件占中央。
• 加入容器用add（字符串，部件名）方法，其中，字符串用来标识卡片名称，要显示指定名称的卡片可通过调用卡片布局对象的show（容器，字符串）方法来选择，也可以根据部件加入容器的顺序，按如下方法来翻动卡片。
  • first（容器）：显示第一块卡片。
  • last（容器）：显示最后一块卡片。
  • next（容器）：显示下一块卡片。

GridBagLayout（网格块布局）

• GridBagLayout布局是使用最为复杂，功能最强的一种，它是在GridBigLayout的基础上发展而来的，该布局也是将整个容器分成若干行，列组成的单元，但各行可以有不同的高度，每栏也可以有不同的宽度，一个部件可以占用一个，也可以占用多个单元格。
• 可以看出，GridBagLayout在布置部件时需要许多信息来描述一个部件要放的位置，大小，伸缩性等，为此，在该布局中的部件加入时，要指定一个约束对象（GridBagConstraints)，其中封装了与位置，大小等有关的约束数据，具体命令格式为：

add（部件，约束对象）;

• 约束对象常用的几个属性如下：
  • 规定位置属性，一般通过gridx,gridy规定部件占用单元格的位置，最左上角为0,0，也可以用方向位置参数控制部件的位置，类似于BorderLayout布局，这里的方向位置参数包括CENTER,EAST,NORTH,NORTHEAST,SOUTH,SOUTHWEST及WEST
  • gridheight,gridwidth：部件占用单元格的个数，在规定部件的位置和宽，高时，也可以用两个常量，如果gridwidth的值为RELATIVE，表示该部件相对前一个部件占下一个位置，如果gridwidth值为REMAINED，则表示部件本栏占用所有剩余的单元格，这里指的剩余是指该行所有部件部署完成后多余的单元格数量，还要注意，如果是在一行的最后一个单元格的gridwidth使用了REMAINED，则下一行要将gridwidth值改为1，否则下一行的第一个部件将占满整行。
  • rowHeight,columnWidth：指定行高，栏宽，默认情况下行高和栏宽的大小分别由最高和最宽的部件决定。
  • weightx,weighty：控制单元格的行和宽的伸展，在一行和一列中最多只能有一个部件指定伸展参数，伸展可保证窗体大小变化时部件的大小也作相应的调整。
  • 填充（fill）属性规定部件填充网格的方式，常量有BOTH,HORIZONTAL,VERTICAL,NONE，其中，BOTH代表水平和垂直两个方向伸展，也就是占满两个方向剩余的所有单元格，而NONE代表部件不伸展，保持原来大小。

[例11-5]：简单电子邮件发送界面的实现。

• 构建一个界面，标签的大小保持不变（占1个单元格），文本框（初始占2栏单元格）在横的方向根据窗体的大小伸展变化，输入邮件内容的文本域（占3栏单元格）在横，竖两个方向伸展变化，填满整个容器。

class EmailUI extends Frame {
    public static void main(String[] args) {
        new EmailUI();
    }

    public EmailUI() {
        Label receiveLable = new Label("收件人：");
        Label ccLable = new Label("抄送：");
        Label subjectLable = new Label("主题：");
        TextField receiveField = new TextField();// 收件人。
        TextField ccField = new TextField();// 抄送。
        TextField subjectField = new TextField();// 主题。
        TextArea mailArea = new TextArea();// 输入邮件文字区域。
        setLayout(new GridBagLayout());
        GridBagConstraints gridBag = new GridBagConstraints();
        gridBag.fill = GridBagConstraints.HORIZONTAL;// 用水平填充方式。
        gridBag.weightx = 0;// 行长不变。
        gridBag.weighty = 0;// 列高不变。
        addToBag(receiveLable, gridBag, 0, 0, 1, 1);
        addToBag(ccLable, gridBag, 0, 1, 1, 1);
        addToBag(subjectLable, gridBag, 0, 2, 1, 1);
        gridBag.weightx = 100;// 行自适应缩放。
        gridBag.weighty = 0;// 列高不变。
        addToBag(receiveField, gridBag, 1, 0, 2, 1);
        addToBag(ccField, gridBag, 1, 1, 2, 1);
        addToBag(subjectField, gridBag, 1, 2, 2, 1);
        gridBag.fill = GridBagConstraints.BOTH;// 采用全填充方法布局。
        gridBag.weightx = 100;// 行自适应缩放。
        gridBag.weighty = 100;// 列自适应缩放。
        addToBag(mailArea, gridBag, 0, 4, 3, 1);// 占3栏一行。
        setSize(300, 300);
        setVisible(true);
        addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }

    /*将一个部件按指定大小加入到GridBagLayout布局的指定位置*/
    void addToBag(Component c, GridBagConstraints gbc, int x, int y, int w, int h) {
        gbc.gridx = x;
        gbc.gridy = y;
        gbc.gridheight = h;
        gbc.gridwidth = w;
        add(c, gbc);// 按指定约束加入部件。
    }
}

BoxLayout（盒式布局）

• BoxLayout布局是Swing中引入的一种布局管理器，其允许将控件按照x轴（从左到右）或者y轴（从上到下）方向来摆放，而且沿着主轴能够设置不同尺寸，如果要调整这些控件之间的空间，需要使用Box容器提供的透明组件来填充控件之间的间隔。

BoxLayout的基本使用

• BoxLayout布局的构造方法如下：

BoxLayout(Container target,int axis);

• target表示当前管理的容器。
• axis是指哪个轴，它有两个值。
  • BoxLayout.X_AXIS代表水平方向排列。
  • BoxLayout.Y_AXIS代表垂直方向排列。

[例11-6]:BoxLayout布局演示。

class BoxLayoutTest {
    public static void main(String[] args) {
        JFrame f = new JFrame("BoxLayput");//Swing窗体。
        Container c = f.getContentPane();// 取得JFrame的内容面板。
        BoxLayout box = new BoxLayout(c, BoxLayout.X_AXIS);
        c.setLayout(box);
        JButton btnA = new JButton("A");//Swing按钮。
        JButton btnB = new JButton("B");
        JButton btnC = new JButton("C");
        c.add(btnA);
        c.add(btnB);
        c.add(btnC);
        f.setSize(180, 100);
        f.setVisible(true);
    }
}

• 说明:BoxLayout主要用于Swing界面的布局，所以本例的传统和按钮部件均为Swing部件，该布局也可用于AWT部件的布局，但效果上有一定的差异，当用于AWT部件时，后面的间隔控制和对其控制将无效。

部件之间的间隔控制

Box容器提供了4种透明的组件，即RegidArea,Strut,Glue和Filler,Box容器分别提供了不同的方法来创建这些组件，这4个组件的特点如下：

• RegidArea：可以定义水平和垂直两个方向的间隔，例如：

c.add(Box.createRigidArea(new Dimension(15,15)));

• Strut：只能定义一个方向的尺寸，水平方向用Box.createHorizontalStrut(int width)创建，水垂直方向用Box.createVerticalStrut(int width)进行创建，例如：

c.add(Box.createHorizontalStrut(10));

• Glue：会尽可能地占据两个控件之间的多余空间，从而将其间隔的控件挤到两边，水平方向和垂直方向的Glue分别用Box.createHorizontalGlue()和Box.createVerticalGlue()创建。

c.add(Box.createHorizontalGlue());

• Fille：是Box的内部类，它与RegidArea相似，都可以指定水平或者垂直的尺寸，但是它可以设置最小，最大和优先尺寸，Filler的构造方法如下：

Box.Filler(Dimension min,Dimension pref,Dimension max);

• 其中，min表示最小的显示区域大小，pref表示最佳的显示区域大小，max表示最大的显示区域大小，当窗体被拖动时，组件间的距离不会超出最小值和最大值，例如：

c.add(new Box.Filler(new Dimension(100,100),new Dimension(200,200),new Dimension(300,300)));

组件的对齐控制

• 通常情况下，组件按默认对齐方式排列，根据需要也可以改变组件的对齐方式，在组件上通过调用组件的setAlignmentX()和setAlignmentY()方法进行设置，其中，setAlignmentX()方法的参数包括左对齐，居中对齐和右对齐，而setAlignmentY()方法的参数包括顶部对齐和底部对齐，均通过Component类的常量来指定。
• 例如，以下代码将例11-6中按钮A的顶端与按钮B的底部对齐，而按钮C没设置，所以上下居中。

class AlignmentY {
    public static void main(String[] args) {
        JFrame f = new JFrame("BoxLayput");//Swing窗体。
        Container c = f.getContentPane();// 取得JFrame的内容面板。
        BoxLayout box = new BoxLayout(c, BoxLayout.X_AXIS);
        c.setLayout(box);
        JButton btnA = new JButton("A");//Swing按钮。
        JButton btnB = new JButton("B");
        JButton btnC = new JButton("C");
        btnA.setAlignmentY(Component.TOP_ALIGNMENT);// 将顶部对齐。
        btnB.setAlignmentY(Component.BOTTOM_ALIGNMENT);// 将底部对齐。
        c.add(btnA);
        c.add(btnB);
        c.add(btnC);
        f.setSize(180, 100);
        f.setVisible(true);
    }
}

• 如果将例11-6的改为BoxLayout.Y_AXIS垂直排列，并通过如下代码设置按钮A的最右边界与按钮B和按钮C的最左边界在同一条垂直线上：

class AlignmentX {
    public static void main(String[] args) {
        JFrame f = new JFrame("BoxLayput");//Swing窗体。
        Container c = f.getContentPane();// 取得JFrame的内容面板。
        BoxLayout box = new BoxLayout(c, BoxLayout.Y_AXIS);
        c.setLayout(box);
        JButton btnA = new JButton("A");//Swing按钮。
        JButton btnB = new JButton("B");
        JButton btnC = new JButton("C");
        btnA.setAlignmentX(Component.RIGHT_ALIGNMENT);
        btnB.setAlignmentX(Component.LEFT_ALIGNMENT);
        btnC.setAlignmentX(Component.LEFT_ALIGNMENT);
        c.add(btnA);
        c.add(btnB);
        c.add(btnC);
        f.setSize(180, 100);
        f.setVisible(true);
    }
}

• 注意:Swing部件的setAlignmentX()方法只有在布局是BoxLayoutY_AXIS时才有效，而setAlignmentY()方法只有在布局是BoxLayoutX_AXIS时才有效，一般的，所有垂直方向排列的部件采用相同的X对齐设置，所有自左向右水平排列的部件采用相同的Y对齐设置。