[PHP知识库]GUI编程

GUI编程

该怎么学？

• 这是什么？
• 它该怎么玩？
• 该如何去在我们平时运用？
• 反编译：把 class –> 可阅读 文件

需要学的东西

组件

• 窗口
• 弹窗
• 面板
• 文本框
• 列表框
• 按钮
• 图片
• 监听事件
• 鼠标
• 键盘事件
• 外挂：java写
• 破解工具

细分两个模块

1、简介

GUI 核心技术 ：Swing AWT

（学java，就是在学一个一个的类）

不流行的原因：

1. 界面不美观
2. 需要 jre 环境！

为什么要学习？

它是 MVC 架构的基础

以后学习MVC的架构，在 GUI 编程里面会发现很多思想

包括 监听器 的思想

1. 可以写出自己心中想要的一些小工具
2. 工作时候，也可能需要维护到 swing 界面，概率极小！
3. 了解 MVC 架构 ，了解监听！

2、AWT

它是 Swing 的前身

它 里面有大量原生的代码，会用得到

它和 Swing 的逻辑十分相似

用 AWT 讲解一些底层的实现

2.1、AWT介绍

java里面万物皆对象

new 类！

AWT 里边有很多一些列的类

AWT：抽象的窗口工具

1. 包含了很多类和接口！

用于 GUI编程

GUI：图形用户界面编程（画窗口的）

Eeclipse：用java写的

2. AWT 里面有各种各样的元素

   元素：窗口，按钮，文本框

3. java.awt 包

   包的位置

   

AWT 知识 和 类！

2.2、组件和容器

1、框架 Frame

package com.kuang.lesson01;

import java.awt.*;

//GUI的第一个页面
    //测试框   TestFrame
public class TestFrame {
    public static void main(String[] args) {

        //Frame对象  怎么用？ 看jdk 看源码！
        Frame frame = new Frame("我的第一个Java图像界面窗口");


        //设置窗口大小
        frame.setSize(400,400);

        //弹出的初始位置
        //定位
        frame.setLocation(200,200);

        //设置背景颜色 需要Color类
//        new Color()
        frame.setBackground(new Color(22, 127, 220));


        //设置大小固定
//            可调整大小
        frame.setResizable(false);

        //需要设置可见性  窗口默认大小 w h
        frame.setVisible(true);

    }
}

问题：发现窗口关闭不掉，解决：停止java程序！

尝试回顾封装，继承：

展示多个窗口

package com.kuang.lesson01;

import java.awt.*;

public class TestFrame2 {
    public static void main(String[] args) {
        //展示多个窗口 new
        MyFrame myFrame1 = new MyFrame(100, 100, 200, 200, Color.blue);
        MyFrame myFrame2 = new MyFrame(300, 100, 200, 200, Color.yellow);
        MyFrame myFrame3 = new MyFrame(100, 300, 200, 200, Color.orange);
        MyFrame myFrame4 = new MyFrame(300, 300, 200, 200, Color.pink);

    }
}

class MyFrame extends Frame{
    static int id = 0; //可能存在多个窗口，我们需要一个计数器

    public MyFrame(int x,int y,int w,int h,Color color){
        super("Myframe"+(++id));//调用父类构造器  每一次新建自增加一
        setBackground(color); //设置背景颜色
        setBounds(x,y,w,h); //设置四个位置大小
        setVisible(true);   //设置可见性
        setResizable(false); //设置大小固定

    }
}

2、面板 panel

解决了关闭事件！

package com.kuang.lesson01;

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
import java.awt.event.WindowListener;

