目录
在Java可视化编程中,我们往往会用到往窗体中添加部件的情况,此时布局管理器显得非常重要,今天我们来仔细讲讲流式布局管理器和边界布局管理器这两种布局管理器:
在开始之前,我们需要先import Java中的awt包和swing包完成相关操作,像这样:
import java.awt.*
import javax.swing.*
一,布局管理器作用
Java可视化编程的内容中,按钮和文本框等等组件尤为重要,在添加这些组件进入窗体时,如果不用布局管理器,我们将无法控制这些组件在窗体中的分布,举个例子:
public class drawFrame {
public void showUI() {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setTitle("draw");
frame.setSize(1000,1000);
frame.setLocationRelativeTo(null);
JButton button = new JButton("Draw");
frame.add(button);
JButton button1 = new JButton("Draw 1");
frame.add(button1);
frame.setVisible(true);
}
}
public class main {
public static void main(String[] args) {
drawFrame frame = new drawFrame();
frame.showUI();
}
}
像这样不使用布局管理器,直接添加按钮的话,运行效果是这样:
可以看到,一个名为button1的按钮占满了整个窗口,这意味着直接添加按钮会导致button1占据全部页面并覆盖掉前一个按钮button,非常不符合我们需要的分布显示,因此我们需要用到布局管理器。
二,流式布局管理器
流式布局管理器是最常用的布局管理器之一,它的布局方式是:组件从左到右依次排列为一行,一行排满就接着排下一行。
效果
为了让大家更直观的感受到流式布局管理器的效果,我们在刚才的实例的那段代码上加上流式布局管理器看看效果 :
代码:
public class drawFrame {
public void showUI() {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setTitle("draw");
frame.setSize(1000,1000);
frame.setLocationRelativeTo(null);
frame.setLayout(new FlowLayout());//加上流式布局管理器
JButton button = new JButton("Draw");
frame.add(button);
JButton button1 = new JButton("Draw 1");
frame.add(button1);
frame.setVisible(true);
}
}
public class main {
public static void main(String[] args) {
drawFrame frame = new drawFrame();
frame.showUI();
}
}
效果:
可以看到,这样按钮就能够正常的依次显示。
用法
正如上面的代码演示,流式布局管理器的使用需要创建一个FlowLayout对象并作为参数传入调用的setLayout方法。
一般用两种方式:
FlowLayout flowLayout = new FlowLayout();
frame.setLayout(flowLayout);
frame.setLayout(new FlowLayout());
在窗体中或需要流式布局的部分中添加布局管理器。
我们多加几个按钮看看效果:
代码:
public class drawFrame {
public void showUI() {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setTitle("draw");
frame.setSize(1000,1000);
frame.setLocationRelativeTo(null);
frame.setLayout(new FlowLayout());
JButton button = new JButton("Draw");
frame.add(button);
JButton button1 = new JButton("Draw 1");
frame.add(button1);
JButton button2 = new JButton("Draw 2");
frame.add(button2);
JButton button3 = new JButton("Draw 3");
frame.add(button3);
frame.setVisible(true);
}
}
public class main {
public static void main(String[] args) {
drawFrame frame = new drawFrame();
frame.showUI();
}
}
效果:
我们也就可以看出来按钮占满一行后往下一行布局的流式布局管理器特点。
三,边界布局管理器
边界布局管理器将窗体分为几个部分:中部(CENTER),北部(NORTH),南部(SOUTH),西部(WEST),东部(EAST)。
而没有设置任何布局管理器的窗体的布局管理器默认为边界布局管理器,按钮在添加时相当于直接加入中部,并完全填满,后面如果添加其他元素的话会就被全部覆盖,由后面添加的元素占满中部区域。所以才有文章开头button1占据全部窗体的效果。
效果
由于窗体创建时布局管理器默认为边界布局管理器且默认只有中部区域,所以我们需要创建新的区域对象进行添加。
这里我们展示添加了西部和东部的窗体效果:
正如我们所见,边界布局管理器可以控制组件在窗体中的布局,但由于添加的组件会完全填充其所对应的区域,所以整体布局比较粗糙,灵活性不大。
用法
因为边界布局管理器为默认设置,所以我们在使用时只需在add方法后设置分布即可。
比如设置一个按钮组件到界面顶部:
JButton button1 = new JButton;("顶部")
frame.add(button1,BorderLayout.CENTER);
此次需要设置按钮分布时只需在add方法中传入组件名后再传入BorderLayout.对应区域即可。
四,流式布局管理器与边界布局管理器的综合应用
通过上面的介绍我们知道,流式布局管理器使组件分布具由流动性,十分灵活。而边界布局管理器则将窗体分为固定的几个区域,如果把两个布局管理器综合在一起使用,可以达到更好的布局效果。
效果
综合使用的效果可以看看上面的这个绘图工具,这个绘图工具使用了边界布局管理器设置组件的大致位置,然后用流式布局管理器避免一个组件占满一个部分的情况。
用法
这里我们首先需要用到JPanel组件,JPanel组件相当于一个“块”,新建多个JPanel对象相当于把整个窗体分为几块。比如刚才的图中就通过创建北部和南部两个JPanel把整个界面分为三块,分别为黑色的形状区,白色的画图区和蓝色的粗细,颜色设置区。然后在各个JPanel中添加流式布局管理器,然后添加需要的按钮和文本框。
下面我们来具体讲讲:
第一步:利用边界布局管理器划分区域
上面我们讲了,窗体默认的布局管理器是边界布局管理器,并且有中部(CENTER),北部(NORTH),南部(SOUTH),西部(WEST),东部(EAST)五个区域,所以我们通过创建JPanel并添加到对应区域就可以实现区域的划分。
来看具体代码:
import java.awt.*;
import javax.swing.*;
public class UI {
public void showUII(){
JFrame frame = new JFrame();
frame.setSize(1200,800);
frame.setDefaultCloseOperation(3);
frame.setTitle("draw");
frame.setLocationRelativeTo(null);
//基本的窗体设置
JPanel northPanel = new JPanel();
JPanel centerPanel = new JPanel();
JPanel southPanel = new JPanel();
//新建JPanel对象
northPanel.setPreferredSize(new Dimension(0,90));
southPanel.setPreferredSize(new Dimension(0,90));
//设置JPanel大小,高90
frame.add(northPanel,BorderLayout.NORTH);
frame.add(centerPanel,BorderLayout.CENTER);
frame.add(southPanel,BorderLayout.SOUTH);
//将JPanel对象添加进frame界面
frame.setVisible(true);
}
public static void main(String[] args){
UI drawUI = new UI();
drawUI.showUII();
}
}
这里我们通过新建JPanel对象并分别将其添加到中部(CENTER),北部(NORTH),南部(SOUTH)三个区域,实现了把frame划分成三个区域。
运行后会弹出这个界面:
可以看到,还没有具体的panel的效果,看不出来不同panel之间的区别,接下来我们加上背景颜色:
import java.awt.*;
import javax.swing.*;
public class UI {
public void showUII(){
JFrame frame = new JFrame();
frame.setSize(1200,800);
frame.setDefaultCloseOperation(3);
frame.setTitle("draw");
frame.setLocationRelativeTo(null);
//基本的窗体设置
JPanel northPanel = new JPanel();
JPanel centerPanel = new JPanel();
JPanel southPanel = new JPanel();
//新建JPanel对象
northPanel.setPreferredSize(new Dimension(0,90));
southPanel.setPreferredSize(new Dimension(0,90));
//设置JPanel大小,高90
northPanel.setBackground(Color.BLACK);
southPanel.setBackground(Color.BLUE);
//设置JPanel对象的背景颜色
frame.add(northPanel,BorderLayout.NORTH);
frame.add(centerPanel,BorderLayout.CENTER);
frame.add(southPanel,BorderLayout.SOUTH);
//将JPanel对象添加进frame界面
frame.setVisible(true);
}
public static void main(String[] args){
UI drawUI = new UI();
drawUI.showUII();
}
}
接下来我们运行就可以看出JPanel的具体区域:
这样我们就通过JPanel对象和边界布局管理器实现了区域划分(直观看就是黑色,白色,蓝色三个区域)。
第二步:利用流式布局管理器部署按钮和文本框
在划分完区域后,我们需要再各个区域中添加我们需要的按钮和文本框进入对应的JPanel中。
为此我们可以通过在JPanel中添加流式布局管理器来方便我们添加按钮和文本框,就像这样:
import java.awt.*;
import javax.swing.*;
public class UI {
public void showUII(){
JFrame frame = new JFrame();
frame.setSize(1200,800);
frame.setDefaultCloseOperation(3);
frame.setTitle("draw");
frame.setLocationRelativeTo(null);
//基本的窗体设置
JPanel northPanel = new JPanel();
JPanel centerPanel = new JPanel();
JPanel southPanel = new JPanel();
//新建JPanel对象
northPanel.setPreferredSize(new Dimension(0,90));
southPanel.setPreferredSize(new Dimension(0,90));
//设置JPanel大小,高90
northPanel.setBackground(Color.BLACK);
southPanel.setBackground(Color.BLUE);
//设置JPanel对象的背景颜色
FlowLayout flowLayout = new FlowLayout();
southPanel.setLayout(flowLayout);
northPanel.setLayout(flowLayout);
centerPanel.setLayout(flowLayout);
//新建并添加流式布局管理器进入JPanel
frame.add(northPanel,BorderLayout.NORTH);
frame.add(centerPanel,BorderLayout.CENTER);
frame.add(southPanel,BorderLayout.SOUTH);
//将JPanel对象添加进frame界面
frame.setVisible(true);
}
public static void main(String[] args){
UI drawUI = new UI();
drawUI.showUII();
}
}
然后加上需要的按钮和文本框就完成流式布局管理器和边界布局管理器综合应用的布局了:
代码:
import java.awt.*;
import javax.swing.*;
public class UI {
public void showUII(){
JFrame frame = new JFrame();
frame.setSize(1200,800);
frame.setDefaultCloseOperation(3);
frame.setTitle("draw");
frame.setLocationRelativeTo(null);
//基本的窗体设置
JPanel northPanel = new JPanel();
JPanel centerPanel = new JPanel();
JPanel southPanel = new JPanel();
//新建JPanel对象
northPanel.setPreferredSize(new Dimension(0,90));
southPanel.setPreferredSize(new Dimension(0,90));
//设置JPanel大小,高90
northPanel.setBackground(Color.BLACK);
southPanel.setBackground(Color.BLUE);
//设置JPanel对象的背景颜色
FlowLayout flowLayout = new FlowLayout();
southPanel.setLayout(flowLayout);
northPanel.setLayout(flowLayout);
centerPanel.setLayout(flowLayout);
//新建并添加流式布局管理器进入JPanel
frame.add(northPanel,BorderLayout.NORTH);
frame.add(centerPanel,BorderLayout.CENTER);
frame.add(southPanel,BorderLayout.SOUTH);
//将JPanel对象添加进frame界面
JButton button1 = new JButton("直线");
JButton button2 = new JButton("矩形");
JButton button3 = new JButton("三角形");
JButton button4 = new JButton("任意多边形");
JButton button5 = new JButton("曲线");
JButton button6 = new JButton("圆形");
JButton button7 = new JButton("橡皮擦");
JButton button8 = new JButton("清空");
//新建形状按钮
northPanel.add(button1);
northPanel.add(button2);
northPanel.add(button3);
northPanel.add(button4);
northPanel.add(button5);
northPanel.add(button6);
northPanel.add(button7);
northPanel.add(button8);
//将按钮添加进北部的JPanel
JTextField textRed = new JTextField();
JTextField textBlue = new JTextField();
JTextField textGreen = new JTextField();
JLabel labelRed = new JLabel("红色");
JLabel labelBlue = new JLabel("蓝色");
JLabel labelGreen = new JLabel("绿色");
Dimension dim = new Dimension(200,40);
textRed.setPreferredSize(dim);
textBlue.setPreferredSize(dim);
textGreen.setPreferredSize(dim);
//新建颜色数值的文本框和提示文本,并设置文本框大小
southPanel.add(labelRed);
southPanel.add(textRed);
southPanel.add(labelBlue);
southPanel.add(textBlue);
southPanel.add(labelGreen);
southPanel.add(textGreen);
//将提示文本和文本框依次加入南部的JPanel
JButton buttonC = new JButton("粗");
JButton buttonZ = new JButton("中");
JButton buttonX = new JButton("细");
southPanel.add(buttonC);
southPanel.add(buttonZ);
southPanel.add(buttonX);
//新建并加入南部的JPanel
frame.setVisible(true);
}
public static void main(String[] args){
UI drawUI = new UI();
drawUI.showUII();
}
}
最终效果:
补充
事实上,JPanel内部默认的布局管理器就是就是流式布局管理器,所以如果你没有自己部署流式布局管理器进JPanel也能达到相同的效果。