GUI编程


1、简介

  • GUI的核心技术:Swing AWT
    1.因为界面不美观
    2.需要jre环境!

  • 为什么我们要学习?
    1.可以写出自己心中想要的一些工具;
    2.工作时候,也可能需要维护到swing界面;
    3.了解MVC架构,了解监听!

2、AWT

2.1 AWT介绍

1.包含了很多类和接口! GUI!
2.元素:窗口,按钮,文本框
3.java.awt

2.2 组件和容器

1、Frame

public class TestFrame {
    public static void main(String[] args) {
        //Frame ,JDK, 看源码!
        Frame frame = new Frame("我的第一个GUI窗口");

        //需要设置可见性
        frame.setVisible(true);

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

        //设置背景色
        frame.setBackground(new Color(44, 141, 153));

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

        //设置窗口大小固定
        frame.setResizable(false);
    }
}

问题:发现窗口关闭不了,停止java程序!

封装一个自己的Frame组件

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.gray);
        MyFrame myFrame4 = new MyFrame(300, 300, 200, 200, Color.magenta);
    }
}

class MyFrame extends Frame{
    static int  id = 0; //可能存在多个窗口,需要一个id用来记数
    public MyFrame(int x, int y,int w,int h,Color color){
        super("MyFrame" + (++id));
        setBounds(x,y,w,h);
        setBackground(color);
        setVisible(true);
    }
}

2、面板Panel

// panel 可以看作一个空间,但是不能单独存在
public class TestPanel {
    public static void main(String[] args) {
        Frame frame = new Frame("测试panel");
        Panel panel = new Panel();

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

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

        //设置panel坐标
        panel.setBounds(50,50,400,400);
        panel.setBackground(Color.red);

        frame.add(panel);
        frame.setVisible(true);
        
        //解决窗口无法关闭的问题
        //监听事件,监听窗口关闭事件 system.exit(0);
        //适配器模式
        frame.addWindowListener(new WindowAdapter() {
             @Override
            //点击窗口关闭按钮要做的事情
            public void windowClosing(WindowEvent e) {
                //结束程序
                System.exit(0);
            }
        });
    }
}

2.3、布局管理器

  • 流式布局
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
        frame.add(button1);
        frame.add(button2);
        frame.add(button3);

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

  • 东西南北中
public class TestBorderLayout {
    public static void main(String[] args) {
        Frame frame = new Frame("测试 BorderLayout");

        //东西南北中
        Button east = new Button("East");
        Button west = new Button("West");
        Button north = new Button("North");
        Button south = new Button("South");
        Button center = new Button("Center");



        frame.add(east, BorderLayout.EAST);
        frame.add(west, BorderLayout.WEST);
        frame.add(north, BorderLayout.NORTH);
        frame.add(south, BorderLayout.SOUTH);
        frame.add(center, BorderLayout.CENTER);

        frame.setBounds(200,200,300,300);
        frame.setVisible(true);
    }
}

  • 表格
public class TestGridLayout {
    public static void main(String[] args) {
        Frame frame = new Frame("TestGridLayout");

        //设置表格布局
        frame.setLayout(new GridLayout(3,2));

        Button button1 = new Button("button1");
        Button button2 = new Button("button2");
        Button button3 = new Button("button3");
        Button button4 = new Button("button4");
        Button button5 = new Button("button5");
        Button button6 = new Button("button6");

        frame.add(button1);
        frame.add(button2);
        frame.add(button3);
        frame.add(button4);
        frame.add(button5);
        frame.add(button6);

        frame.pack(); //自动布局
        frame.setVisible(true);
    }
}

练习:实现下面的布局

分析:

代码实现:

public class ExDemo {
    public static void main(String[] args) {
        //总的窗口
        Frame frame = new Frame("布局练习Demo");
        frame.setSize(400,300);
        frame.setLocation(300,300);
        frame.setVisible(true);
        frame.setLayout(new GridLayout(2,1));
        //4个面板
        Panel p1 = new Panel(new BorderLayout());
        p1.setBackground(Color.green);
        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("West-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("Weat-2"), BorderLayout.WEST);
        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. 布局管理器

  4. 流式 FlowLayout

  5. 表格 GrideLayout

  6. 东西南北中 BorderLayout

  7. 大小、背景、定位、监听

2.4、事件监听

public class TestActionEvent {
    public static void main(String[] args) {
        //按下按钮触发一些事件
        Frame frame = new Frame("TestActionEvent");
        Button button = new Button();
        //因为addActionListener()需要一个actionListener,所以我们构造一个actionListener
        button.addActionListener(new MyActionListener());
        frame.add(button, BorderLayout.CENTER);

        frame.pack();
        closeWindow(frame); //关闭窗口
        frame.setVisible(true);
    }

    //关闭窗口的方法
    private static void closeWindow(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");
    }
}

两个按钮实现同一个监听:

public class TestActionTwo {
    //两个按钮实现同一个监听
    // 开始  停止
    public static void main(String[] args) {
        Frame frame = new Frame("TestActionTwo");
        Button button1 = new Button("start");
        Button button2 = new Button("top");

        MyMonitor myMonitor = new MyMonitor();
        button1.addActionListener(myMonitor);
        button2.addActionListener(myMonitor);

        button1.setActionCommand("btn-start");
        button2.setActionCommand("btn-stop");

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

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

}

class MyMonitor implements ActionListener{

    @Override
    public void actionPerformed(ActionEvent e) {
        System.out.println("按钮被点击了:msg=>"+e.getActionCommand());
    }
}

2.5、输入框 TextField 监听

public class TestText01 {
    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('*');

        pack();
        setVisible(true);
    }
}

class MyActionListener2 implements ActionListener {

    @Override
    public void actionPerformed(ActionEvent e) {
        TextField textField = (TextField) e.getSource(); //获得一些资源,返回一个对象
        System.out.println(textField.getText()); //获得输入框的内容
        textField.setText("");
    }
}

2.6 简易计算器

3、swing