Java GUI-Swing详解

一、GUI-Swing

1. Swing介绍

• 什么是Swing
  • 也是Java图形用户界面的处理方法，不过Swing是高级图形库，是基于Awt平台为基础构建起来的组件
• Swing特点
  • 是轻量级的，没有使用Windows函数
  • 移植性好，因为没有使用Windows平台的函数，而是使用虚拟机进行调用，所以可以在任意的平台运行，没有平台限制
  • 运行较慢，在Windows平台运行下还是Awt更快

2. 窗口

• JFrame

• 作用

  • Swing中的顶级窗口，也是容器，用来存放其他的容器与组件

• 注意事项

  • 在JFrame窗口中，并不是直接在窗口上进行操作的，而是隔了一个默认的ContentPane容器，优先展示的是ContentPane的属性设置。所以有时候会发生对JFrame窗口进行设置后，看不到设置的结果，就是因为优先展示的是ContentPane的设置。
  • 使用getContentPane()方法得到这个窗口容器
  • 建议除了窗口的关闭按钮、大小、位置、可见性等，其他颜色、布局、添加组件等操作都在窗口容器中进行操作

• 代码示例

  • 创建一个JFrame窗口，并在窗口的中间添加一个标签

  public class WindowJFrame {//Swing中Jframe窗口练习
  
      public static void main(String[] args) {
          new WindowJFrame("Swing中JFrame窗口练习");
      }
  
      public WindowJFrame(String total) {
          JFrame frame = new JFrame(total);//创建JFrame窗口
  
          //设置窗口的位置大小属性
          frame.setBounds(100, 100, 500, 500);
  
          //获得窗口的容器
          Container container = frame.getContentPane();
          //使用窗口容器设置窗口的布局为绝对布局
          container.setLayout(null);
  
  
          //设置标签
          Label label = new Label("这是JFrame窗口的标签");
          label.setBackground(Color.yellow);
          label.setBounds(200, 200, 150, 50);
  
          //将标签添加进窗口容器中
          container.add(label);
  
          //设置可见性及窗口的关闭按钮
          frame.setVisible(true);
          frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

3. 弹窗

• JDialog

• 作用

  • 创建一个对话框窗口(弹窗)
  • 这个弹窗默认实现了关闭按钮的功能，不用再手动实现

• 代码练习

  • 创建一个窗口，窗口中间添加一个JButton按钮，当点击这个按钮时，就弹出一个弹窗

  public class JDialogTest extends JFrame {//Swing弹窗练习
  
      public static void main(String[] args) {
          new JDialogTest("Swing中弹窗JDialog的练习");
      }
  
      public JDialogTest(String total) {
          //设置窗口
          super(total);
          this.setBounds(100, 100, 500, 500);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
          this.setResizable(false);//设置窗口是否可拉伸
  
          //得到窗口的容器，用来设置布局，放置组件
          Container container = this.getContentPane();
          //设置窗口容器的布局
          container.setLayout(null);//设置为绝对布局
  
          //创建一个JButton按钮
          JButton button = new JButton("点击我，你就可以获得一个弹窗");
          button.setBounds(150, 200, 250, 50);
          button.setBackground(Color.yellow);
  
          //设置JButton按钮的触发事件，弹出一个弹窗
          button.addActionListener(new ActionListener() {
              @Override
              public void actionPerformed(ActionEvent e) {
                  new MyJDialog("这是我的弹窗");//创建弹窗
              }
          });
  
          //将JButton按钮放进容器中
          container.add(button);
      }
  }
  
  class MyJDialog extends JDialog {
      public MyJDialog(String total) {
          //设置弹窗
          this.setBounds(500, 50, 400, 400);
          this.setVisible(true);/*不需要因为弹窗自实现窗口关闭功能*/
          this.setTitle("你想要的小弹窗");
          this.setResizable(false);
  
          //获得弹窗的容器
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建标签
          JLabel label = new JLabel("我的弹窗标签");
          label.setBounds(150, 100, 100, 50);
          label.setBackground(Color.cyan);
  
          //将JLabel标签放进弹窗中
          container.add(label);
      }
  }

4. 标签

1）图标标签

• 作用

  • 绘制一个图标，放在标签或按钮上面

• 代码练习

  • 创建一个窗口，在窗口的中间添加一个JLabel标签，在标签上绘制一个矩形

  public class IconTest extends JFrame implements Icon {//Swing图标练习
  
      private int width;
      private int height;
  
      public static void main(String[] args) {
          new IconTest().init();
      }
  
      /**
       * 初始化方法
       */
      private void init() {
          IconTest frame = new IconTest(50, 30);
          this.setBounds(100, 100, 500, 500);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
          this.setResizable(false);
          this.setVisible(true);
  
          JLabel label = new JLabel("图标", frame, SwingConstants.CENTER);
  
          //得到窗口的容器
          Container container = this.getContentPane();
          //将标签添加进窗口容器中
          container.add(label);
      }
  
      public IconTest() {
      }
  
      public IconTest(int width, int height) {
          this.width = width;
          this.height = height;
      }
  
      @Override
      public void paintIcon(Component c, Graphics g, int x, int y) {
          g.setColor(Color.YELLOW);
          g.fillRect(x, y, 50, 30);
      }
  
      @Override
      public int getIconWidth() {
          return this.width;
      }
  
      @Override
      public int getIconHeight() {
          return this.height;
      }
  }

2）图片标签

• ImageIcon

• 作用

  • 将一个图片放标签或按钮上面

• 代码练习

  • 将一个图片放在标签上

  public class ImageTest {//将一个图片设为标签的图案
  
      public static void main(String[] args) {
          new MyJFrame("将图片设置为标签的图案练习");
      }
  }
  
  class MyJFrame extends JFrame {
      public MyJFrame() {
          super();
      }
  
      public MyJFrame(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
  
          //得到图片的资源
          URL url = MyJFrame.class.getResource("littleRobot.jpg");//括号内是图片的路径
          //将图片转为图标
          ImageIcon imageIcon = new ImageIcon(url);
  
          JLabel label = new JLabel("我的标签");
          label.setSize(26, 23);
          label.setLocation(150, 150);
          //将图标与标签关联
          label.setIcon(imageIcon);
          label.setHorizontalAlignment(SwingConstants.CENTER);
  
          //创建窗口容器，并将标签添加进去
          Container container = this.getContentPane();
          container.add(label);
  
          this.setVisible(true);//最有再将窗口设置为可见
      }
  }

5. 面板

1）普通面板

• JPanel

• 作用

  • 是一个轻量级的容器

• 代码练习

  • 创建一个窗口，练习按钮的表格

  public class JPanelTest {//JPanel面板练习
  
      public static void main(String[] args) {
          new MyJPanelFrame("JPanel面板练习");
      }
  }
  
  /**
   * 自定义的窗口类
   */
  class MyJPanelFrame extends JFrame {
      public MyJPanelFrame(String tital) {
          super(tital);
          this.setBounds(100, 100, 500, 500);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
  
          //得到窗口的容器，并将窗口布局为两行两列的表格
          Container container = this.getContentPane();
          container.setLayout(new GridLayout(2, 2, 10, 10));//后面的两个10分别表示上下与左右间距
  
          //创建四个面板
          JPanel panel1 = new JPanel(new GridLayout(2, 1));
          JPanel panel2 = new JPanel(new GridLayout(1, 2));
          JPanel panel3 = new JPanel(new GridLayout(2, 2));
          JPanel panel4 = new JPanel(new GridLayout(2, 3));
  
          //往面板中添加JButton按钮
          panel1.add(new JButton("1"));
          panel1.add(new JButton("1"));
          panel2.add(new JButton("2"));
          panel2.add(new JButton("2"));
          panel3.add(new JButton("3"));
          panel3.add(new JButton("3"));
          panel3.add(new JButton("3"));
          panel3.add(new JButton("3"));
          panel4.add(new JButton("4"));
          panel4.add(new JButton("4"));
          panel4.add(new JButton("4"));
          panel4.add(new JButton("4"));
          panel4.add(new JButton("4"));
          panel4.add(new JButton("4"));
  
          //将四个面板装进窗口容器中
          container.add(panel1);
          container.add(panel2);
          container.add(panel3);
          container.add(panel4);
  
          //将窗口设置为可见的
          this.setVisible(true);
      }
  }

2）带有滚动条的面板

• JScrollPanel

• 作用

  • 一个带有滚动条的面板

• 代码练习

  • 创建一个带有滚动条的文本窗口

  public class JScrollPanelTest extends JFrame {//滚动面板及文本域练习
  
      public static void main(String[] args) {
          new JScrollPanelTest("滚动面板及文本域的练习");
      }
  
      public JScrollPanelTest(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          //创建文本域，并设置文本域
          JTextArea textArea = new JTextArea("文本域");//内容
          textArea.setBounds(200, 200, 200, 300);//大小和位置
          textArea.setBackground(new Color(222, 230, 225));//颜色
  
          //创建滚动面板
          JScrollPane scrollPane = new JScrollPane(textArea);
  
          //创建窗口的容器，将滚动面板添加进窗口容器中
          Container container = this.getContentPane();
          container.add(scrollPane);
  
          //设置窗口的关闭及显示等
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);//关闭
          this.setVisible(true);//可见性
          this.setResizable(false);//是否可拉伸
      }
  }

6. 按钮

1）图片按钮

• ImageIcon

• 作用

  • 将一个图片作为按钮的图标

• 代码示例

  • 将一个图片设置为JButton按钮的图标

  public class PictureJButtons extends JFrame {//图片按钮练习
  
      public static void main(String[] args) {
          new PictureJButtons("图片按钮练习");
      }
  
      public PictureJButtons(String title) {
  
          //创建窗口
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          //获得窗口的容器
          Container container = this.getContentPane();
          container.setLayout(null);//设置窗口布局为绝对布局
  
          //获得图片图标
          URL url = PictureJButtons.class.getResource("wechatIcon.png");
          ImageIcon imageIcon = new ImageIcon(url);
  
          //创建JButton按钮，并与图片图标相关联
          JButton button = new JButton();
          button.setIcon(imageIcon);
          button.setBounds(230, 230, 38, 38);
  
          //将JButton按钮放进窗口容器中
          container.add(button);
  
          //设置窗口的关闭及可见性
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

2）单选按钮

• JRadioButton

• 作用

  • 单选按钮，同一组(ButtonGroup)中只能有一个按钮被选中

• 代码练习

  • 实现三个单选按钮，让用户选择左中右

  public class SingleButtons extends JFrame {//单选按钮的练习
  
      public static void main(String[] args) {
          new SingleButtons("单选按钮的练习");
      }
  
      public SingleButtons(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建单选按钮
          JRadioButton leftButton = new JRadioButton("LEFT");
          leftButton.setBounds(120, 230, 80, 40);
          JRadioButton rightButton = new JRadioButton("CENTER");
          rightButton.setBounds(230, 230, 80, 40);
          JRadioButton centerButton = new JRadioButton("RIGHT");
          centerButton.setBounds(340, 230, 80, 40);
  
          //创建单选框的分组，一组之中同时只能选择一个按钮
          ButtonGroup group = new ButtonGroup();
          //将按钮放置进分组中
          group.add(leftButton);
          group.add(rightButton);
          group.add(centerButton);
  
          //将分组放进窗口容器中
          container.add(leftButton);
          container.add(rightButton);
          container.add(centerButton);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

3）复选按钮

• JCheckBox

• 作用

  • 可以选择复选框中的多个选项

• 代码练习

  • 实现复选按钮，可以选择多个

   */
  public class CheckButtons extends JFrame {//复选按钮的练习
  
      public static void main(String[] args) {
          new CheckButtons("复选按钮的练习");
      }
  
      public CheckButtons(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);//采用绝对布局
  
  
          //创建复选按钮
          JCheckBox checkBox1 = new JCheckBox("选项1");
          checkBox1.setBounds(150, 230, 80, 40);
          JCheckBox checkBox2 = new JCheckBox("选项2");
          checkBox2.setBounds(280, 230, 80, 40);
  
  
          //将复选按钮放进窗口容器中
          container.add(checkBox1);
          container.add(checkBox2);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

7. 列表

1）下拉框

• JComboBox

• 作用

  • 多个指定的选值，用户可以从多个指定的选值之中选择一个
  • 选择地域、年龄段、性别等有固定内容的、不希望用户随意输入的选项时用到

• 代码练习

  • 让用户选择自己的年龄段

  public class DropDownBoxs extends JFrame {//下拉框的练习
      public static void main(String[] args) {
          new DropDownBoxs("下拉框的练习");
      }
  
      public DropDownBoxs(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建下拉框及设置
          JComboBox<String> comboBox = new JComboBox<>();
          comboBox.setBounds(100, 200, 300, 30);
          comboBox.setBackground(Color.cyan);
  
          //给下拉框中添加文字
          comboBox.addItem("0--20岁");
          comboBox.addItem("20--30岁");
          comboBox.addItem("30--50岁");
          comboBox.addItem("50--70岁");
          comboBox.addItem("70--100岁");
  
          //将下拉框添加进窗口容器中
          container.add(comboBox);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

2）列表框

• JList

• 作用

  • 显示对象列表，可以与集合相关联，动态的展示集合中的信息

• 代码练习

  • 使用列表框将集合中的元素显示出来

  public class ListBoxs extends JFrame {//列表框的练习
  
      public static void main(String[] args) {
          new ListBoxs("列表框的练习");
      }
  
      public ListBoxs(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建列表框，并与集合相关联
          Vector<String> vector = new Vector<>();//创建集合
          JList<String> list = new JList<>(vector);//创建列表，与集合相关联，列表中展示集合中的元素
          list.setBounds(100, 100, 300, 300);
  
          //给集合中添加元素
          vector.add("ZhangSan------23");
          vector.add("LiSi------24");
          vector.add("WangWu------25");
          vector.add("ZhaoLiu------26");
  
          //将列表框添加进窗口容器
          container.add(list);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

8. 文本框

1）文本框

• JTextField

• 作用

  • 只能接收用户单行输入，遇到回车会自动触发事件

• 代码练习

  • 创建一个文本框，可以接收用户输入的信息

  public class JTextFields extends JFrame {//文本框的练习，文本框一次只能输入一行
  
      public static void main(String[] args) {
          new JTextFields("文本框的练习");
      }
  
      public JTextFields(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建文本框
          JTextField textField = new JTextField();
          textField.setBounds(100, 100, 300, 30);
  
          //将文本框与窗口容器关联
          container.add(textField);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

2）密码框

• JPasswordField

• 作用

  • 密码框，用户看不到输入的内容，但是后台可以接收到实际的内容

• 代码练习

  • 创建一个密码框

  public class PasswordBoxs extends JFrame {//密码框的练习
  
      public static void main(String[] args) {
          new PasswordBoxs("密码框的练习");
      }
  
      public PasswordBoxs(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
  
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建密码框
          JPasswordField passwordBox = new JPasswordField("我是密码框");
          passwordBox.setBounds(100, 100, 300, 30);
          //将用户输入的字符样式更改为指定的字符
          //passwordBox.setEchoChar('*');
  
          //将密码框添加进窗口容器中
          container.add(passwordBox);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }

3）文本域

• JTextArea

• 作用

  • 一个支持多行输入的文本域，带有滚动条

• 代码练习

  • 创建一个文本域

  public class TextAreas extends JFrame {//文本域的练习
  
      public static void main(String[] args) {
          new TextAreas("文本域的练习");
      }
  
      public TextAreas(String title) {
          super(title);
          this.setBounds(100, 100, 500, 500);
          Container container = this.getContentPane();
          container.setLayout(null);
  
          //创建文本域
          TextArea textArea = new TextArea("文本域");
          textArea.setBounds(100, 100, 300, 300);
  
          //将文本域添加进窗口容器中
          container.add(textArea);
  
          //窗口关闭等设置
          this.setResizable(false);
          this.setVisible(true);
          this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
      }
  }