GUI 基础应用

1.GUI概述
目前,我们编写的程序都是基于控制台的程序

GUI（Graphical User Interface）即图形用户界面，它能够使应用程序看上去更加友好

2.Swing概念
位于javax.swing

Swing是纯java组件,使得应用在不同平台中有相同的外观和行为

3.什么是组件,容器?
java的图形用户界面的基本组成是组件,组件是一个以图形化的方式显示在屏幕上,并且能和用户进行交互的对象

组件不能单独的显示出来,所以必须放在一定的容器(container)中,才可以显示出来

容器可以添加多个组件,可以通过调用容器的add()方法,向容器中添加不同的组件

4组件的分类:
窗口(Frame)和面板(Panel)称为容器组件

文本输入框(JTextField),按钮(Button)称为功能组件

5.图形用户界面的编程步骤:
我们在创建一个图形用户界面时首先要创建一个窗口,通常使用 JFrame在Swing程序中创建一个窗口

在窗口中可以添加面板,通常使用 Jpanel在已经创建好的窗口中再创建面板,一个窗户口中可以创建多个面板

在面板中可以添加不同的组件,也可以设置布局,我们一般使用嵌套的方式来实现布局

创建一个窗口的演示,及常用方法:
import javax.swing.*;

public class JFrameDemo1 extends JFrame {

public JFrameDemo1(){

    this.setSize(500,300);   //设置窗口的大小
    this.setLocationRelativeTo(null);  //设置窗口居中显示
    this.setTitle("登录界面");   //设置窗口标题
    this.setIconImage(new ImageIcon("微信图片_20211117191028.jpg").getImage());   //设置窗口图标,需要将图片直接复制到项目下面,不能放在包中
    
}
public static void main(String[] args) {

   JFrame jFrame = new JFrameDemo1();   //使用JFrame创建一个窗口对象
}

}

有四种布局

方式:
FlowLayout
//流式布局,即一种横向的布局,以行为基础,逐个进行组件的排列,当一行排列满时,自动排列到下一行
流式布局示例:

package javaGUI;

import javax.swing.;
import java.awt.;

public class JFrameDemo2_1 extends JFrame {

public JFrameDemo2_1(){

    this.setSize(500,300);
    this.setLocationRelativeTo(null);
    this.setTitle("登录界面");
    this.setIconImage(new ImageIcon("微信图片_20211117191028.jpg").getImage());
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    this.setResizable(false);

    JPanel jp = new JPanel();   //使用JPanel创建一个面板

    jp.setLayout(new FlowLayout(FlowLayout.LEFT));  //创建一个匿名流式布局的对象
    JButton jButton1 = new JButton("按钮1");   //使用JButton创建一个按钮对象
    JButton jButton2 = new JButton("按钮2");
    JButton jButton3 = new JButton("按钮3");
    JButton jButton4 = new JButton("按钮4");
    jp.add(jButton1);
    jp.add(jButton2);
    jp.add(jButton3);
    jp.add(jButton4);
    this.add(jp);
    this.setVisible(true);

}
public static void main(String[] args) {

   JFrame jFrame = new JFrameDemo2_1();
   
}

}

BorderLayout //边界布局,一种以东南西北和中间为布局的方式
边界布局示例:

package javaGUI;

import javax.swing.;
import javax.swing.border.Border;
import java.awt.;

public class JFrameDemo2_2 extends JFrame {

public JFrameDemo2_2(){

    this.setSize(500,300);
    this.setLocationRelativeTo(null);
    this.setTitle("登录界面");
    this.setIconImage(new ImageIcon("微信图片_20211117191028.jpg").getImage());
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    this.setResizable(false);

    JPanel jp = new JPanel();
    jp.setLayout(new BorderLayout());   //使用BorderLayout()创建一个边界布局方式的匿名对象
    JButton jButton1 = new JButton("按钮1");
    JButton jButton2 = new JButton("按钮2");
    JButton jButton3 = new JButton("按钮3");
    JButton jButton4 = new JButton("按钮4");
    JButton jButton5 = new JButton("按钮5");
    jp.add(jButton1, BorderLayout.NORTH);   //分别设置每一个按钮的位置
    jp.add(jButton2, BorderLayout.EAST);
    jp.add(jButton3, BorderLayout.SOUTH);
    jp.add(jButton4, BorderLayout.WEST);
    jp.add(jButton5, BorderLayout.CENTER);

    this.add(jp);
    this.setVisible(true);
}
public static void main(String[] args) {

   JFrame jFrame = new JFrameDemo2_2();
}

}

GridLayout //网格布局,一种以网格形式布局的方式
网格布局示例:

package javaGUI;

import javax.swing.;
import java.awt.;

public class JFrameDemo2_3 extends JFrame {

public JFrameDemo2_3(){

    this.setSize(500,300);
    this.setLocationRelativeTo(null);
    this.setTitle("登录界面");
    this.setIconImage(new ImageIcon("微信图片_20211117191028.jpg").getImage());
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    this.setResizable(false);

    JPanel jp = new JPanel(new GridLayout(2,2));   //使用GridLayout(),创建一个网格布局的方式,括号中为所需的行列数
    JButton jButton1 = new JButton("按钮1");
    JButton jButton2 = new JButton("按钮2");
    JButton jButton3 = new JButton("按钮3");
    JButton jButton4 = new JButton("按钮4");
    jp.add(jButton1);
    jp.add(jButton2);
    jp.add(jButton3);
    jp.add(jButton4);
    this.add(jp);
    this.setVisible(true);
}
public static void main(String[] args) {

   JFrame jFrame = new JFrameDemo2_3();
}

}

