JavaSE基础篇

23. GUI图形用户界面

2022-08-04  本文已影响0人  一直流浪

参考链接： https://blog.csdn.net/qq_42035966/article/details/82258199#5.插件介绍WindowBuilder

1、GUI的介绍

1.1 GUI概述

早期，电脑向用户提供的是单调、枯燥、纯字符状态的“命令行界面（CLI）”。就是到现在，我们还可以依稀看到它们的身影：在Windows中开个DOS窗口，就可看到历史的足迹。后来，Apple公司率先在电脑的操作系统中实现了图形化的用户界面（Graphical User Interface，简称GUI），但由于Apple公司封闭的市场策略，自己完成电脑硬件、操作系统、应用软件一条龙的产品，与其它PC不兼容。这使得Apple公司错过了一次一统全球PC的好机会。

后来，Microsoft公司推出了风靡全球的Windows操作系统，它凭借着优秀的图形化用户界面，一举奠定了操作系统标准的地位。这也造就了世界首富---比尔.盖茨和IT业的泰山北斗微软公司。

在这图形用户界面风行于世的今天，一个应用软件没有良好的GUI是无法让用户接受的。而Java语言也深知这一点的重要性，它提供了一套可以轻松构建GUI的工具。在本章和下一章中，我们将向你充分证明这一点。

1.2 Java提供了三个主要包做GUI开发：

java.awt 包 – 主要提供字体/布局管理器

javax.swing 包[商业开发常用] – 主要提供各种组件(窗口/按钮/文本框)

java.awt.event 包 – 事件处理，后台功能的实现。

2、Swing组件

如图所示：swing组件主要可分为三个部分，后面会详细介绍

（1）顶层容器:：常用有JFrame，JDialog

（2）中间容器：JPanel，JOptionPane，JScrollPane，JLayeredPane 等，主要以panel结尾。

（3）基本组件：JLabel，JButton，JTextField，JPasswordField，JRadioButton 等。

2.1 顶层容器

image.png

顶层容器

JFrame组件在javax.swing.JFrame

2.2 中间容器

image.png

中间容器

2.3 基本组件

image.png

基本组件

3、组件API介绍

3.1 JFrame组件(一般需要继承JFrame类)

JFrame常用方法：

  1. public void setTitle(String title) 设置窗体标题
  2. public void setBounds(int a,int b,int width,int height)设置窗口的初始位置是(a,b),即距屏幕左面a个像素，距屏幕上方b个像素，窗口的宽是width,高是height。
  3. public void setSize(int width,int height)设置窗口的大小。
  4. public void setLocation(int x,int y)设置窗口的位置，默认位置是(0,0)。
  5. public void setVisible(boolean b)设置窗口是否可见，窗口默认是不可见的。
  6. public void setResizable(boolean b)设置窗口是否可调整大小，默认可调整大小。
  7. public void dispose()撤销当前窗口，并释放当前窗口所使用的资源。
  8. public Container getContentPane() 获得当前窗体的内容面板
  9. void dispose()释放当前窗体及其所有子组件所占用的资源。
  10. void repaint()从新绘制当前窗体。
  11. public void setExtendedState(int state)设置窗口的扩展状态，其中参数state取JFrame类中的下列类常量:
  1. public void setDefaultCloseOperation(int operation)该方法用来设置单击窗体右上角的关闭图标后，程序会做出怎样的处理，其中的参数operation取JFrame类中的下列int型static常量，程序根据参数operation取值做出不同的处理:

代码演示：

//创建一个窗口

import javax.swing.JFrame;

public class JFrameDemo extends JFrame{
    public static void main(String[] args) {
        //创建JFrame对象
        JFrame jFrame1 = new JFrame("第一个JFrame窗口");
        
        //设置窗口的大小
        jFrame1.setSize(720,680);
        
        //设置窗口显示位置
        jFrame1.setLocation(500,200);
        
        //设置窗口大小可调整
        jFrame1.setResizable(true);
        
        //设置窗口拓展延水平方向最大化
        jFrame1.setExtendedState(MAXIMIZED_HORIZ);
        
        //设置关闭窗口的操作为什么都不做
        jFrame1.setDefaultCloseOperation(DO_NOTHING_ON_CLOSE);
        
        //设置窗口可视化，一般放在最后一步
        jFrame1.setVisible(true);
    }
}

