CardLayout布局练习（小的图片浏览器）

好的，以下是一个使用CardLayout布局的简单小图片浏览器的代码示例：

import java.awt.BorderLayout;
import java.awt.CardLayout;
import java.awt.Dimension;
import java.awt.Image;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.BorderFactory;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class ImageBrowser extends JFrame implements ActionListener {

    private static final long serialVersionUID = 1L;

    private JPanel imagePanel; // 显示图片的面板
    private CardLayout cardLayout; // 卡片布局
    private JButton prevButton; // 前一张按钮
    private JButton nextButton; // 后一张按钮
    private JLabel infoLabel; // 显示图片信息的标签

    private File[] imageFiles; // 图片文件列表
    private int currentIndex; // 当前显示的图片索引

    public ImageBrowser(File[] imageFiles) {
        this.imageFiles = imageFiles;
        this.currentIndex = 0;

        // 初始化界面
        initUI();
    }

    private void initUI() {
        // 设置窗口标题和大小
        setTitle("Image Browser");
        setSize(new Dimension(600, 400));

        // 创建面板和布局
        JPanel controlPanel = new JPanel(); // 控制按钮面板
        imagePanel = new JPanel(); // 显示图片面板
        cardLayout = new CardLayout();
        imagePanel.setLayout(cardLayout);

        // 添加图片面板到窗口的中心位置
        add(imagePanel, BorderLayout.CENTER);

        // 添加控制按钮面板到窗口的南侧位置
        add(controlPanel, BorderLayout.SOUTH);

        // 创建前一张按钮
        prevButton = new JButton("Prev");
        prevButton.addActionListener(this);
        controlPanel.add(prevButton);

        // 创建后一张按钮
        nextButton = new JButton("Next");
        nextButton.addActionListener(this);
        controlPanel.add(nextButton);

        // 创建图片信息标签
        infoLabel = new JLabel();
        infoLabel.setBorder(BorderFactory.createEmptyBorder(5, 10, 5, 10));
        controlPanel.add(infoLabel);

        // 添加所有图片到图片面板
        for (int i = 0; i < imageFiles.length; i++) {
            try {
                // 读取图片文件，创建图像并缩放至面板大小
                Image image = ImageIO.read(imageFiles[i]);
                image = image.getScaledInstance(imagePanel.getWidth(), imagePanel.getHeight(), Image.SCALE_SMOOTH);

                // 创建并添加图片标签到图片面板
                JLabel imageLabel = new JLabel(new ImageIcon(image));
                imagePanel.add(imageLabel, "image" + i);
            } catch (IOException e) {
                e.printStackTrace();
            }
        }

        // 更新显示图片信息
        updateInfoLabel();

        // 设置窗口居中显示和可见性
        setLocationRelativeTo(null);
        setVisible(true);
    }

    private void updateInfoLabel() {
        // 更新显示图片信息标签
        String info = String.format("%d/%d, %s", currentIndex + 1, imageFiles.length, imageFiles[currentIndex].getName());
        infoLabel.setText(info);
    }

    @Override
    public void actionPerformed(ActionEvent e) {
        if (e.getSource() == prevButton) { // 点击了前一张按钮
            currentIndex = (currentIndex - 1 + imageFiles.length) % imageFiles.length; // 计算前一张图片的索引
            cardLayout.previous(imagePanel); // 切换到前一张图片
            updateInfoLabel(); // 更新显示图片信息
        } else if (e.getSource() == nextButton) { // 点击了后一张按钮
            currentIndex = (currentIndex + 1) % imageFiles.length; // 计算后一张图片的索引
            cardLayout.next(imagePanel); // 切换到后一张图片
            updateInfoLabel(); // 更新显示图片信息
        }
    }

    public static void main(String[] args) {
        // 创建图片文件列表
        File[] imageFiles = new File[4];
        imageFiles[0] = new File("image1.jpg");
        imageFiles[1] = new File("image2.jpg");
        imageFiles[2] = new File("image3.jpg");
        imageFiles[3] = new File("image4.jpg");

        // 创建图片浏览器窗口
        new ImageBrowser(imageFiles);
    }

}

在上述代码中，我们创建了一个`ImageBrowser`类，该类继承自`JFrame`类，并实现了`ActionListener`接口。在`ImageBrowser`类中，我们定义了以下成员变量：

- `imagePanel`：用于显示图片的面板；
- `cardLayout`：卡片布局，用于切换显示的图片；
- `prevButton`：前一张按钮，用于向前切换显示的图片；
- `nextButton`：后一张按钮，用于向后切换显示的图片；
- `infoLabel`：用于显示当前图片信息的标签；
- `imageFiles`：图片文件列表；
- `currentIndex`：当前显示的图片索引。

在`initUI()`方法中，我们初始化了界面。首先创建了两个面板：`controlPanel`和`imagePanel`，并使用`BorderLayout`布局将`imagePanel`添加到窗口的中心位置，将`controlPanel`添加到窗口的南侧位置。

在`controlPanel`面板中，我们创建了两个按钮和一个标签，用于控制图片的显示和显示当前图片信息。在`imagePanel`面板中，我们使用`CardLayout`布局，将所有的图片添加到面板中，并为每个图片标签设置一个名称（例如`"image0"`、`"image1"`等），以便于之后通过名称来切换显示的图片。

在`updateInfoLabel()`方法中，我们更新显示图片信息的标签。根据当前显示的图片索引和图片列表，计算出当前图片的信息（例如`"1/4, image1.jpg"`），并将其设置为标签的文本。

在`actionPerformed()`方法中，我们处理前一张和后一张按钮的点击事件。如果点击了前一张按钮，我们计算出前一张图片的索引，并通过`CardLayout`布局的`previous()`方法来切换显示的图片；如果点击了后一张按钮，我们计算出后一张图片的索引，并通过`CardLayout`布局的`next()`方法来切换显示的图片。之后调用`updateInfoLabel()`方法来更新显示图片信息的标签。

在`main()`方法中，我们创建了一个包含4张图片的文件列表，并创建了一个`ImageBrowser`对象来显示这些图片。

注意，在实际开发中，我们应该将图片文件列表作为构造方法的参数传入`ImageBrowser`类中，而不是在`main()`方法中硬编码。这样可以使代码更加灵活和易于维护。