初心者向け No.060

15パズルゲーム

数字タイルをスライドして1〜15順に並べる古典パズル。タイル移動ロジックとCanvas描画を学べる。

🎯 難易度: ★★★ 📦 ライブラリ: tkinter（標準ライブラリ） ⏱️ 制作時間: 30〜90分

📋 目次

1. アプリ概要
2. 機能一覧
3. 事前準備・環境
4. 完全なソースコード
5. コード解説
6. ステップバイステップガイド
7. カスタマイズアイデア
8. よくある問題と解決法
9. 練習問題

1. アプリ概要

数字タイルをスライドして1〜15順に並べる古典パズル。タイル移動ロジックとCanvas描画を学べる。

このアプリはgamesカテゴリの実践的なPythonアプリです。使用ライブラリは tkinter（標準ライブラリ）、難易度は ★★★ です。

このアプリは「ゲーム」カテゴリです。ゲーム実装は GUI イベント処理・状態管理・描画ループを同時に学べる教材で、画面・入力・ロジックの三層分離の感覚が掴めます。tkinter（標準ライブラリ） を活かして実装するこの構造は、他のアプリにも応用が効きます。

動かしながら読むことが理解の最短経路です。まずはコードをコピーして実行し、想定どおりに動くことを確認したうえで解説と照らし合わせてください。

カスタマイズでは「機能追加」「UI 改善」「エラー耐性」の三方向で考えると視野が広がります。練習問題にもそれぞれの方向の具体例を用意しています。

15パズルゲーム実行画面（Linux Mint） — 実行画面（Linux Mint）

2. 機能一覧

「新しいゲーム」ボタン（new_game()）・「リセット（揃った状態）」ボタン（solved_state()）で操作
マウス操作 <Button-1> から _on_click() を実行
キー <Up> から _move_by_key() を実行
キー <Down> から _move_by_key() を実行
キー <Left> から _move_by_key() を実行
キー <Right> から _move_by_key() を実行
after(500, ...) による500ミリ秒間隔の _tick() 呼び出し（画面の自動更新）
messagebox.showinfo() によるダイアログ通知
ウィンドウはタイトル「15パズルゲーム」・サイズ 420x520 で起動

3. 事前準備・環境

ℹ️

動作確認環境

Python 3.10 以上 / Windows 11（実機）で起動・基本操作を確認／ Linux Mint 22.3（仮想マシン）で起動・画面表示を確認（macOS は未検証）

Windows 11（実機）で起動と基本操作を確認しています（全機能の網羅テストではありません）。Linux Mint 22.3（仮想マシン）では起動と画面表示を確認しました。macOS は標準ライブラリの範囲で動作する想定ですが、未検証です。

Python 3.10 以上
OS: Windows 11（実機で起動・基本操作を確認）・Linux Mint 22.3（仮想マシンで起動・画面表示を確認）

4. 完全なソースコード

💡

コードのコピー方法

右上の「コピー」ボタンをクリックするとコードをクリップボードにコピーできます。

✅ 追加インストール不要（標準ライブラリのみ使用）

app060.py

import random
import time
import tkinter as tk
from tkinter import ttk, messagebox