结果：

image.png

3.2 JPanel组件

JPanel常用方法：

  1. public Component add(Component comp)设置面板的背景色
  2. public void setLayout(LayoutManager mgr)设置面板的布局 ，选null为空布局，下面会讲几种常用的布局。
  3. public Component add(Component comp)向面板中添加组件
  4. public void setLayout(LayoutManager mgr)向面板中指定位置添组件
  5. public void remove(Component comp)移除指定组件
  6. public void removeAll()移除面板上所有组件
  7. public void repaint() 重新绘制

代码演示：

//JPanel组件的使用

import javax.swing.JFrame;
import java.awt.*;
import javax.swing.JPanel;

public class JPanelDemo extends JFrame {

    public JPanelDemo() {
        this.init();
    }

    public static void main(String[] args) {
        JPanelDemo frameDemo = new JPanelDemo();
    }

    private void init() {

        // 获取当前的内容面板
        Container container = this.getContentPane();

        // 设置布局为空布局
        setLayout(null);

        // 创建JPanel组件面板
        JPanel jPanel = new JPanel();

        // 设置JPanel组件面板大下小
        jPanel.setSize(540, 420);

        jPanel.setBackground(new Color(86,182,255));

        jPanel.setLocation(0, 0);
        container.add(jPanel);

        // 设置窗口可视化，一般放在最后一步
        this.setDefaultCloseOperation(EXIT_ON_CLOSE);
        this.setTitle("登录界面");
        this.setSize(540, 420);
        this.setVisible(true);
    }
}

结果：

image.png

3.3 Container容器

Container类通常用于操作JFrame的内容面板

常用方法：

  1. public void setBackground(Color bg)设置背景色
  2. public void setLayout(LayoutManager mgr)设置容器的布局
  3. public Component add(Component comp)往容器中添加组件
  4. public Component add(Component comp, int index)往容器的指定位置添加组件‘
  5. public void remove(Component comp)移除指定的组件
  6. public void removeAll()移除所有的组件
  7. public void repaint()重新绘制

3.3 JButton组件

JButton常用方法：

  1. public void setText(String text)设置按钮上的文本
  2. public String getText()获取按钮上的文本
  3. public void setBackground(Color bg)设置按钮的背景色
  4. public Color getBackground()获取按钮的背景色
  5. public void setEnabled(boolean b)设置按钮的启用或禁用
  6. public void setVisible(boolean b)设置按钮是否可见
  7. public void setToolTipText(String text)设置按钮悬停的提示信息
  8. public void setMnemonic(int mnemonic)设置按钮的快捷键
  9. public void addActionListener(ActionListener al)增加对按钮对象的事件监听

3.4 JLabel组件

JLabel常用方法：

  1. public void setText(String text) 设置标签上的文本
  2. public String getText()获得标签上的文本
  3. public void setIcon(Icon icon)设置标签中的图像
  4. public Icon getIcon()获得标签中的图像
  5. public void setHorizontalAlignment(int alignment)设置标签中文本的对齐方式 alignment -一个中所定义的以下常量 SwingConstants ： LEFT ， CENTER （仅用于图像的标签的默认值）， RIGHT ， LEADING （默认为纯文本的标记），或 TRAILING 。
  6. public void setVisible(boolean b)设置标签是否可见
  7. public void setFont(Font f)设置标签对象的字体

3.5 JTextField组件

JTextField的常用方法 ：

  1. public void setText(String text)设置文本框的文本
  2. public String getText()获得文本框中的文本
  3. public void setHorizontalAlignment(int alignment)设置文本框的文本对齐方式。

  1. public void setEditable(boolean b)设置文本框是否可以编辑

  2. public void setEnabled(boolean enabled)设置文本框的启用或禁用

  3. public void setVisible(boolean b)设置文本框是否可见

  4. public int getColumns()获取文本域的宽度

  5. public void setColumns(int columns)设置文本域的宽度

  6. public void setEchoChar(char c)设置文本域的回显字符为c，比如输入密码的输入框，设置回显字符为*

  7. public void addActionListener(ActionListener al) 添加对文本框的监听器，由按Enter键触发

3.6 JTextArea 组件