// Panel(面板) 可以看成是一个空间，但是不能单独存在
public class TextPanel {
    public static void main(String[] args) {
        Frame frame = new Frame();
        // 存在布局的概念
        Panel panel = new Panel();

        //设置布局
        frame.setLayout(null);

        //设置frame坐标
        frame.setBounds(300, 300, 500, 500);
        frame.setBackground(new Color(0x8E8EE1));

        //设置panel 坐标、颜色
        panel.setBounds(50, 50, 400, 400);
        panel.setBackground(new Color(0xBBBB2C));

        // 窗口添加面板
        frame.add(panel);
        // 设置可见性
        frame.setVisible(true);
        // 系统 出口
        // 监听事件，监听窗口关闭事件 System.exit(0)
        // 适配器模式：
        frame.addWindowListener(new WindowAdapter() {
            //窗口点击关闭的时候需要做的事情
            @Override
            public void windowClosing(WindowEvent e) {
                //结束程序
                System.exit(0);

            }

        });

    }
}

2.3、布局管理器 Layout

• 流失布局 从左到右 Flow

  package com.kuang.lesson01;
  
  import java.awt.*;
  
  //测试流布局
  public class TestFlowLayout {
      public static void main(String[] args) {
          Frame frame = new Frame();
  
          //组件-按钮
          Button button1 = new Button("button1");
          Button button2 = new Button("button2");
          Button button3 = new Button("button3");
  
          //设置为流式布局
  //        frame.setLayout(new FlowLayout());
  //        frame.setLayout(new FlowLayout(FlowLayout.LEFT));
          frame.setLayout(new FlowLayout(FlowLayout.RIGHT));
  
          //设置大小
          frame.setSize(200,200);
  
          //添加按钮
          frame.add(button1);
          frame.add(button2);
          frame.add(button3);
  
          //需要设置可见性  窗口默认大小
          frame.setVisible(true);
      }
  }
  
  

  

• 东西南北中 上下结构 Border

  

  package com.kuang.lesson01;
  
  import java.awt.*;
  
  //测试边界布局
  public class TestBorderLayout {
      public static void main(String[] args) {
          Frame frame = new Frame("TestBorderLayout");
  
          Button east = new Button("East");
          Button west = new Button("West");
          Button south = new Button("South");
          Button north = new Button("North");
          Button center = new Button("Center");
  
          frame.add(east,BorderLayout.EAST);
          frame.add(west,BorderLayout.WEST);
          frame.add(south,BorderLayout.SOUTH);
          frame.add(north,BorderLayout.NORTH);
          frame.add(center,BorderLayout.CENTER);
  
          frame.setSize(200,200);
          frame.setVisible(true);
  
      }
  }
  
  

  

• 表格布局 Grid 三行两列

  package com.kuang.lesson01;
  
  import java.awt.*;
  //设置网格布局
  public class TestGridLayout {
      public static void main(String[] args) {
          Frame frame = new Frame("TestBorderLayout");
  
          Button btin1 = new Button("btin1");
          Button btin2 = new Button("btin2");
          Button btin3 = new Button("btin3");
          Button btin4 = new Button("btin4");
          Button btin5 = new Button("btin5");
          Button btin6 = new Button("btin6");
  
          frame.setLayout(new GridLayout(3,2));
  
          frame.add(btin1);
          frame.add(btin2);
          frame.add(btin3);
          frame.add(btin4);
          frame.add(btin5);
          frame.add(btin6);
  
          frame.pack();//java函数！ 表格自动布局
          frame.setVisible(true);
      }
  }
  
  

  

课堂练习讲解总结

分解过程

代码实现

package com.kuang.lesson01;

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

