GUI編程

組建

• 視窗

• 彈窗

• 面板

• 文本框

• 列表框

• 按鈕

• 圖片

• 監聽事件

• 滑鼠

• 鍵盤事件

• 破解工具

1、簡介

GUI的核心技術：Swing AWT

為什麼不流行？

1. 界面不美觀。

2. 需要jre環境。（沒必要為一個5M的小游戲下載幾百M的jre）

但是學了java的GUI編程，有助於瞭解MVC架構，瞭解監聽。

2、AWT

2.1、Awt介紹

1. 包括很多類和介面

2. 元素：視窗，按鈕，文本框

3. java.awt

2.2、Frame

import java.awt.*;
​
//GUI的第一個程式
public class TestFrame {
    public static void main(String[] args) {
//        不會看源碼
        Frame frame = new Frame("我的第一個java圖形界面視窗");
​
//        需要設置可見性
        frame.setVisible(true);
​
//        設置視窗大小
        frame.setSize(400, 400);
​
//        設置背景顏色    Color
        frame.setBackground(Color.yellow);
​
//        彈出的初始位置
        frame.setLocation(300, 300);
​
//        設置大小固定
        frame.setResizable(false);
    }
}

進一步封裝

import java.awt.*;
​
//GUI的第一個程式
public class TestFrame {
    public static void main(String[] args) {
​
        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.red);
        MyFrame myFrame4 = new MyFrame(300, 300, 200, 200, Color.green);
​
    }
​
}
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);
​
    }
}

2.3、面板Panel

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
​
public abstract class TestPanel {
    public static void main(String[] args) {
        Frame frame = new Frame();
        Panel panel = new Panel();
​
//        設置佈局
        frame.setLayout(null);
​
//        坐標
        frame.setBounds(300, 300, 200, 200);
        frame.setBackground(new Color(168, 123, 82));
​
//        panel設置坐標，相對於Frame
        panel.setBounds(50,50,100,100 );
        panel.setBackground(new Color(68, 52, 134));
​
        frame.add(panel);
​
        frame.setVisible(true);
​
//        監聽事件，監聽視窗關閉事件 System.exit(0)
//        適配器模式
        frame.addWindowListener(new WindowAdapter() {
//            視窗點擊關閉時需要做的事情
            @Override
            public void windowClosing(WindowEvent e) {
//                結束程式
                System.exit(0);
            }
        });
    }
}

2.4、佈局管理器

• 流式佈局

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);
    }
}

• 東西南北中

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);
    }
}

• 表格佈局

import java.awt.*;
​
public class TestGridLayout {
    public static void main(String[] args) {
        Frame frame = new Frame("TestGridLayout");
​
        Button btn1 = new Button("btn1");
        Button btn2 = new Button("btn2");
        Button btn3 = new Button("btn3");
        Button btn4 = new Button("btn4");
        Button btn5 = new Button("btn5");
        Button btn6 = new Button("btn6");
​
        frame.setLayout(new GridLayout(3,2));
​
        frame.add(btn1);
        frame.add(btn2);
        frame.add(btn3);
        frame.add(btn4);
        frame.add(btn5);
        frame.add(btn6);
​
        frame.pack();
        frame.setVisible(true);
    }
}

總結：

1. Frame是一個頂級視窗。

2. Panel無法單獨顯示，必須添加到某個容器中。

3. 佈局管理器

   1. 流式

      2. 東西南北中

      3. 表格

4. 大小，定位，背景顏色，定位，監聽。

2.5、事件監聽

事件監聽：當某個事情發生的時候，乾什麼？

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();
​
        windowClose(frame);
        frame.setVisible(true);
    }
//    關閉窗體事件
    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");
    }
}

多個按鈕共用一個監聽器

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
​
public class TestActionTwo {
    public static void main(String[] args) {
//        兩個按鈕，實現一個監聽
//        開始    停止
        Frame frame = new Frame("開始-停止");
        Button button1 = new Button("start");
        Button button2 = new Button("stop");
​
//        可以顯示的定義觸發會返回的命令，如果不顯示定義，則會走預設的值
//        可以多個按鈕只寫一個監聽類
        button2.setActionCommand("button2_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) {
        if(e.getActionCommand().equals("start")){
            System.out.println("開始按鈕監聽");
        }else{
            System.out.println("停止按鈕監聽");
        }
    }
}

2.6、輸入框 TextField 監聽

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
​
public class TestTest01 {
    public static void main(String[] args) {
        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 filed = (TextField) e.getSource();    //獲得的一些資源，返回的一個對象
        System.out.println(filed.getText());    //獲得輸入框的文本
        filed.setText("");  //回車清空
    }
}

2.7、簡易計算器，組合+內部類回顧複習

oop原則：組合，大於繼承！

目前代碼：

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
​
public class TextText02 {
    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));
​
//        一個標簽
        Label label = new Label("+");
​
//        佈局
        setLayout(new FlowLayout());
​
        add(num1);
        add(label);
        add(num2);
        add(button);
        add(button);
        add(num3);
​
        pack();
        setVisible(true);
    }
}
​
//監聽器類
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.獲得加數和被加數
        int n1 = Integer.parseInt(num1.getText());
        int n2 = Integer.parseInt(num2.getText());
​
//        2.將這個值 + 運算後，放到第三個框
        num3.setText(""+(n1+n2));
​
//        3.清除前兩個框
        num1.setText("");
        num2.setText("");
    }
}

完全改造為面向對象寫法：

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
​
public class TextText02 {
    public static void main(String[] args) {
        new Calculator().loading();
    }
}
​
class Calculator extends Frame{
​
//    屬性
    TextField num1, num2, num3;
​
//    方法
    public void loading(){
​
        num1 = new TextField(10);//字元數
        num2 = new TextField(10);//字元數
        num3 = new TextField(20);//字元數
        Button button = new Button("=");
        button.addActionListener(new MyCalculatorListener(this));
        Label label = new Label("+");
​
//        佈局
        setLayout(new FlowLayout());
        add(num1);
        add(label);
        add(num2);
        add(button);
        add(button);
        add(num3);
​
        pack();
        setVisible(true);
    }
}
​
//監聽器類
class MyCalculatorListener implements ActionListener{
​
    Calculator calculator = null;
​
    public MyCalculatorListener(Calculator calculator){
        this.calculator = calculator;
    }
​
    @Override
    public void actionPerformed(ActionEvent e) {
//        1.獲得加數和被加數
        int n1 = Integer.parseInt(calculator.num1.getText());
        int n2 = Integer.parseInt(calculator.num2.getText());
​
//        2.將這個值 + 運算後，放到第三個框
        calculator.num3.setText(""+(n1+n2));
​
//        3.清除前兩個框
        calculator.num1.setText("");
        calculator.num2.setText("");
    }
}

內部類：

• 更好的包裝

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
​
public class TextText02 {
    public static void main(String[] args) {
        new Calculator().loading();
    }
}
​
class Calculator extends Frame{
​
//    屬性
    TextField num1, num2, num3;
​