JTextArea的常用方法：

  1. void setText(String text)
  2. String getText()
  3. void setFont(Font font)
  4. void setLineWrap(boolean wrap)
  5. void setTabSize(int size)
  6. void append(String str) 在原文本尾添加字符串str
  7. int getColumns()获取文本区的列数
  8. int getRows()获取文本区的行数
  9. void setEditable(boolean b)设置文本区是否可以编辑

4、布局管理器

几种常见的布局：

  1. 流式布局 java.awt.FlowLayout
  2. 边界布局 java.awt.BorderLayout
  3. 网格布局 java.awt.GridLayout
  4. 卡片布局 Java.awt.CardLayout
  5. 网袋布局管理器 Java.awt.GridBagLayout

4.1 流式布局（FlowLayout）

流式布局（FlowLayout）是最基本的一种布局，容器缺省的布局就是流式布局。

流式布局是值把图形元素一个接一个的放在容器中，按照组件加入的先后顺序从左到右排列，当一行排列满后就转到下一行继续从左到右排列。

构造方法：

静态属性：

常用方法：

  1. int getAlignment()获取对齐方式
  2. int getHgap()获取水平间隙
  3. int getVgap()获取垂直间隙
  4. void setAlignment(int align)设置对齐方式
  5. void setHgap(int hgap)设置水平间隙
  6. void setVgap(int vgap)设置垂直间隙

代码演示：

package com.company.project.sample.s1;

import java.awt.Button;
import java.awt.FlowLayout;

import javax.swing.JFrame;

public class FlowLayoutDemo extends JFrame {

    Button bt1 = new Button("A");
    Button bt2 = new Button("B");
    Button bt3 = new Button("C");
    Button bt4 = new Button("D");
    Button bt5 = new Button("E");
    Button bt6 = new Button("F");

    public void init() {
        //初始化流式布局（向左对齐，水平间距为20，垂直间距为30）
        FlowLayout flowLayout = new FlowLayout(FlowLayout.LEFT, 20, 30);
        
        //设置布局为流式布局
        setLayout(flowLayout);
        
        add(bt1);
        add(bt2);
        add(bt3);
        add(bt4);
        add(bt4);
        add(bt5);
        add(bt6);
        this.setSize(200, 200);
        this.setVisible(true);
    }

    public static void main(String[] args) {
        FlowLayoutDemo flowLayoutDemo = new FlowLayoutDemo();
        flowLayoutDemo.init();
    }
}

结果：

image.png

4.2 边界布局（BorderLayout）

边界布局（BorderLayout）将窗口区域分为东、南、西、北和中央五个区域，在窗口边缘是四个狭窄的、固定宽度的区域，中间为一个大的区域。

构造方法：

静态属性：

成员方法：

代码演示：

package com.company.project.sample.s1;

import java.awt.BorderLayout;
import java.awt.Button;
import java.awt.FlowLayout;
import java.awt.Label;

import javax.swing.JFrame;

public class BorderLayoutDemo extends JFrame {

    Button bt1 = new Button("北");
    Button bt2 = new Button("西");
    Button bt3 = new Button("东");
    Button bt4 = new Button("南");

    Label label = new Label("中");

    public void init() {
        // 初始化边界布局
        BorderLayout borderLayout = new BorderLayout(10, 10);

        // 设置布局为边界布局
        setLayout(borderLayout);

        add(bt1, BorderLayout.NORTH);
        add(bt2, BorderLayout.WEST);
        add(bt3, BorderLayout.EAST);
        add(bt4, borderLayout.SOUTH);
        add("Center", label);

        this.setSize(200, 200);
        this.setVisible(true);
    }

    public static void main(String[] args) {
        BorderLayoutDemo borderLayoutDemo = new BorderLayoutDemo();
        borderLayoutDemo.init();
    }
}

结果：

image.png

4.3 网格布局（GridLayout）

GridLayout类是一个布局管理器，它将一个容器的组件放在矩形网格中。 容器被分成等大小的矩形，并且每个矩形中放置一个组件。

构造方法:

成员方法：

代码演示：

package com.company.project.sample.s1;

import java.awt.*;
import java.applet.Applet;

