Java Swing 拼图小游戏开发实战

关键知识点：

• JFrame 作为顶层容器，负责窗口基本属性配置
• JMenuBar、JMenu、JMenuItem 组合实现菜单功能
• 绝对布局（null layout）便于精确控制组件位置

三、图片加载与分割（Step 2）

接下来实现图片处理功能，将原图分割为对应数量的方块并加载显示。

// ImageUtil.java
import javax.imageio.ImageIO;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;

public class ImageUtil {
    // 分割图片为 SIZE×SIZE 的小方块
    public static BufferedImage[] splitImage(String path, int size, int blockSize) {
        try {
            BufferedImage srcImage = ImageIO.read(new File(path));
            // 缩放原图以适应游戏窗口
            Image scaledImage = srcImage.getScaledInstance(size * blockSize, size * blockSize, Image.SCALE_SMOOTH);
            BufferedImage destImage = new BufferedImage(size * blockSize, size * blockSize, BufferedImage.TYPE_INT_RGB);
            destImage.getGraphics().drawImage(scaledImage, 0, 0, null);

            // 分割图片
            BufferedImage[] blocks = new BufferedImage[size * size];
            for (int i = 0; i < size; i++) {
                for (int j = 0; j < size; j++) {
                    int index = i * size + j;
                    blocks[index] = destImage.getSubimage(j * blockSize, i * blockSize, blockSize, blockSize);
                }
            }
            return blocks;
        } catch (IOException e) {
            e.printStackTrace();
            JOptionPane.showMessageDialog(null, "图片加载失败！");
            return null;
        }
    }
}

在 PuzzleFrame 中添加图片加载与绘制逻辑：

// 在 PuzzleFrame 中添加成员变量
private BufferedImage[] imageBlocks;
private int emptyRow = SIZE - 1; // 空位行坐标
private int emptyCol = SIZE - 1; // 空位列坐标

// 初始化图片
private void initImage() {
    imageBlocks = ImageUtil.splitImage("images/pic.jpg", SIZE, BLOCK_SIZE);
}

// 重写 paint 方法绘制界面
@Override
public void paint(Graphics g) {
    super.paint(g);
    // 绘制游戏区域边框
    g.setColor(Color.GRAY);
    g.fillRect(20, 50, SIZE * BLOCK_SIZE, SIZE * BLOCK_SIZE);

    // 绘制方块
    for (int i = 0; i < SIZE; i++) {
        for (int j = 0; j < SIZE; j++) {
            int value = data[i][j];
            if (value != 0) { // 非空位绘制图片
                g.drawImage(imageBlocks[value - 1], j * BLOCK_SIZE + 20, i * BLOCK_SIZE + 50, BLOCK_SIZE, BLOCK_SIZE, null);
            }
        }
    }

    // 绘制网格线
    for (int i = 0; i <= SIZE; i++) {
        g.setColor(Color.WHITE);
        g.drawLine(20, 50 + i * BLOCK_SIZE, 20 + SIZE * BLOCK_SIZE, 50 + i * BLOCK_SIZE);
        g.drawLine(20 + i * BLOCK_SIZE, 50, 20 + i * BLOCK_SIZE, 50 + SIZE * BLOCK_SIZE);
    }
}

开发要点：

1. 需在项目根目录创建 images 文件夹并放入 pic.jpg 图片
2. BufferedImage 类用于图片处理，getSubimage 实现分割
3. 重写 paint 方法实现自定义绘制，注意绘制顺序（先背景后元素）

四、核心逻辑实现（Step 3）

4.1 打乱算法

采用随机交换法实现打乱，但需保证拼图可解（3×3 拼图需满足逆序数为偶数）：

// 打乱方块
private void shuffle() {
    int count = 0; // 随机交换 100 次
    for (int i = 0; i < 100; i++) {
        int dir = (int) (Math.random() * 4); // 0-3 代表上下左右
        switch (dir) {
            case 0: // 上
                if (emptyRow > 0) {
                    swap(emptyRow, emptyCol, emptyRow - 1, emptyCol);
                    emptyRow--;
                }
                break;
            case 1: // 下
                if (emptyRow < SIZE - 1) {
                    swap(emptyRow, emptyCol, emptyRow + 1, emptyCol);
                    emptyRow++;
                }
                break;
            case 2: // 左
                if (emptyCol > 0) {
                    swap(emptyRow, emptyCol, emptyRow, emptyCol - 1);
                    emptyCol--;
                }
                break;
            case 3: // 右
                if (emptyCol < SIZE - 1) {
                    swap(emptyRow, emptyCol, emptyRow, emptyCol + 1);
                    emptyCol++;
                }
                break;
        }
    }
}

