【Java AWT 图形界面编程】LayoutManager 布局管理器 ② ( FlowLayout 流式布局 )

韩曙亮

发布于 2023-03-30 18:44:39

1.2K0

文章被收录于专栏：韩曙亮的移动开发专栏韩曙亮的移动开发专栏

文章目录

一、FlowLayout 流式布局

FlowLayout 流式布局中 , 组件按照某个方向进行排列 , 如 :

从左到右
从右到左
从中间到两边

如果遇到障碍或者走到界面边界 ,

就返回到开始位置 , 在下一行从头继续按照原方向进行排列 ;

如 : 下面的布局就是从左向右的流式布局 , 将 6 个组件放在 FlowLayout 流式布局中 , 1 , 2 , 3 组件放入后 , 再放入 4 组件 , 发现第 1 排位置不够了 , 遇到障碍 , 此时折返回左侧 , 另起一行 , 在第 2 排继续从左到右排列 ;

二、FlowLayout 流式布局 API

FlowLayout 构造函数 :

FlowLayout() 构造函数 : 使用默认的对齐方式 , 默认的垂直间距和水平间距 , 创建流式布局 ;

    /**
     * 构造一个新的<code>FlowLayout</code>，具有居中对齐和
     * 默认水平和垂直间隔为5单元。
     */
    public FlowLayout() {
        this(CENTER, 5, 5);
    }

FlowLayout(int align) 构造函数 : 使用指定的对齐方式 , 默认的垂直间距和水平间距 , 创建流式布局 ;

    /**
     * 构造一个新的<code>FlowLayout</code>
     * 对齐和默认的5单元水平和垂直差距。
     * 对齐参数的值必须为之一
     * <code>FlowLayout.LEFT</code>, <code>FlowLayout.RIGHT</code>,
     * <code>FlowLayout.CENTER</code>, <code>FlowLayout.LEADING</code>,
     * or <code>FlowLayout.TRAILING</code>.
     * @param align 对齐值
     */
    public FlowLayout(int align) {
        this(align, 5, 5);
    }

FlowLayout(int align, int hgap, int vgap) 构造函数 : 使用指定的对齐方式 , 指定的垂直间距和水平间距 , 创建流式布局 ;

    /**
     * 使用指定的对齐方式创建一个新的流布局管理器
     * 以及指示的水平和垂直间隙。
     * <p>
     * 对齐参数的值必须为之一
     * <code>FlowLayout.LEFT</code>, <code>FlowLayout.RIGHT</code>,
     * <code>FlowLayout.CENTER</code>, <code>FlowLayout.LEADING</code>,
     * or <code>FlowLayout.TRAILING</code>.
     * @param      align   对齐值
     * @param      hgap    各组件之间的水平间隙
     *                     在分量和
     *                     <code>Container</code>的边界
     * @param      vgap    组件之间的垂直间隙
     *                     在分量和
     *                     <code>Container</code>的边界
     */
    public FlowLayout(int align, int hgap, int vgap) {
        this.hgap = hgap;
        this.vgap = vgap;
        setAlignment(align);
    }

三、FlowLayout 流式布局代码示例

Frame 是 Window 子类 , 是界面中窗口 , 其默认的布局管理器是 BorderLayout 布局管理器 ,

通过调用 Container#setLayout 函数可以手动修改容器的布局管理器 ;

1、FlowLayout 流式布局左对齐代码示例及执行效果

代码示例 :

import java.awt.*;

public class HelloAWT {
    public static void main(String[] args) {
        Frame frame = new Frame("AWT 界面编程");

        // 创建流式布局
        // 布局中的组件从左到右进行排列
        // 水平间隔 10 像素, 垂直间隔 10 像素
        FlowLayout flowLayout = new FlowLayout(FlowLayout.LEFT, 10, 10);

        // Frame 容器设置流式布局
        frame.setLayout(flowLayout);
        frame.setBounds(0, 0, 800, 500);

        // 添加多个组件
        for (int i = 0; i < 50; i ++) {
            Button button = new Button("按钮 " + i);
            frame.add(button);
        }

        frame.setVisible(true);
    }
}

执行结果 : 这是左对齐的模式 ;

2、FlowLayout 流式布局居中对齐代码示例及执行效果

居中对齐代码示例 :

import java.awt.*;

public class HelloAWT {
    public static void main(String[] args) {
        Frame frame = new Frame("AWT 界面编程");

        // 创建流式布局
        // 布局中的组件从左到右进行排列
        // 水平间隔 10 像素, 垂直间隔 10 像素
        FlowLayout flowLayout = new FlowLayout(FlowLayout.CENTER, 10, 10);

        // Frame 容器设置流式布局
        frame.setLayout(flowLayout);
        frame.setBounds(0, 0, 800, 500);

        // 添加多个组件
        for (int i = 0; i < 50; i ++) {
            Button button = new Button("按钮 " + i);
            frame.add(button);
        }

        frame.setVisible(true);
    }
}

执行效果 :

2、FlowLayout 流式布局右对齐代码示例及执行效果

代码示例 :

import java.awt.*;

public class HelloAWT {
    public static void main(String[] args) {
        Frame frame = new Frame("AWT 界面编程");

        // 创建流式布局
        // 布局中的组件从左到右进行排列
        // 水平间隔 10 像素, 垂直间隔 10 像素
        FlowLayout flowLayout = new FlowLayout(FlowLayout.RIGHT, 10, 10);

        // Frame 容器设置流式布局
        frame.setLayout(flowLayout);
        frame.setBounds(0, 0, 800, 500);

        // 添加多个组件
        for (int i = 0; i < 50; i ++) {
            Button button = new Button("按钮 " + i);
            frame.add(button);
        }

        frame.setVisible(true);
    }
}

执行效果 :