死磕Java系列之Java GUI 窗体和布局
窗体是底层容器，用于放各种组件，常见的容器有JFrame和JDialog两种，JPanel是中间容器，可以放在底层容器中，使用中间容器便于基本组件的管理。布局管理是将容器中的组件按照一定的规则和方式放在容器中。那么,如何定义一个容器呢？容器有大有小，有位置，有标题，这些如何设计呢？中间容器是底层容器和组件的缓冲器，那么，一个框架中可以有两个JPanel？如何在Jpanel中加入各种组件呢？界面布局有很多类型，常见的布局应该如何定义呢？如果不采用布局，各个组件的位置当如何定义？
（一）容器
容器是用来放各种组件的界面，常见的容器有窗口，对话框，和面板。在定义底层容器的时候需要考虑容器的位置，大小，是否可见，关闭时的操作等。
Frame 类就是解决这个问题的——它是一个容器，允许程序员把其他组件添加到它里面，把它们组织起来，并把它们呈现给用户。 是Java图形用户界面(GUI)工具包swing中的存放组件的容器。相当于相框。
JPanel类，是Java图形用户界面(GUI)工具包swing中的面板容器类。相当于画板。
（1）窗体
JavaSwing_4.1: JFrame（窗口
JFrame；窗体，窗体类似于饭店的桌子或放相片的相框，窗体用来显示给用户界面的整体视感。
import java.awt.Container;
import javax.swing.JFrame;
import javax.swing.JLabel;
public class TEST02 extends JFrame{ //需要继承JFrame
public TEST02(String title)
{
JFrame jf = new JFrame(title);
Container conn = jf.getContentPane(); //得到窗口的容器
JLabel L1 = new JLabel("Hello,world!"); //创建一个标签 并设置初始内容
conn.add(L1); //向容器中加入标签
jf.setBounds(200,200,300,200); //设置窗口的属性 窗口位置以及窗口的大小
jf.setVisible(true);//设置窗口可见
jf.setDefaultCloseOperation(DISPOSE_ON_CLOSE); //设置关闭方式 如果不设置的话 似乎关闭窗口之后不会退出程序
}
public static void main(String[] args) {
new TEST02("窗口"); //创建窗口
}
}
（2）面板
JavaSwing_4.2: JDialog（对话框）
JPanel：面板组件，非顶层容器。
一个界面只可以有一个JFrame窗体组件，但是可以有多个JPanel面板组件，而JPanel上也可以使用FlowLayout，BorderLayout，GridLayout等各种布局管理器，这样可以组合使用，达到较为复杂的布局效果。
import java.awt.*;
import javax.swing.*;
public class TEST02 extends JFrame{
//定义组件
JPanel jp1,jp2;//定义两个面板
JButton jb1,jb2,jb3,jb4,jb5,jb6;//定义按钮
public static void main(String[] args) {
TEST02 dm=new TEST02();
}
//构造函数
public TEST02()
{
//创建组件
//面板组件JPanel布局模式默认的是流式布局FlowLayout
//实例化面板
jp1=new JPanel();
jp2=new JPanel();
//实例化按钮
jb1=new JButton("西瓜");
jb2=new JButton("苹果");
jb3=new JButton("荔枝");
jb4=new JButton("葡萄");
jb5=new JButton("橘子");
jb6=new JButton("香蕉");
//设置布局，JPanel默认布局FlowLayout,
//把组件添加JPanel
jp1.add(jb1);
jp1.add(jb2);
jp2.add(jb3);
jp2.add(jb4);
jp2.add(jb5);
//把JPanel加入到JFrame，采用流式布局，将按钮放在不同的位置
this.add(jp1,BorderLayout.NORTH);
this.add(jb6,BorderLayout.CENTER);
this.add(jp2,BorderLayout.SOUTH);
//设置窗口属性
this.setSize(300,200);
this.setLocation(700,500);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setResizable(false);
this.setVisible(true);
}
}
（3） 对话框
JavaSwing_3.1: JPanel（面板）
- 显示一个错误对话框:
JOptionPane.showMessageDialog(null, "这是内容 ", "这是标题 ", JOptionPane.ERROR_MESSAGE);
- 显示一个信息面板，其 options 为 "yes/no ":
JOptionPane.showConfirmDialog(null, "这是内容", "这是标题", JOptionPane.YES_NO_OPTION);
- 显示一个警告对话框，其 options 为 OK、CANCEL:
Object[] options = { "OK ", "CANCEL " };
JOptionPane.showOptionDialog(null, "这是内容 ", "这是标题 ", JOptionPane.DEFAULT_OPTION,
JOptionPane.WARNING_MESSAGE,null, options, options[0]);
- 显示一个要求用户键入 String 的对话框：
//String inputValue = JOptionPane.showInputDialog( "请输入你的内容:");
JOptionPane.showInputDialog( "请输入你的内容:");
- 显示一个要求用户选择 String 的对话框：
Object[] possibleValues = { "First ", "Second ", "Third " };
Object selectedValue = JOptionPane.showInputDialog(null, "这是内容", "这是标题",
JOptionPane.INFORMATION_MESSAGE, null, possibleValues, possibleValues[0]);
- 这是一个简单的消息框:
JOptionPane.showMessageDialog(null, "这是一个简单的消息框");
- 这是一个可供用户输入信息的对话框:
JOptionPane.showInputDialog(null, "这是一个可供用户输入信息的对话框");
- 这是个简单的警告框:
JOptionPane.showMessageDialog(null, "这是内容", "这是标题",JOptionPane.WARNING_MESSAGE);
JOptionPane有三种参数设置类型
JOptionPane.showMessageDialog有三种参数设置
JOptionPane.showMessageDialog(parentComponent, message);
JOptionPane.showMessageDialog(parentComponent, message, title, messageType);
JOptionPane.showMessageDialog(parentComponent, message, title, messageType, icon);
参数说明
parentComponent: 是对话框所在容器
message：是提示消息
title：是消息提示框的标题
messageType:是消息类型
icon：自定义图标
（二）布局管理
通常，组件放在容器中，组件在容器（比如JFrame）中的位置和大小是由布局管理器来决定的。所有的容器都会使用一个布局管理器，通过它来自动进行组件的布局管理。使用布局管理器， 可以有序的排列组件，而且当窗体发生变化时，布局管理器很根据新版面来适配窗口大小。
java共提供了五种布局管理器：流式布局管理器(FlowLayout)、边界布局管理器(BorderLayout)、网格布局管理器(GridLayout)、卡片布局管理器(CardLayout)、网格包布局管理器(GridBagLayout)。其中前三种是最常见的布局管理器。 默认布局是Java窗体程序设计是自带的布局。
- 边框布局
JavaSwing_1.7: BorderLayout（边界布局）
边框布局将整个面板划分为东西南北中五个部分，允许为每个组件选择一个放置位置，可以选择将组件放在面板的上北（NORTH）、下南（SOUTH）、左西（WEST）、右东（EAST），中（CENTER）五个地方，边框布局可以扩展组件的大小以填充可用空间。
import javax.swing.*;
import java.awt.*;
public class TEST02 extends JFrame {
JPanel p=new JPanel();
public TEST02(){
**setLayout(new BorderLayout(5,5));//定义边界布局**
setFont(new Font("Helvetica", Font.PLAIN, 14));//定义字体
//在面板中加入按钮，且定义按钮的位置
getContentPane().add("North", new JButton("North"));
getContentPane().add("South", new JButton("South"));
getContentPane().add("East", new JButton("East"));
getContentPane().add("West", new JButton("West"));
//设置面板为流式布局居中显示，组件横、纵间距为5个像素
p.setLayout(new FlowLayout(1,5,5));
//使用循环加入button，注意每次加入的button对象名称都是b
//但button每次均是用new新生成的，全部代表不同的button对象。
for(int i=1;i<10;i++){
//String.valueOf(i)，将数字转换为字符串
JButton b=new JButton(String.valueOf(i));
p.add(b); //将button加入到面板中
}
getContentPane().add("Center",p); //将面板加入到中间位置
}
public static void main(String args[]) {
TEST02 f = new TEST02();
//定义边框
f.setTitle("边界布局");
f.setSize(300, 300); // 定义组件大小
f.setVisible(true);
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setLocationRelativeTo(null); //让窗口居中显示
}
}
运行结果如下：
- 网格布局
JavaSwing_1.2: GridLayout（网格布局）
GridLayout 类是一个布局处理器，它以矩形网格形式对容器的组件进行布置。容器被分成大小相等的矩形，一个矩形中放置一个组件。
1.使容器中的各组件呈M行×N列的网格状分布。M，N为布局的行数和列数
2. 网格每列宽度相同，等于容器的宽度除以网格的列数。网格每行高度相同，等于容器的高度除以网格的行数。
3. 各组件的排列方式为：从上到下，从左到右。
容器大小改变时，组件的相对位置不变，大小会改变。
4. 设置行数和列数时，行数或者列数可以有一个为零。(即不限)
若rows为0，cols为3，则列固定为3，行不限，每行只能放3个
若cols为0，rows为3，则行固定为3，列不限，每行必定有控件、
5. 假设你有13个控件，你又设置了三行，一行五个，你觉得第三行应该有多少个？
并且如果组件数量超过设定的个数，布局管理器会自动增加网格个数，原则是保持行数不变。就是
假设还是13个控件，你设置了两行，一行五个，放不下系统就给加了行，第三行放多出来的三个）
import java.awt.BorderLayout;
import java.awt.Button;
import java.awt.Container;
import java.awt.FlowLayout;
import java.awt.GridLayout;
import javax.swing.*;
public class TEST02 extends JFrame{
private static final long serialVersionUID = 1L;
public TEST02(){
this.setTitle("test");
Container con = this.getContentPane(); //定义容器
this.setLayout(new GridLayout(7,3,5,5)); //设置7行3列垂直水平间隔为5
for (int i=0;i<20;i++){ //定义多个按钮的方法
con.add(new JButton("Button"+i)); //20个按钮
}
this.setVisible(true);
this.setBounds(50, 50, 500, 500);
}
public static void main(String[] args) {
new TEST02();
}
}
运行结果如下：
- 流式布局
JavaSwing_1.1: FlowLayout（流式布局）
使用FlowLayout布局方式的容器中组件按照加入的先后顺序按照设置的对齐方式（居中、左对齐、右对齐）从左向右排列，一行排满（即组件超过容器宽度后）到下一行开始继续排列。
Java图形化界面设计——布局管理器之FlowLayout（流式布局）
可以用FlawLayout（）用来定义流式布局，布局方式默认为居中对齐，默认的数值和水平间隙为五个单位。FlowLayout（int align）可用来定义布局方式为指定方式，默认竖直和水平间隙为五个单位。
FlowLayout(int align, int hgap, int vgap)
创建一个新的流布局管理器，它具有指定的对齐方式以及指定的水平和垂直间隙。
注意：
align=0:表示每一行组件将按照左对齐排列
align=1:表示每一行组件将按照居中对齐排列
align=2:表示每一行组件将按照右对齐排列
import java.awt.FlowLayout;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;
public class TEST02 extends JFrame {
private JPanel contentPane;//定义容器
public TEST02() {
this.contentPane=new JPanel();//创建内容面板
contentPane.setBorder(new EmptyBorder(5,5,5,5));//设置面板的边框
setContentPane(contentPane);//应用内容面板
contentPane.setLayout(new FlowLayout(FlowLayout.CENTER,5,5));//设置内容面板的布局管理器为流式布局
for(int i=1;i<10;i++){//定义按钮
contentPane.add(new JButton("按钮"+i));
}
setTitle("流式布局");//设置窗体的标题
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//设置窗体退出时操作
setBounds(100, 100, 300, 150);//设置窗体位置和大小
setVisible(true);//设置窗体可见
}
public static void main(String[] args) {
TEST02 example = new TEST02();
}
}
运行结果如下：
混合布局程序一：
import java.awt.*;
import javax.swing.*;
/*
*frame是窗体，使用默认的borderLayout布局
*panelup 以及panelbottom将窗体分割成上下两个部分 分别占领CENTER区域以及 SOUTH区域
**panelup 使用GridLayout布局 2*2 右边再嵌入两个小面板 smallpanel1 以及 smalplanel2
**smallpanel1以及 smallpanel2使用flowLayout布局使得输入框不会被撑开
*panelbuttom 使用FlowLayout 布局直接收纳三个button控件
*/
public class TEST02
{
public static void main(String args[]){
//定义窗体
JFrame frame =new JFrame();
frame.setSize(300,150);
JPanel panelup=new JPanel();
JPanel panelbottom=new JPanel();
//定义布局，将两个面板放在边框布局的两侧
frame.setLayout(new BorderLayout());
frame.add(panelup,BorderLayout.CENTER);
frame.add(panelbottom,BorderLayout.SOUTH);
/*直接用GridLayout会以所有控件中最宽的空间宽为宽
* 最高的控件高为高，输入框会被撑开
*/
//给上面的面板定义布局网格布局
panelup.setLayout(new GridLayout(2,2));
JLabel lusername =new JLabel("用户名:");
JLabel lpasssword=new JLabel("密码:");
/*小面板1 2 别分用来存放 用户名的输入框以及密码的输入框
小面板1 2 内部的布局使用FlowLayout布局*/
JPanel panelsmall1 =new JPanel();
JPanel panelsmall2 =new JPanel();
//加入登录信息
panelup.add(lusername);
panelup.add(panelsmall1);
panelup.add(lpasssword);
panelup.add(panelsmall2);
//定义文本框和密码框
JTextField txtusername=new JTextField(10);
JPasswordField pswfd_password=new JPasswordField(10);
panelsmall1.setLayout(new FlowLayout());
panelsmall1.add(txtusername);
panelsmall2.setLayout(new FlowLayout());
panelsmall2.add(pswfd_password);
//按钮面板定义为流式布局
panelbottom.setLayout(new FlowLayout());
//定义按钮
JButton btnlogin=new JButton("登录");
JButton btnregister=new JButton("注册");
JButton btncancle=new JButton("退出");
//Does cancle mean "clear the textfile" or "close the frame"?
panelbottom.add(btnlogin);
panelbottom.add(btnregister);
panelbottom.add(btncancle);
frame.setVisible(true);
}
}
运行结果如下：
import java.awt.*;
import javax.swing.*;
public class TEST02 extends JFrame{
private JButton[] jb = new JButton[9];//用数组定义按钮
private JPanel jp1, jp2;//定义面板
public static void main(String[] args){
TEST02 demo1 = new TEST02();
}
//构造函数
public TEST02(){
//定义面板1，且使其布局为流式布局
jp1 = new JPanel();
jp1.setLayout(new FlowLayout());
//定义面板2，且使其布局为边界布局
jp2 = new JPanel();
jp2.setLayout(new BorderLayout());
//实例化按钮
jb[0] = new JButton("囚牛");
jb[1] = new JButton("睚眦");
jb[2] = new JButton("嘲风");
jb[3] = new JButton("蒲牢");
jb[4] = new JButton("狻猊");
jb[5] = new JButton("赑屃");
jb[6] = new JButton("狴犴");
jb[7] = new JButton("椒图");
jb[8] = new JButton("貔貅");
//面板1加入五个按钮
jp1.add(jb[0]);
jp1.add(jb[1]);
jp1.add(jb[2]);
jp1.add(jb[3]);
jp1.add(jb[4]);
//面板2加入后四个按钮
jp2.add(jb[5], BorderLayout.CENTER);
jp2.add(jb[6], BorderLayout.NORTH);
jp2.add(jb[7], BorderLayout.WEST);
jp2.add(jb[8], BorderLayout.EAST);
//定义窗体为边界布局，并将面板1和面板2加入边界的上下部分。
setLayout(new BorderLayout());
add(jp1, BorderLayout.NORTH);
add(jp2, BorderLayout.SOUTH);
//定义容器
setTitle("你好啊！");
setSize(300, 200);
setLocation(300, 200);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setResizable(false);
setVisible(true）;
}
}
运行结果如下：
