GUI编程上

GUI编程上

GUI的概念

GUI(Graphical User Interface)：用户图形界面

 

GUI的核心技术

• Swing

• AWT

 

即将淘汰的原因

• 界面不美观

• 需要jre环境

 

学习GUI编程原因

• 可以写出自己心中想要的一些小工具

• 工作时候，也可能需要维护到Swing界面，概率极小

• 了解MVC架构，了解监听

 

GUI的第一个界面

import java.awt.*;
​
public class TestFrame {
    public static void main(String[] args) {
        Frame frame = new Frame("第一个GUI窗口界面");
​
        // 设置窗口大小
        frame.setSize(300,400);
        // 设置窗口起始位置
        frame.setLocation(350,150);
        // 设置窗口是否可见 默认是false 不可见
        frame.setVisible(true);
        // 设置窗口背景颜色
        frame.setBackground(new Color(79, 243, 209));
    }
}

 

AWT面板

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
​
// Panel 可以看作是一个空间，但不能单独存在
public class TestPanel {
    public static void main(String[] args) {
        Frame frame = new Frame();
        frame.setBounds(300, 200, 500, 500);
        frame.setBackground(new Color(29, 245, 24));
        frame.setLayout(null);// 如果不设置 panel默认将填充整个frame
​
        Panel panel = new Panel();
        panel.setBounds(50, 50, 400, 400);
        panel.setBackground(new Color(236, 24, 24));
​
        frame.add(panel);
​
        frame.setVisible(true);
​
        // 监听窗口关闭事件 System.exit(0)
        // 适配器模式
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }
}

 

三种布局形式 （FlowLayout、BorderLayout和GridLayout）

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
​
public class TestLayout {
    public static void main(String[] args) {
        // flowLayoutTest();
        // borderLayoutTest();
        gridLayoutTest();
    }
​
    // 流式布局
    static void flowLayoutTest() {
        Frame frame = new Frame("Flow Layout");
​
        Button btn1 = new Button("btn1");
        Button btn2 = new Button("btn2");
        Button btn3 = new Button("btn3");
​
        frame.setBounds(300, 200, 500, 500);
        frame.setVisible(true);
        frame.setLayout(new FlowLayout());
​
        frame.add(btn1);
        frame.add(btn2);
        frame.add(btn3);
​
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }
​
    // 东西南北中布局
    static void borderLayoutTest() {
        Frame frame = new Frame("Border Layout");
​
        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.setBounds(300, 200, 500, 500);
        frame.setVisible(true);
​
        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.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }
​
    // 表格布局
    static void gridLayoutTest() {
        Frame frame = new Frame("Grid Layout");
​
        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);
​
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    }
}

 

练习Demo

public static void main(String[] args) {
        Frame frame = new Frame("练习");
        frame.setBounds(300, 200, 500, 400);
        frame.setBackground(Color.pink);
        frame.setVisible(true);
​
        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("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("West-2"), BorderLayout.WEST);
        for (int i = 1; i < 5; i++) {
            p4.add(new Button("btn-for-" + i));
        }
        p3.add(p4, BorderLayout.CENTER);
​
        frame.setLayout(new GridLayout(2, 1));
        frame.add(p1);
        frame.add(p3);
    }

 

总结

1. Frame是一个顶层窗口

2. Panel无法单独显示，需要依赖容器进行显示

3. 布局管理器

   • 流式布局

   • 东西南北中布局

   • 表格布局

4. 设置窗口的大小、定位、背景颜色和可见性