setLayout(null); //自定义位置,即自己定义组件的位置
自定义布局示例:

package javaGUI;

import javax.swing.;
import java.awt.;

public class JFrameDemo2_4 extends JFrame {

public JFrameDemo2_4(){

    this.setSize(500,300);
    this.setLocationRelativeTo(null);
    this.setTitle("登录界面");
    this.setIconImage(new ImageIcon("微信图片_20211117191028.jpg").getImage());
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    this.setResizable(false);
    this.setLayout(null);
    
    //自定义布局方式,需要使用原始的窗口进行布局
    Container container = this.getContentPane();
    JButton jButton2 = new JButton("按钮2");
    //两面两行即为原始窗口的创建方式
    jButton2.setLocation(100,50);
    jButton2.setSize(80,50);
    container.add(jButton2);
    this.setVisible(true);
}
public static void main(String[] args) {

   JFrame jFrame = new JFrameDemo2_4();
}

}

Java GUI常用组件介绍

注意:

所有组件创建并设置完成后都必须使用add()方法添加到窗口中,否则无法显示

   jp.add(jButton4);   //将设置好的按钮添加到窗口
    this.add(jp);

JLable(标签) //用来显示文字或图片
JPanel jp = new JPanel();

    jp.setLayout(new FlowLayout(FlowLayout.CENTER));
    JLabel accountLabel = new JLabel("账号");
           accountLabel.setFont(new Font("宋体",Font.BOLD,20));
          // accountLabel.setIcon(new ImageIcon("微信图片_20211117191028.jpg"));
    jp.add(accountLabel);

效果图如下:

JtextField(文本框) //用来输入文字
JTextField accountText = new JTextField(20);
jp.add(accountText);
效果图如下:

JPasswordField(密码框) //用来输入密码
JLabel passwordLabel = new JLabel(“密码”);
passwordLabel.setFont(new Font(“宋体”,Font.BOLD,20));
jp.add(passwordLabel);
JPasswordField jPasswordField = new JPasswordField(20);
jp.add(jPasswordField);
效果图如下:

JTextArea(多行文本框) /用来输入多行文字
JTextArea jTextArea = new JTextArea(5,20);
//滚动面板,可出现滚动条,使多行文本框大小不发生变化
JScrollPane jScrollPane = new JScrollPane(jTextArea);
jp.add(jScrollPane);
效果图如下:

JMenuBar(菜单栏) //用来创建一个菜单栏
JMenuBar jMenuBar = new JMenuBar();
JMenu(菜单) //用来创建一个菜单
JMenu jMenu1 = new JMenu(“文件”);
JMenu jMenu2 = new JMenu(“编辑”);
jMenuBar.add(jMenu1);
jMenuBar.add(jMenu2);
JMenuItem(菜单项) //用来创建菜单项
JMenuItem jMenuItem = new JMenuItem(“新建”);
jMenu1.add(jMenuItem);

Java GUI事件处理

到目前为止我们编写的只是图形用户界面,并没有特殊的功能,想要实现一定的功能必须进行事件处理
当用户与GUI组件进行交互,就会产生事件,比如: 按下一个按钮,点击鼠标等
一.事件处理思路:
一个源（事件源）产生一个事件（事件对象）并把它送到监听器那里，监听器只是简单地等待，直到它收到一个事件，一旦事件被接受，监听器将处理这些事件

一个事件源必须注册监听器以便监听器可以接受关于一个特定事件的通知

二.常用事件处理方式:
为按钮添加事件监听
jButton1.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
String account = jButton1.getText();
String password = new String(jPasswordField.getPassword());
System.out.println(account);
System.out.println(password);
}
});
为鼠标添加事件监听
//添加鼠标事件
jButton1.addMouseListener(new MouseAdapter() { //Adapter为适配器你,使用此方法,可以自己选择需要重写的事件类型,而不需要重写全部的方法
@Override
public void mouseClicked(MouseEvent e) {
System.out.println(“鼠标点击”);
}

        @Override
        public void mousePressed(MouseEvent e) {
            System.out.println("鼠标按下");
        }

        @Override
        public void mouseReleased(MouseEvent e) {
            System.out.println("鼠标释放");
        }

        @Override
        public void mouseEntered(MouseEvent e) {
            System.out.println("鼠标移入");
        }

        @Override
        public void mouseExited(MouseEvent e) {
            System.out.println("鼠标移出");
        }
    });

为键盘添加事件监听
//添加键盘事件
jTextField.addKeyListener(new KeyAdapter() {
@Override
public void keyTyped(KeyEvent e) {
System.out.println(“键盘输入”+e.getKeyCode());
}

        @Override
        public void keyPressed(KeyEvent e) {
            System.out.println("键盘按下");
        }

        @Override
        public void keyReleased(KeyEvent e) {
            System.out.println("键盘释放");
        }
    });

为重置按钮添加事件监听
//为重置按钮添加事件监听
jButton2.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
jTextField.setText(“”);
jPasswordField.setText(“”);
}
})