public class ExDemo {
    public static void main(String[] args) {
        //总frame
        Frame frame = new Frame();

        frame.setSize(400,300);
        frame.setLocation(300,200);
        frame.setBackground(Color.blue);
        frame.setVisible(true);

        frame.setLayout(new GridLayout(2,1));

        //4个面板
        Panel p1 = new Panel(new BorderLayout());// 东西南北中
        Panel p2 = new Panel(new GridLayout(2,1));// 网格
        Panel p3 = new Panel(new BorderLayout());// 东西南北中
        Panel p4 = new Panel(new GridLayout(2,2));// 网格

        //上面
        p1.add(new Button("East-1"),BorderLayout.EAST);
        p1.add(new Button("East-1"),BorderLayout.WEST);
        p2.add(new Button("p2-btn-1"));
        p2.add(new Button("p2-btn-2"));
        p1.add(p2,BorderLayout.CENTER);

        //下面
        p3.add(new Button("East-2"),BorderLayout.EAST);
        p3.add(new Button("East-2"),BorderLayout.WEST);
        //中间4个
        for (int i = 0; i < 4; i++) {
            p4.add(new Button("for-" +i));
        }
        p3.add(p4,BorderLayout.CENTER);

        frame.add(p1);
        frame.add(p3);

        //监听器
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });

        
    }
}

总结：

1. Frame 是一个顶级窗口

2. Panel 无法单独显示，必须添加到某个容器中

3. Layout 布局管理器

   1. 流式 FlowLayout

      frame.setLayout(new FlowLayout(FlowLayout.RIGHT));
      

   2. 东西南北中 BorderLayout

      Button east = new Button("East");
      frame.add(east,BorderLayout.EAST);
      

   3. 网格 GridLayout

      Button btin1 = new Button("btin1");
      frame.setLayout(new GridLayout(3,2));
      frame.add(btin1);
      

4. 属性

   1. 大小

      frame.setSize(100,100);
      

   2. 定位

      //弹出的初始位置
      //定位
      frame.setLocation(200,200);
      

   3. 背景颜色

      frame.setBackground(new Color(22, 127, 220));
      

   4. 可见性

      frame.setVisible(true);
      

   5. 监听

      frame.addWindowListener(new WindowAdapter() {
                  //窗口点击关闭的时候需要做的事情
                  @Override
                  public void windowClosing(WindowEvent e) {
                      //结束程序
                      System.exit(0);
      
                  }
      
              });
      

2.4、事件监听

事件监听：当某个事情发生的时候，他要干什么？

package com.kuang.lesson02;

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

// 测试 按钮事件
public class TestActionEvent {
    public static void main(String[] args) {
        //按下按钮的时候，触发一些事件

        //窗口
        Frame frame = new Frame();
        //按钮
        Button button = new Button();

                //添加 监听器
        // 因为 addActionListener（）需要一个 ActionListener ,所有我们需要构造一个 ActionListener
        MyActionListener myActionListener = new MyActionListener();
        button.addActionListener(myActionListener);

        // 把 按钮 放在 窗口 上
        frame.add(button,BorderLayout.CENTER);
        frame.pack(); // 自适应
        frame.setVisible(true); // 显示
        windowClose(frame);//关闭事件
    }

    // 关闭窗体的事件
    private static void windowClose(Frame frame){
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }
}

//事件监听 ：当某个事件发生了，他要干什么
class MyActionListener implements ActionListener{
    
    @Override
    public void actionPerformed(ActionEvent e) {
        System.out.println("aaa");
    }
}

多个按钮共用一个事件

package com.kuang.lesson02;

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.sql.SQLOutput;

//测试 按钮事件
public class TestActionEventTwo {
    public static void main(String[] args) {
        // 两个按钮，实现同一个监听
        // 开始   停止
        Frame frame = new Frame("开始-停止");
        Button button1 = new Button("start");
        Button button2 = new Button("stop");

        // 可以显示的定义触发会返回的命令，如果不显示定义，则会走默认的值！
        // 可以多个按钮只写一个监听类
        button2.setActionCommand("button-stop");

        MyMonitor myMonitor = new MyMonitor();

        button1.addActionListener(myMonitor);
        button2.addActionListener(myMonitor);

        frame.add(button1,BorderLayout.NORTH);// 北
        frame.add(button2,BorderLayout.SOUTH);// 南

        frame.pack();
        frame.setVisible(true);
    }
}