public class GridLayoutDemo extends Applet {
    public void init() {
        setLayout(new GridLayout(3, 2));
        add(new Button("1"));
        add(new Button("2"));
        add(new Button("3"));
        add(new Button("4"));
        add(new Button("5"));
        add(new Button("6"));
    }
}

结果：

image.png

5、面板Panel类

5.1 概述

在设计用户界面时，为了更加合理的安排各组件在窗口的位置，可以考虑将所需组件先安排在一个容器中，然后再将其作为一个整体加入另一个容器。

Panel类是这样一个被称为面板的容器类，它是一种无边框的，不能移动、放大、缩小或关闭的容器。

5.2 用途

Panel对象不能作为最底层的容器，也不能指定大小。

Panel总是作为一个容器组件被加入到Applet或Frame等其他容器，也可以加入到其他的Panel容器中，形成复杂的图形界面系统。

5.3 用法

首先创建Panel的对象，然后设置对象的布局 格式，即设置Panel容器的布局，设置方法在与Applet容器中的设置一样，只是需要使用Panel对象的setLayout()方法，并使用Panel对象的add()方法往Panel容器加入组件。

5.4 代码案例

package com.company.project.sample.s1;

import java.applet.Applet;
import java.awt.*;

public class AppletPanelCalc extends Applet {
    public void init() {
        setLayout(new BorderLayout());
        add("North", new Button("按钮北"));
        add("West", new Button("按钮西"));
        add("South", new Button("按钮南"));
        add("East", new Button("按钮东"));

        Panel panel = new Panel();
        panel.setLayout(new GridLayout(3, 3));
        for (int i = 1; i < 10; i++) {
            panel.add(new Button((new Integer(i)).toString()));
        }
        add("Center", panel);
    }
}

结果：

image.png

还有一些Swing基本组件，这里就不一一列举了！！！

6、事件处理

6.1 监听器的概述

监听器，字面上的理解就是监听观察某个事件（程序）的发生情况，当被监听的事件真的发生了的时候，事件发生者（事件源） 就会给注册该事件的监听者（监听器）发送消息，告诉监听者某些信息，同时监听者也可以获得一份事件对象，根据这个对象可以获得相关属性和执行相关操作。

监听器模型涉及以下三个对象：

（1）事件：用户对组件的一个操作，或者说程序执行某个方法，称之为一个事件，如机器人程序执行工作。 （2）事件源：发生事件的组件就是事件源，也就是被监听的对象，如机器人可以工作，可以跳舞，那么就可以把机器人看做是一个事件源。 （3）事件监听器（处理器）：监听并负责处理事件的方法，如监听机器人工作情况，在机器人工作前后做出相应的动作，或者获取机器人的状态信息。

执行顺序如下：

1、给事件源注册监听器。 2、组件接受外部作用，也就是事件被触发。 3、组件产生一个相应的事件对象，并把此对象传递给与之关联的事件处理器。 4、事件处理器启动，并执行相关的代码来处理该事件。

监听器模式：事件源注册监听器之后，当事件源触发事件，监听器就可以回调事件对象的方法；更形象地说，监听者模式是基于：注册-回调的事件/消息通知处理模式，就是被监控者将消息通知给所有监控者。

1、注册监听器：事件源.setListener。 2、回调：事件源实现onListener。

image.png

代码案例：

package com.company.project.sample.s1;

import java.applet.Applet;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JTextField;

@SuppressWarnings("serial")
public class Calc extends Applet implements ActionListener {
    JTextField jTextField;
    Button[] buttons = new Button[9];

    public void init() {
        setLayout(new BorderLayout());
        jTextField = new JTextField();
        add("North", jTextField);

        Panel panel = new Panel();
        panel.setLayout(new GridLayout(3, 3));

        for (int i = 0; i < 9; i++) {
            buttons[i] = new Button((new Integer(i + 1)).toString());
            buttons[i].addActionListener(this);
            panel.add(buttons[i]);
        }
        add("Center", panel);
    }

    @Override
    public void actionPerformed(ActionEvent e) {
        // TODO Auto-generated method stub
        for (int i = 0; i < 9; i++) {
            if (e.getSource() == buttons[i]) {
                jTextField.setText(jTextField.getText() + (i + 1));
            }
        }
    }
}

结果：

image.png
上一篇 下一篇

猜你喜欢

热点阅读