class App060:
    """15パズルゲーム"""

    SIZE = 4  # 4x4
    TILE = 80  # 1タイルのピクセルサイズ

    def __init__(self, root):
        self.root = root
        self.root.title("15パズルゲーム")
        self.root.geometry("420x520")
        self.root.configure(bg="#f8f9fc")
        self.board = []  # SIZE*SIZE のリスト、0 が空白
        self.empty = (self.SIZE - 1, self.SIZE - 1)
        self.moves = 0
        self.start_time = None
        self._timer_after = None
        self.solved = False
        self._build_ui()
        self.new_game()

    def _build_ui(self):
        """UIを構築する"""
        title_frame = tk.Frame(self.root, bg="#3776ab", pady=12)
        title_frame.pack(fill=tk.X)
        tk.Label(
            title_frame, text="15パズルゲーム",
            font=("Noto Sans JP", 16, "bold"),
            bg="#3776ab", fg="white"
        ).pack()

        main = tk.Frame(self.root, bg="#f8f9fc", padx=14, pady=10)
        main.pack(fill=tk.BOTH, expand=True)

        # ステータス
        status = tk.Frame(main, bg="#f8f9fc")
        status.pack(fill=tk.X, pady=4)
        self.status_var = tk.StringVar()
        tk.Label(status, textvariable=self.status_var, bg="#f8f9fc",
                 font=("Noto Sans JP", 11)).pack(anchor="w")

        # キャンバス
        canvas_size = self.SIZE * self.TILE
        self.canvas = tk.Canvas(main, width=canvas_size, height=canvas_size,
                                 bg="#dcdee5", highlightthickness=0)
        self.canvas.pack(pady=8)
        self.canvas.bind("<Button-1>", self._on_click)
        # キーバインド (root にバインド)
        self.root.bind("<Up>", lambda e: self._move_by_key("up"))
        self.root.bind("<Down>", lambda e: self._move_by_key("down"))
        self.root.bind("<Left>", lambda e: self._move_by_key("left"))
        self.root.bind("<Right>", lambda e: self._move_by_key("right"))

        # ボタン
        btns = tk.Frame(main, bg="#f8f9fc")
        btns.pack(fill=tk.X, pady=4)
        ttk.Button(btns, text="新しいゲーム", command=self.new_game).pack(side=tk.LEFT, padx=2)
        ttk.Button(btns, text="リセット（揃った状態）", command=self.solved_state
                   ).pack(side=tk.LEFT, padx=2)

        tk.Label(main, text="クリックまたは矢印キーで動かそう",
                 bg="#f8f9fc", font=("Noto Sans JP", 9), fg="#666"
                 ).pack(pady=2)

    def new_game(self):
        """新しい盤面（解ける状態）を生成"""
        # 揃った状態から逆順に多数回ランダム移動 → 必ず解けることを保証
        self.solved_state(no_redraw=True)
        for _ in range(200):
            self._random_move()
        self.moves = 0
        self.start_time = time.time()
        self.solved = False
        self._draw()
        self._cancel_timer()
        self._tick()

    def solved_state(self, no_redraw=False):
        """揃った状態に初期化"""
        self.board = [(i + 1) % (self.SIZE * self.SIZE)
                       for i in range(self.SIZE * self.SIZE)]
        self.empty = (self.SIZE - 1, self.SIZE - 1)
        self.moves = 0
        self.solved = False
        self.start_time = time.time()
        if not no_redraw:
            self._draw()
            self._cancel_timer()
            self._tick()

    def _random_move(self):
        """空白の位置をランダムに 1 マス移動"""
        er, ec = self.empty
        candidates = []
        for dr, dc in [(-1, 0), (1, 0), (0, -1), (0, 1)]:
            nr, nc = er + dr, ec + dc
            if 0 <= nr < self.SIZE and 0 <= nc < self.SIZE:
                candidates.append((nr, nc))
        nr, nc = random.choice(candidates)
        self._swap((er, ec), (nr, nc))
        self.empty = (nr, nc)

    def _swap(self, a, b):
        """セル a, b を交換"""
        ar, ac = a
        br, bc = b
        ai = ar * self.SIZE + ac
        bi = br * self.SIZE + bc
        self.board[ai], self.board[bi] = self.board[bi], self.board[ai]

    def _on_click(self, event):
        """マウスクリックでタイル移動"""
        if self.solved:
            return
        col = event.x // self.TILE
        row = event.y // self.TILE
        if not (0 <= row < self.SIZE and 0 <= col < self.SIZE):
            return
        self._try_move(row, col)

    def _move_by_key(self, direction):
        """矢印キーで空白の位置を相対移動"""
        if self.solved:
            return
        er, ec = self.empty
        # 「上」キー = タイルが上に動く = 空白の下のタイルが空白へ動く
        # ここでは「空白を矢印方向の逆に動かす」≒「タイルを矢印方向に動かす」
        deltas = {
            "up": (1, 0),    # タイルが上へ移動 = 空白の下のタイルが入れ替わる
            "down": (-1, 0),
            "left": (0, 1),
            "right": (0, -1),
        }
        dr, dc = deltas[direction]
        tr, tc = er + dr, ec + dc
        if 0 <= tr < self.SIZE and 0 <= tc < self.SIZE:
            self._try_move(tr, tc)

    def _try_move(self, row, col):
        """指定タイルが空白に隣接していれば移動"""
        er, ec = self.empty
        if abs(er - row) + abs(ec - col) != 1:
            return
        self._swap(self.empty, (row, col))
        self.empty = (row, col)
        self.moves += 1
        self._draw()
        if self._is_solved():
            self.solved = True
            self._cancel_timer()
            elapsed = time.time() - (self.start_time or time.time())
            messagebox.showinfo("クリア!", f"おめでとう! {self.moves} 手 / {elapsed:.1f} 秒で完成!")

    def _is_solved(self):
        """完成判定"""
        for i in range(self.SIZE * self.SIZE - 1):
            if self.board[i] != i + 1:
                return False
        return self.board[-1] == 0

    def _draw(self):
        """盤面を描画"""
        self.canvas.delete("all")
        for r in range(self.SIZE):
            for c in range(self.SIZE):
                v = self.board[r * self.SIZE + c]
                x1 = c * self.TILE
                y1 = r * self.TILE
                x2 = x1 + self.TILE
                y2 = y1 + self.TILE
                if v == 0:
                    self.canvas.create_rectangle(x1, y1, x2, y2,
                                                  fill="#dcdee5", outline="#dcdee5")
                else:
                    self.canvas.create_rectangle(x1 + 2, y1 + 2, x2 - 2, y2 - 2,
                                                  fill="#3776ab", outline="#1f4e74", width=2)
                    self.canvas.create_text((x1 + x2) // 2, (y1 + y2) // 2,
                                             text=str(v), fill="white",
                                             font=("Arial", 24, "bold"))
        self._update_status()

    def _update_status(self):
        """ステータス表示更新"""
        elapsed = (time.time() - self.start_time) if self.start_time else 0
        self.status_var.set(f"手数: {self.moves}   経過: {elapsed:.1f} 秒")

    def _tick(self):
        """0.5秒ごとに経過時間を更新"""
        if self.solved:
            return
        try:
            self._update_status()
        except tk.TclError:
            return
        self._timer_after = self.root.after(500, self._tick)

    def _cancel_timer(self):
        """タイマー停止"""
        if self._timer_after:
            try:
                self.root.after_cancel(self._timer_after)
            except tk.TclError:
                pass
            self._timer_after = None


if __name__ == "__main__":
    root = tk.Tk()
    app = App060(root)
    root.mainloop()

5. コード解説

15パズルゲームのコードを、実際に書かれている実装に沿って解説します。

クラス設計とコンストラクタ

App060 クラスにアプリの全機能をまとめています（メソッド14個・全215行）。__init__ ではタイトル「15パズルゲーム」とウィンドウサイズ 420x520 を設定します。あわせて状態を保持する変数（self.moves・self.start_time・self._timer_after・self.solved）を初期化し、そのあと _build_ui() → new_game() の順に呼び出して初期状態を作ります。