// 写一个监听事件
//    我的监视器
class MyMonitor implements ActionListener{
    @Override
    public void actionPerformed(ActionEvent e) {

        // 动作命令 getActionCommand();
            // 获取按钮上的一些信息
        System.out.println("按钮被被点击了：msg=>"+e.getActionCommand());
    }
}

2.5、输入框 TextField 需要被监听

package com.kuang.lesson02;

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

// 输入框
public class TestText01 {
    public static void main(String[] args) {
        // main 方法里面 只管启动！
        new MyFrame();
    }
}

class MyFrame extends Frame{
    public MyFrame(){
        TextField textField = new TextField(); // 写单行文本
        add(textField);// 把文本框放入窗口中

        // 监听这个文本框输入的文字
        MyActionListener2 myActionListener2 = new MyActionListener2();
        // 按下Enter 就会触发这个输入框的事件
        textField.addActionListener(myActionListener2);

        // 设置替换编码
        textField.setEchoChar('*');

        setVisible(true); // 可见
        pack(); // 表格自动布局

    }
}

class MyActionListener2 implements ActionListener{

    @Override
    public void actionPerformed(ActionEvent e) {
            //在监听器中，拿到了 textField 这个对象
        TextField field= (TextField) e.getSource();//获得一些资源，返回了一个对象
        // 获得输入框中的文本
        System.out.println(field.getText());

        // 设置它得文本为空
        field.setText(""); // null是一个对象 , 空是一个字符串 " "
        
    }
}

2.6、简易计算器，组合+内部类回顾复习！

oop原则：组合，大于继承！

// 正常类
class A extends B{
  // A 有了 B 的全部特性 
}

// 组合 ，不会产生很大的耦合性
class A {
  // A 里面也可以用 B 内容
  public B b;
}

耦合：

两个类的方法或者逻辑放在了一起，导致无法抽出来，不能很好 地维护

目前代码 面向过程！

package com.kuang.lesson02;

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

// 测试 计算
//简易计算器
public class TestCalc {
     public static void main(String[] args) {

         new Calculator();
     }
}
// 计算器类
class Calculator extends Frame{
    //构造函数
    public Calculator(){
        //3 个文本框
                // 最大填多少个字
        TextField num1 = new TextField(10);// 字符数
        TextField num2 = new TextField(10);// 字符数
        TextField num3 = new TextField(20);// 字符数

        //1 个按钮 =
        Button button = new Button(" = ");
            // 给按钮添加监听事件
        button.addActionListener(new MyCalculatorListener(num1,num2,num3));

        //1 个标签 +
        Label label = new Label(" + ");

        // 布局 流式布局
        setLayout(new FlowLayout());

        add(num1);
        add(label);
        add(num2);
        add(button);
        add(num3);

        pack();
        setVisible(true);

        // 适配器模式：
        addWindowListener(new WindowAdapter() {
            //窗口点击关闭的时候需要做的事情
            @Override
            public void windowClosing(WindowEvent e) {
                //结束程序
                System.exit(0);

            }

        });

    }
}

// 监听器类
class MyCalculatorListener implements ActionListener{

    //获取三个变量
    private TextField num1,num2,num3;
        // 有参构造
    public MyCalculatorListener(TextField num1,TextField num2,TextField num3) {
        this.num1 = num1;
        this.num2 = num2;
        this.num3 = num3;
    }

    @Override
                // 执行的操作
    public void actionPerformed(ActionEvent e) {
    // 监听的时候，做哪些事情？
        //1.获得加数和被加数
            // num1.getText();//String类型 ,
            // String类型转换成 int 类型
        int n1 = Integer.parseInt(num1.getText());
        int n2 = Integer.parseInt(num2.getText());

        //2.将这个值 + 法运算后放入第三个框
            // 需要一个 String
        num3.setText(""+(n1+n2));

        //3.清除前两个框的数
        num1.setText("");
        num2.setText("");

    }
}

