Java详解:GUI图形用户界面设计—容器组件及面板布局方式
✍功能组件不能独立地显示出来,必须将组件放在一定的容器(container)中才可以显示出来;容器可以容纳多个组件,通过调用容器的add(Component comp)方法向容器中添加组件;窗口(JFrame)和面板(JPanel)是最常用的两个容器。
✎ 简介:
Graphical User Interface(GUI)图形用户界面
图形界面对于用户来说在视觉上更易于接受.
✎ 关于swing:
• swing是一个为java设计的GUI工具包javax.swing,包括了用户界面的各种组件.
• swing中组件可以分为两大类:
容器组件(窗口、面板、对话框)
功能组件(按钮、菜单)
✎ 容器组件:
📌窗口(JFrame)
//继承JFrame类
public class FrameDesign extends JFrame {
//设置操作必须写在构造方法中
public FrameDesign() {
this.setSize(400, 400);//设置窗口大小
this.setTitle("登录界面"); //设置标题
this.setLocationRelativeTo(null); //居中位置
this.setResizable(false); //设置窗口不可调整大小
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//关闭窗口并退出程序运行
this.setVisible(true); //让窗口显示出来(放在设置最后一行)
}
public static void main(String[] args) {
new FrameDesign();//创建FrameDesign类对象
}
}
📖 代码解释:
⑴ 首先我们创建一个类并继承JFrame类,JFrame类用来创建窗体
⑵ 创建类的构造方法,在构造方法中对窗口进行设置
设置窗口的常用方法:
void setSize(int width, int height) //设置窗口大小
void setVisible(boolean b) //设置是否可见(通常为可见, 且放在设置的最后一行)
void setTitle(String title) //设置标题
void setResizable(boolean resizable) //设置窗口是否可调整大小(通常为不可调整)
void setLocation(int x,int y) //设置窗口位置(不常用, 通常使用居中)
void setLocationRelativeTo(null) //窗口居中 (常用)
void setDefaultCloseOperation(int operation) //设置窗口的关闭操作(通常设置为关闭窗口并退出程序运行,即JFrame.EXIT_ON_CLOSE)
运行结果:
📌面板(JPanel)
• 创建一个面板并上色 ( 面板为轻量级容器,需在窗口基础之上添加 )
JPanel panel =new JPanel();//创建面板
panel.setBackground(Color.CYAN);//设置背景
this.add(panel);//将面板添加到窗口中
• 我们还可以通过new Color的方式自定义颜色
• 面板为轻量级的容器且面板可以布局
• 布局方式分为三大类:
• FlowLayout(流式布局) • BorderLayout(边界布局) • GridLayout(网格布局)
○ 流式布局FlowLayout
• 流式布局也是默认的布局方式,组件在面板上从左到右,从上到下排列.
• 流式布局默认水平居中且不影响组件大小.
📖代码解释:
面板是轻量级的容器,所以需要添加到窗口上,我们创建面板(JPanel)后,通过创建5个按钮组件来体验下不同的布局方式的效果。
import javax.swing.*;
import java.awt.*;
//继承JFrame类
public class FrameDesign extends JFrame {
//设置操作必须写在构造方法中
public FrameDesign() {
this.setSize(400, 400);//设置窗口大小
this.setTitle("登录界面"); //设置标题
this.setLocationRelativeTo(null); //居中位置
this.setResizable(false); //设置窗口不可调整大小
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//关闭窗口并退出程序运行
JPanel panel =new JPanel(new FlowLayout());
JButton button1 =new JButton("按钮1");
JButton button2 =new JButton("按钮2");
JButton button3 =new JButton("按钮3");
JButton button4 =new JButton("按钮4");
JButton button5 =new JButton("按钮5");
panel.add(button1);
panel.add(button2);
panel.add(button3);
panel.add(button4);
panel.add(button5);
this.add(panel);//将面板添加到窗口中
this.setVisible(true); //让窗口显示出来(放在设置最后一行)
}
public static void main(String[] args) {
new FrameDesign();//创建FrameDesign类对象
}
}
○ 边界布局BorderLayout
• 共有5个区域(上下左右中) 中间不能少
若其余(除中间之外)位置没有指明,中间位置的组件会对其进行填充
📖代码解释:
我们通过改变JPanel构造方法中的布局类型,改为BorderLayout,并且在添加时指明具体的位置(上下左右中),其余代码和上面流式布局代码一样.
JPanel panel =new JPanel(new BorderLayout());
JButton button1 =new JButton("按钮1");
JButton button2 =new JButton("按钮2");
JButton button3 =new JButton("按钮3");
JButton button4 =new JButton("按钮4");
JButton button5 =new JButton("按钮5");
panel.add(button1,BorderLayout.NORTH);//添加时指明位置
panel.add(button2,BorderLayout.SOUTH);
panel.add(button3,BorderLayout.WEST);
panel.add(button4,BorderLayout.EAST);
panel.add(button5,BorderLayout.CENTER);//中间不能省略
○ 网格布局GridLayout
• 我们可以对网格的进行行列设置
📖代码解释:
相比上面的流式布局代码,我们只需改变JPanel构造方法中的布局类型即可(将FlowLayout改为GridLayout),并且我们可以设置网格的行列数.
JPanel panel =new JPanel(new GridLayout(5, 1));//5行1列
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
所有评论(0)