// 交换两个位置的元素
private void swap(int r1, int c1, int r2, int c2) {
    int temp = data[r1][c1];
    data[r1][c1] = data[r2][c2];
    data[r2][c2] = temp;
}

4.2 鼠标交互

添加鼠标监听器实现点击移动功能：

// 初始化鼠标监听
private void initMouseListener() {
    addMouseListener(new MouseAdapter() {
        @Override
        public void mouseClicked(MouseEvent e) {
            int x = e.getX();
            int y = e.getY();
            // 判断点击位置是否在游戏区域内
            if (x >= 20 && x <= 20 + SIZE * BLOCK_SIZE && y >= 50 && y <= 50 + SIZE * BLOCK_SIZE) {
                // 计算点击的方块坐标
                int clickRow = (y - 50) / BLOCK_SIZE;
                int clickCol = (x - 20) / BLOCK_SIZE;

                // 判断是否可移动（相邻空位）
                if ((Math.abs(clickRow - emptyRow) == 1 && clickCol == emptyCol) ||
                        (Math.abs(clickCol - emptyCol) == 1 && clickRow == emptyRow)) {
                    // 交换位置
                    swap(clickRow, clickCol, emptyRow, emptyCol);
                    // 更新空位坐标
                    emptyRow = clickRow;
                    emptyCol = clickCol;
                    // 重绘界面
                    repaint();
                    // 判断是否胜利
                    if (checkWin()) {
                        JOptionPane.showMessageDialog(PuzzleFrame.this, "恭喜完成拼图！");
                    }
                }
            }
        }
    });
}

// 胜利判断
private boolean checkWin() {
    for (int i = 0; i < SIZE; i++) {
        for (int j = 0; j < SIZE; j++) {
            // 最后一个位置应为 0
            if (i == SIZE - 1 && j == SIZE - 1) {
                if (data[i][j] != 0) return false;
            } else {
                if (data[i][j] != i * SIZE + j + 1) return false;
            }
        }
    }
    return true;
}

在构造方法中添加初始化调用：

public PuzzleFrame() {
    initFrame();
    initMenu();
    initData();
    initImage();
    initMouseListener();
    shuffle(); // 启动时打乱
    setVisible(true);
}

核心算法解析：

• 打乱采用模拟人玩的随机移动法，保证可解性
• 鼠标点击通过坐标计算确定目标方块，仅允许相邻空位移动
• 胜利判断通过对比当前状态与目标状态实现

五、功能完善与优化（Step 4）

5.1 计时与步数统计

添加计时功能和步数统计，提升游戏体验：

// 添加成员变量
private int stepCount = 0;       // 步数
private long startTime;          // 开始时间
private JLabel timeLabel = new JLabel("时间：0 秒");
private JLabel stepLabel = new JLabel("步数：0");

// 在 initFrame 中添加统计标签
private void initFrame() {
    // ... 原有代码 ...
    // 添加统计面板
    JPanel infoPanel = new JPanel();
    infoPanel.setBounds(20, 10, SIZE * BLOCK_SIZE, 30);
    infoPanel.add(timeLabel);
    infoPanel.add(stepLabel);
    add(infoPanel);

    // 初始化计时
    startTime = System.currentTimeMillis();
    Timer timer = new Timer(1000, e -> {
        long time = (System.currentTimeMillis() - startTime) / 1000;
        timeLabel.setText("时间：" + time + "秒");
    });
    timer.start();
}

// 移动后更新步数（在 mouseClicked 中）
stepCount++;
stepLabel.setText("步数：" + stepCount);

// 重新开始功能（在菜单监听器中）
restartItem.addActionListener(e -> {
    initData();
    shuffle();
    stepCount = 0;
    stepLabel.setText("步数：0");
    startTime = System.currentTimeMillis();
    repaint();
});

5.2 界面美化

优化视觉效果，添加游戏标题和背景：

// 重写 paint 方法时添加标题绘制
g.setColor(Color.BLUE);
g.setFont(new Font("宋体", Font.BOLD, 20));
g.drawString("Java 拼图游戏", 20, 35);

// 设置窗口背景
setBackground(Color.LIGHT_GRAY);

六、项目总结与拓展方向

6.1 开发收获

通过本项目实践，掌握了：

• Swing 组件的使用与布局管理
• 图片处理与自定义绘制
• 事件驱动编程与用户交互
• 游戏逻辑设计与算法实现

6.2 拓展建议

1. 增加难度选择（4×4、5×5）
2. 实现拖拽移动功能
3. 添加图片选择功能
4. 记录最佳成绩排行榜
5. 实现动画过渡效果

6.3 完整代码结构

最终项目包含三个核心类，共约 300 行代码，实现了一个功能完整、交互友好的拼图游戏。通过这个项目，不仅能巩固 Java 基础知识，更能理解小型应用的开发流程。