优化代码 面向对象！

package com.kuang.lesson02;

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

// 测试 计算
//简易计算器
public class TestCalc {
     public static void main(String[] args) {

         new Calculator().loadFrame();
     }
}
// 计算器类
class Calculator extends Frame{

    //属性
    TextField num1,num2,num3;

    //方法
            //   加载窗口
    public void loadFrame(){

         num1 = new TextField(10);// 字符数
         num2 = new TextField(10);// 字符数
         num3 = new TextField(20);// 字符数

        Button button = new Button(" = ");
        Label label = new Label(" + ");

        // 给按钮添加监听事件
        button.addActionListener(new MyCalculatorListener(this));

        // 布局 流式布局
        setLayout(new FlowLayout());

        add(num1);
        add(label);
        add(num2);
        add(button);
        add(num3);

        pack();
        setVisible(true);

        // 适配器模式：
        addWindowListener(new WindowAdapter() {
            //窗口点击关闭的时候需要做的事情
            @Override
            public void windowClosing(WindowEvent e) {
                //结束程序
                System.exit(0);

            }

        });

    }
    
}

// 监听器类
class MyCalculatorListener implements ActionListener{

    //获取 计算器 这个对象,在一个类中组合另外一个类；
    Calculator calculator = null; //组合！

        // 有参构造
    public MyCalculatorListener(Calculator calculator) {
        this.calculator = calculator;

    }

    @Override
                // 执行的操作
    public void actionPerformed(ActionEvent e) {
    // 监听的时候，做哪些事情？
        //1.获得加数和被加数
        //2.将这个值 + 法运算后放入第三个框
        //3.清除前两个框的数

        int n1 = Integer.parseInt(calculator.num1.getText());
        int n2 = Integer.parseInt(calculator.num2.getText());

        calculator.num3.setText(""+(n1+n2));

        calculator.num1.setText("");
        calculator.num2.setText("");

    }
}

完全改造成 面向对象！

内部类：

• 更好的包装
• 内部类最大的好处，就是可以畅通无阻的访问外部类的属性和方法

package com.kuang.lesson02;

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

// 测试 计算
//简易计算器
public class TestCalc {
     public static void main(String[] args) {

         new Calculator().loadFrame();
     }
}

// 计算器类
class Calculator extends Frame{

    //属性
    TextField num1,num2,num3;

    //方法
            //   加载窗口
    public void loadFrame(){

         num1 = new TextField(10);// 字符数
         num2 = new TextField(10);// 字符数
         num3 = new TextField(20);// 字符数

        Button button = new Button(" = ");
        Label label = new Label(" + ");

        // 给按钮添加监听事件
        button.addActionListener(new MyCalculatorListener());

        // 布局 流式布局
        setLayout(new FlowLayout());

        add(num1);
        add(label);
        add(num2);
        add(button);
        add(num3);

        pack();
        setVisible(true);

        // 适配器模式：
        addWindowListener(new WindowAdapter() {
            //窗口点击关闭的时候需要做的事情
            @Override
            public void windowClosing(WindowEvent e) {
                //结束程序
                System.exit(0);

            }

        });

    }
    
    // 监听器类
    // 内部类最大的好处，就是可以畅通无阻的访问外部类的属性和方法
  private class MyCalculatorListener implements ActionListener{

        @Override
        // 执行的操作
        public void actionPerformed(ActionEvent e) {
            // 监听的时候，做哪些事情？
            //1.获得加数和被加数
            //2.将这个值 + 法运算后放入第三个框
            //3.清除前两个框的数

            int n1 = Integer.parseInt(num1.getText());
            int n2 = Integer.parseInt(num2.getText());

            num3.setText(""+(n1+n2));

            num1.setText("");
            num2.setText("");

        }
    }
    
}

2.7、画笔

3、Swing

用 Swing 画一些界面，做一些想做的东西