CardLayout 说咱们来玩卡牌游戏 BoxLayout 告诉你做人就要堂堂正正~

文档中心

CardLayout

牛刀小试01

BoxLayout

牛刀小试01

牛刀小试02

牛刀小试03

大家好我是Nick，今天我们一起来学习的是 CardLayout 和 BoxLayout，简单理解下，前者就是“一副牌”,后者嘛就是"一把尺"。好啦，接下来跟着Nick一起来学习趴~

听说泥不想学习？不可以哦~

CardLayout

Nick为啥说CardLayout布局管理器是一副牌嘞？因为它以时间而非空间来管理它里面的组件，它将加入容器的所有组件看成一叠卡片(每个卡片其实就是一个组件），每次只有最上面的那个Component才可见。



就好像一副扑克牌，它们叠在一起，每次只有最上面的一张扑克牌才可见。



API

牛刀小试01

效果展示



代码展示
import java.awt.*;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;public class CardLayoutDemo {    public static void main(String[] args) { Frame frame = new Frame("这里测试CardLayout"); //创建一个p1,用来存储多张卡片 Panel p1 = new Panel(); //创建CardLayout对象，并且把该对象设置给之前创建的容器p1 CardLayout cardLayout = new CardLayout(); p1.setLayout(cardLayout); //往p1中存储多个组件 String[] names={"第一张","第二张","第三张","第四张","第五张",}; for (int i = 0; i < names.length; i++) {     p1.add(names[i],new Button(names[i])); } //将p1到frame南部以上区域,默认会占中北区域，因为下面我会设置下面占南部区域 frame.add(p1); //创建另外一个p2，用来存储多个按钮主键 Panel p2 = new Panel(); //创建5个按钮主键，我们可以知道，他们是水平排列的 Button b1 = new Button("上一张"); Button b2 = new Button("下一张"); Button b3 = new Button("第一张"); Button b4 = new Button("最后一张"); Button b5 = new Button("第三张"); //创建一个时间监听器，监听按钮的点击动作 ActionListener listener = new ActionListener() {     @Override     public void actionPerformed(ActionEvent e) {  String actionCommand = e.getActionCommand();//这个字符串实际上就是按钮的文字  switch (actionCommand){      case "上一张":   cardLayout.previous(p1);   break;      case "下一张":   cardLayout.next(p1);   break;      case "第一张":   cardLayout.first(p1);   break;      case "最后一张":   cardLayout.last(p1);   break;      case "第三张":   cardLayout.show(p1,"第三张");   break;  }     } }; //把这个监听器和多个按钮绑定到一起 b1.addActionListener(listener); b2.addActionListener(listener); b3.addActionListener(listener); b4.addActionListener(listener); b5.addActionListener(listener); //把按钮放到容器p2中 p2.add(b1); p2.add(b2); p2.add(b3); p2.add(b4); p2.add(b5); //把p2放到容器frame的南边区域 frame.add(p2,BorderLayout.SOUTH); //设置窗体大小并可见 frame.pack(); frame.setVisible(true);    }}
小结

这部分代码较难，需要慢慢理解，后续我将会讲到监听器！

通过循环将数组中每一张卡片（一个卡片就是一个组件）添加到 p1容器。

通过 e.getActionCommand() 识别按钮上的字符，用swich智能化判断执行点击后的效果。

previous 上一个元素，next 下一个元素，first 第一个元素，last 最后一个元素，show 自定义元素。

乱码解决(戳我查看)

由此可见CardLayout就像一副牌，可以将各个组件叠起来，不会被覆盖哦~

肝完上一题感觉咋样？

没事，没事~

下面讲到的BoxLayout很简单~

为什么Nick说它像“一把尺”呢？

下面就来解释~

BoxLayout

为了简化开发，Swing引入了一个新的布局管理器:BoxLayout 。BoxLayout 可以在垂直和水平两个方向上摆放GUI组件，BoxLayout提供了如下—个简单的构造器:



在java.swing包中，提供了一个新的容器Box，该容器的默认布局管理器就是BoxLayout,大多数情况下，使用Box容器去容纳多个GUI组件，然后再把Box容器作为一个组件，添加到其他的容器中，从而形成整体窗口布局。

牛刀小试01

效果展示:





代码展示
public class BoxLayoutDemo01 {    public static void main(String[] args) { Frame frame = new Frame("这里测试BoxLayout"); //基于frame容器，创建一个BoxLayout对象，并且，该对象存放组件是垂直存放 BoxLayout boxLayout = new BoxLayout(frame,BoxLayout.Y_AXIS); //把boxLayout对象设置给frame frame.setLayout(boxLayout); //往frame中添加两个按钮组件 frame.add(new Button("按钮1")); frame.add(new Button("按钮2")); frame.pack(); frame.setVisible(true);    }}
牛刀小试02

效果展示

代码展示
import javax.swing.*;import java.awt.*;public class BoxLayoutDemo02 {    public static void main(String[] args) { Frame frame = new Frame("这里测试BoxLayout"); //创建个水平排列的box容器 Box hBox = Box.createHorizontalBox(); //往当前容器中添加两个按钮 hBox.add(new Button("水平按钮1")); hBox.add(new Button("水平按钮2")); //创建一个垂直排列组件的box容器 Box vBox = Box.createVerticalBox(); //往当前容器中添加两个按钮 vBox.add(new Button("垂直按钮1")); vBox.add(new Button("垂直按钮2")); //把两个box容器添加到Frame中展示即可 frame.add(hBox,BorderLayout.NORTH); frame.add(vBox); //容器设置大小，可视 frame.pack(); frame.setVisible(true);    }}
通过之前的两个BoxLayout演示，我们会发现，被它管理的容器中的组件之间是没有间隔的，不是特别的美观，但之前学习的几种布局，组件之间都会有一些间距，那使用BoxLayout如何给组件设置间距呢?



其实很简单，我们只需要在原有的组件需要间隔的地方，添加间隔即可，而每个间隔可以是一个组件，只不过该组件没有内容，仅仅起到一种分隔的作用。



牛刀小试03



效果展示



往下拖拽

往右拖拽

细细观察

拖拽过程中，哪些间距在变化哦！

代码展示
import javax.swing.*;import java.awt.*;public class BoxLayoutDemo3 {    public static void main(String[] args) { Frame frame = new Frame("这里测试BoxLayout"); //创建水平排列的Box容器 hBox Box hBox = Box.createHorizontalBox(); //往hBox中添加按钮,还需要在多个按钮之间添加分割 hBox.add(new Button("水平按钮1")); hBox.add(Box.createHorizontalGlue());//该分割在两个方向上都可以拉伸 hBox.add(new Button("水平按钮2")); hBox.add(Box.createHorizontalStrut(30));//指定了宽度 hBox.add(new Button("水平按钮3")); //创建垂直排列的Box容器vBox Box vBox = Box.createVerticalBox(); //往vBox容器中添加按钮，还需要在多个按钮之间添加分割 vBox.add(new Button("垂直按钮1")); vBox.add(Box.createVerticalGlue());//该分割在两个方向上都可以拉伸 vBox.add(new Button("垂直按钮2")); vBox.add(Box.createVerticalStrut(30));//指定了高度 vBox.add(new Button("垂直按钮3")); //把box容器添加到frame中 frame.add(hBox,BorderLayout.NORTH);//north区域高度固定，因此拉窗口没有出现变长的情况 frame.add(vBox); //设置容器大小可见 frame.pack(); frame.setVisible(true);    }}
小结：

createHorizontalBox 水平排列容器，createVerticalBox 垂直排列容器

createHorizontalGlue 水平拉升，createHorizontalStrut(数值) 宽度固定

createVerticalGlue 垂直拉升，createVerticalStrut(数值) 高度固定

局部服从全局，如牛刀小试03，hBox高度为NORTH固定,因此拉窗口没有出现变长的情况!

解决乱码(戳我查看)