对于选项卡这个概念大家可能不会陌生,就是在一个窗口中可以切换显示多页不同的内容,但同一时间只能是其中的某一页可见的,这样的一个个的页面就是选项卡。

CardLayout就是类似的这样一个布局管理器,它能够让多个组件共享同一个显示空间,共享空间的组件之间的关系就像重叠在一起的一幅扑克牌,组件重叠在一起,初始时显示该空间中第一个组件,通过CardLayout类提供的方法可以切换该空间中显示的组件。

下面我们来看一个例子,实现CardLayout布局管理器的使用。

创建一个使用CardLayout布局的面板:

// 卡片布局管理器
private CardLayout cardLayout;
// 使用卡片布局管理器的面板
private JPanel cardPnl; cardLayout = new CardLayout();
cardPnl = new JPanel(cardLayout);

向面板中添加几张图片,因为面板使用卡片布局,所以所添加的图片是重叠在一起的:

/* 向面板中添加几张图片 */
for (int i = 0; i < 8; i++) {
final int j = i + 1;
// 将图片绘制到面板中
JPanel img = new JPanel() {
private static final long serialVersionUID = 1L;
@Override
protected void paintComponent(Graphics g) {
g.drawImage(
Toolkit.getDefaultToolkit().getImage(
"images/Freedom" + j + ".gif"), 0, 0, null);
}
};
// 将图片面板添加到使用了CardLayout的容器面板中
cardPnl.add("Freedom" + j, img);
}

添加两个按钮,用于显示上一张图片与下一张图片,并为按钮注册事件监听器,处理事件的方法:

/**
* 处理按钮点击事件
*/
@Override
public void actionPerformed(ActionEvent e) {
String cmd = e.getActionCommand(); // 获取是何种操作
if ("next".equals(cmd)) // 显示下一张图片
cardLayout.next(cardPnl); // 切换下一个选项卡
else if ("previous".equals(cmd)) // 显示上一张图片
cardLayout.previous(cardPnl); // 切换上一个选项卡
}

我们可以通过调用CardLayout的next()方法翻转到指定容器的下一张卡片,如果当前的可见卡片是最后一个,则翻转到布局的第一张卡片。同样,也可以使用previout()方法翻转到指定容器的前一张卡片。除了这两个方法外,还有last()、first()方法可以翻转到最后一张、第一张卡片,我们也可以直接使用show()方法翻转到指定名称的卡片。

完整示例代码:

 package cardLayout;

 import java.awt.BorderLayout;
import java.awt.CardLayout;
import java.awt.Graphics;
import java.awt.Toolkit;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener; import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField; /**
* 测试卡片布局管理器 如果插入图片的名字不相同的话,就要用多个面板去绘制,因为一个面板只装一张图。名字相同就可以用循环。
*
* @author hellokitty燕
*
*/
public class CardLayoutDemo2 extends JFrame implements ActionListener { private static final long serialVersionUID = 1L; private CardLayout cardLayout;// 卡片布局管理器
private JPanel jPanel;// 使用卡片布局管理器的面板
private JTextField jTextField;// 用于你输入的跳转页面 public CardLayoutDemo2() { setTitle("布局管理器之CardLayout");
setSize(600, 600);
setDefaultCloseOperation(EXIT_ON_CLOSE);
setLocationRelativeTo(null); /* 创建两个按钮,添加到窗体底部,默认窗体布局采用BorderLayout */
JPanel jp = new JPanel();// 面板默认布局使用FlowLayout JButton up = new JButton("上一张");
JButton next = new JButton("下一张");
jTextField = new JTextField("2");
JButton go = new JButton("go"); jp.add(up);
jp.add(next);
jp.add(jTextField);
jp.add(go);
// 注册按钮监听事件 up.addActionListener(this);
next.addActionListener(this);
go.addActionListener(this);
this.add(jp, BorderLayout.SOUTH); /* 创建使用CardLayout布局管理器的容器 */
cardLayout = new CardLayout();
jPanel = new JPanel(cardLayout); /* 向面板中添加几张图片 */ // 将图片绘制到面板中 /
JPanel images = new JPanel() {
private static final long serialVersionUID = 1L; @Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
g.drawImage(
Toolkit.getDefaultToolkit().getImage(
"src/images/sprite.png"), 200, 100, this); } };
// 将图片面板添加到使用了cardLayout容器面板中 jPanel.add("sprite", images); JPanel img = new JPanel() { private static final long serialVersionUID = 1L; @Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
g.drawImage(
Toolkit.getDefaultToolkit().getImage(
"src/images/Freedom1.gif"), 200, 100, this);
} }; jPanel.add("Freedom1", img); JPanel im = new JPanel() { private static final long serialVersionUID = 1L; @Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
g.drawImage(
Toolkit.getDefaultToolkit().getImage(
"src/images/sprite1.png"), 200, 100, this);
} };
jPanel.add("sprite1", im); // 将使用了CardLayout的面板添加到窗体中显示
this.add(jPanel, BorderLayout.CENTER); setVisible(true); } @Override
public void actionPerformed(ActionEvent e) {
String cmd = e.getActionCommand();
if ("下一张".equals(cmd)) {
cardLayout.next(jPanel); // 切换下一个选项卡
} else if ("上一张".equals(cmd)) {
cardLayout.previous(jPanel);// 切换上一个选项卡
} else if ("go".equals(cmd)) {
cardLayout.show(jPanel, "Freedom" + jTextField.getText());//这个主要是用于名字相似的图片,如果你想跳转的图片名字不一样的话,你就可以去把图片的名字改成相似的。
} } public static void main(String[] args) {
new CardLayoutDemo2();
}
}

运行效果:

布局管理器之CardLayout(卡片布局管理器)的更多相关文章

  1. 三十二、Java图形化界面设计——布局管理器之CardLayout(卡片布局)

    摘自 http://blog.csdn.net/liujun13579/article/details/7773945 三十二.Java图形化界面设计--布局管理器之CardLayout(卡片布局) ...

  2. 转:三十二、Java图形化界面设计——布局管理器之CardLayout(卡片布局)

    转:http://blog.csdn.net/liujun13579/article/details/7773945 卡片布局能够让多个组件共享同一个显示空间,共享空间的组件之间的关系就像一叠牌,组件 ...

  3. Java图形化界面设计——布局管理器之CardLayout(卡片布局)

  4. java 图形化小工具Abstract Window Toolit ;布局管理器FlowLayout流式布局;BorderLayout边界布局;GridLayout网格布局;CardLayou重叠卡片布局;BoxLayout方框布局;绝对定位

    1.FlowLayout流式布局管理器: FlowLayout布局管理器中,组件像水流一样向某方向流动(排列),遇到障碍(边界)就折回,重头开始排列 .在默认情况下,FlowLayout局管理器从左向 ...

  5. Java基础之创建窗口——使用卡片布局管理器(TryCardLayout)

    控制台程序. 卡片布局管理器会生成一叠组件——一个组件放在另一个组件的上面.添加到容器中的第一个组件在堆栈的顶部,因此是可见的,添加的最后一个组件在堆栈的底部.使用默认的构造函数CardLayout( ...

  6. 转:Java图形化界面设计——布局管理器之FlowLayout(流式布局)其他请参考转载出处网址

    http://blog.csdn.net/liujun13579/article/details/7771191 前文讲解了JFrame.JPanel,其中已经涉及到了空布局的使用.Java虽然可以以 ...

  7. Java图形化界面设计——布局管理器之FlowLayout(流式布局)

    一.布局管理器所属类包 所属类包 布局管理器名称 说明 Java.awt FlowLayout(流式布局) 组件按照加入的先后顺序按照设置的对齐方式从左向右排列,一行排满到下一行开始继续排列 Bord ...

  8. 03 Java图形化界面设计——布局管理器之FlowLayout(流式布局)

    前文讲解了JFrame.JPanel,其中已经涉及到了空布局的使用.Java 虽然可以以像素为单位对组件进行精确的定位,但是其在不同的系统中将会有一定的显示差异,使得显示效果不尽相同,为此java提供 ...

  9. Swing-布局管理器之GridLayout(网格布局)-入门

    注:本文内容源自于三十一.Java图形化界面设计——布局管理器之GridLayout(网格布局),笔者在学习过程中根据自身理解修改了部分代码. 网格布局特点: l  使容器中的各组件呈M行×N列的网格 ...

随机推荐

  1. Android Studio Genyomtion配置

    在AndroidStudio里面点击 File -> Settings 在Settings界面中,选择Plugins 在Plugins,输入Genymotion,并点击下面的链接 点击Insta ...

  2. [翻译]NUnit---Property and Random Attributes(十四)

    小记:由于工作琐碎,没得心情翻译而且也在看<CLR vis C#>,所以断更了差不多5个月,现在继续翻译,保证会翻译完成,不会虎头蛇尾. 另:NUnit已经更新到2.6.3版本,虽然正在开 ...

  3. 【 PLSQL Developer安装、tnsnames.ora配置 解答】

    使用plsql远程连接数据库需要安装plsql工具+ oracle的远程客户端 在不登录的状态打开plsql: 点击工具---首选项:指定oracle客户端的安装路径: C:\javaSoft\PLS ...

  4. telerik自定义皮肤的制作及用法

    1. 打开telerik 官网 http://stylebuilder.telerik.com/ 2. 选择一个皮肤做为基础皮肤,并选择要制作的控件,并新取一个名字.比如选择皮肤Silk为基础皮肤,新 ...

  5. JS 中的数据类型

    简介 JavaScript 语言的每一个值,都属于某一种数据类型.JavaScript 的数据类型,共有七种 数值(number):整数和小数,比如1和3.14 字符串(string):文本 布尔值( ...

  6. Backbone学习笔记 - Model篇

    2 Model 在Backbone中,Model用于存储核心数据,可以将数据交互相关的逻辑代码放在这里.基本形式如下: var Human = Backbone.Model.extend({ init ...

  7. BZOJ 1001--[BeiJing2006]狼抓兔子(最短路&对偶图)

    1001: [BeiJing2006]狼抓兔子 Time Limit: 15 Sec  Memory Limit: 162 MBSubmit: 29035  Solved: 7604 Descript ...

  8. iOS Block初探

    //https://www.jianshu.com/p/d28a5633b963 #import <Foundation/Foundation.h> void (^FFGlobalBloc ...

  9. window / Linux 下 Golang 开发环境的配置

    一直专注于使用python语言进行程序开发,但是却又一直被它的性能问题所困扰,直到遇到了天生支持高并发的Golang,这似乎也成了学习go语言最理所当然的理由.下面介绍下Go语言开发环境搭建的步骤: ...

  10. express form/ajax 后端获取前端数据

    -------------------2017/12/02补充:缺了一个重要条件... var bodyParser = require('body-parser');var app = expres ...