文字数カウンター

1. アプリ概要

入力した文章の文字数・単語数をリアルタイムにカウントするアプリ。テキストウィジェットのイベント処理を学びます。

このアプリはツールカテゴリに分類される実践的なGUIアプリです。使用ライブラリは tkinter（標準ライブラリ） で、難易度は ★☆☆ です。

このアプリは「ツール」カテゴリです。日々の作業を自動化する実用ツールは Python が最も得意とする領域です。短いコードで実用性のある成果物が作れる点が魅力です。tkinter（標準ライブラリ） を活かして実装するこの構造は、他のアプリにも応用が効きます。

完成形を見てから細部の解説に進む流れが効果的です。実行→気になる箇所を解説で確認→自分の手で改造、というサイクルで定着が早まります。

カスタマイズ章では具体的な拡張アイデアを示しています。一つ実装するごとに動作確認することで、変更が予期せぬ副作用を起こさないかも体感できます。

2. 機能一覧

• 「クリア」ボタン（lambda: (self.text.delete('1.0', tk.END), self._update())）で操作
• キー <KeyRelease> から _update() を実行
• ウィンドウはタイトル「文字数カウンター」・サイズ 811x800 で起動

3. 事前準備・環境

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

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

4. 完全なソースコード

import tkinter as tk
from tkinter import ttk


class App22:
    """文字数カウンター"""

    def __init__(self, root):
        self.root = root
        self.root.title("文字数カウンター")
        self.root.geometry("811x800")
        self.root.minsize(811, 800)
        self.root.configure(bg="#f8f9fc")
        self._build_ui()

    def _build_ui(self):
        title_frame = tk.Frame(self.root, bg="#3776ab", pady=12)
        title_frame.pack(fill=tk.X)
        tk.Label(title_frame, text="文字数カウンター",
                 font=("Noto Sans JP", 16, "bold"),
                 bg="#3776ab", fg="white").pack()

        main_frame = tk.Frame(self.root, bg="#f8f9fc", padx=20, pady=12)
        main_frame.pack(fill=tk.BOTH, expand=True)

        # 入力エリア
        input_frame = ttk.LabelFrame(main_frame, text="テキストを入力", padding=8)
        input_frame.pack(fill=tk.BOTH, expand=True, pady=(0, 10))

        self.text = tk.Text(input_frame, font=("Noto Sans JP", 12), wrap=tk.WORD,
                            bg="white", fg="#111", padx=6, pady=6, height=10)
        self.text.pack(side=tk.LEFT, fill=tk.BOTH, expand=True)
        sb = ttk.Scrollbar(input_frame, command=self.text.yview)
        self.text.configure(yscrollcommand=sb.set)
        sb.pack(side=tk.RIGHT, fill=tk.Y)
        self.text.bind("<KeyRelease>", self._update)

        # クリアボタン
        ttk.Button(main_frame, text="クリア",
                   command=lambda: (self.text.delete("1.0", tk.END), self._update())).pack(anchor="e", pady=(0, 8))

        # カウント表示
        count_frame = ttk.LabelFrame(main_frame, text="カウント結果", padding=10)
        count_frame.pack(fill=tk.X)

        self.labels = {}
        items = [
            ("総文字数", "total"),
            ("スペース除く", "no_space"),
            ("改行除く", "no_newline"),
            ("行数", "lines"),
            ("単語数（スペース区切り）", "words"),
        ]
        bg_color = self.root.cget("bg")
        for row, (label, key) in enumerate(items):
            tk.Label(count_frame, text=f"{label}:", bg=bg_color,
                     font=("Noto Sans JP", 11), anchor="w", width=22).grid(
                row=row, column=0, sticky="w", pady=2)
            lbl = tk.Label(count_frame, text="0", bg=bg_color,
                           font=("Noto Sans JP", 13, "bold"), fg="#3776ab",
                           anchor="w", width=8)
            lbl.grid(row=row, column=1, sticky="w")
            self.labels[key] = lbl

    def _update(self, event=None):
        content = self.text.get("1.0", tk.END)[:-1]  # 末尾の余分な改行を除く
        self.labels["total"].config(text=str(len(content)))
        self.labels["no_space"].config(text=str(len(content.replace(" ", "").replace("　", ""))))
        self.labels["no_newline"].config(text=str(len(content.replace("\n", ""))))
        self.labels["lines"].config(text=str(content.count("\n") + (1 if content else 0)))
        self.labels["words"].config(text=str(len(content.split())))


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

5. コード解説

文字数カウンターのコードを、実際に書かれている実装に沿って解説します。

6. ステップバイステップガイド

このアプリをゼロから自分で作る手順を解説します。コードをコピーするだけでなく、実際に手順を追って自分で書いてみましょう。

1. 1
   ファイルを作成する

   新しいファイルを作成して app22.py と保存します。使うのは tkinter だけなので、追加インストールは不要です。

2. 2
   クラスの骨格を作る

   App22 クラスを定義し、__init__ と、末尾の root = tk.Tk() ～ mainloop() の最小構成を書いて、まず空のウィンドウが出ることを確認します。

3. 3
   ウィンドウを設定する

   title("文字数カウンター")・geometry("811x800")・configure(bg="#f8f9fc")・minsize(811, 800) をコンストラクタで設定します。

4. 4
   画面部品を並べる

   _build_ui() の中で、tk.Frame×2・tk.Label（ループで生成）・ttk.LabelFrame×2・tk.Text・ttk.Scrollbar・ttk.Button を作って配置します（掲載コードと同じ並び順で書くとレイアウトが一致します）。まず表示だけ確認しましょう。

5. 5
   イベントを接続する

   「2. 機能一覧」で挙げた各ボタンを command= で対応するメソッド（lambda: (self.text.delete('1.0', tk.END), self._update())）につなぎます。bind("<KeyRelease>", ...) の登録も忘れずに。

6. 6
   中心になるメソッドを実装する

   アプリの本体である _update()（7行） を実装します。

7. 7
   動作確認する

   python app22.py で起動し、各ボタンが反応すること・キー操作（<KeyRelease>）が効くことを確認します。

7. カスタマイズアイデア

基本機能を習得したら、以下のカスタマイズに挑戦してみましょう。少しずつ機能を追加することで、Pythonのスキルが飛躍的に向上します。

8. よくある問題と解決法

9. 練習問題

アプリの理解を深めるための練習問題です。気になるものから挑戦してみてください（課題3は全アプリ共通の定型課題です）。

1. 課題1：原稿用紙（400字）の枚数を追加する

   カウント結果に「原稿用紙」の行を1つ足します。総文字数を 400 で割った枚数を、切り上げで表示してください。

   期待結果：450文字を入力すると「原稿用紙: 2」と出る。入力欄が空のときは 0 のまま。

   合格条件

   • 400文字ちょうどで 1、401文字で 2 になる
   • 入力を全部消すと 0 に戻る
   • 「クリア」ボタンを押したあとも 0 になる

   ヒント①（どこを触るか）: 行の定義は _build_ui() の items リスト（いまは5行）です。数値の更新は _update() の self.labels[...].config(...) が並ぶ箇所で、この2か所に1つずつ足します。
   ヒント②（使うもの）: 切り上げの割り算は -(-len(content) // 400) で書けます。math.ceil() を使うなら import math の追加が必要です。
   つまずきやすい点: ラベルは items のループが自動で作るので、_build_ui() にラベルを直接書き足す必要はありません。items に足したキーと _update() で使うキーがずれると KeyError になります。

2. 課題2：文字数の上限を決めて、超えたら赤で知らせる

   上限を入力する欄（初期値 140）を作ります。総文字数が上限を超えたら「総文字数」の数字を赤くし、上限以内なら今の青のままにします。

   期待結果：上限 140 のまま 141 文字入力すると「総文字数」の数字が赤くなる。1文字消して 140 文字にすると青に戻る。

   合格条件

   • 上限欄を 10 に書き換えると、11文字目から赤くなる
   • 「クリア」ボタンで空にすると青に戻る
   • 上限欄が空のときや数字以外を入れたときもエラーで落ちない

   ヒント①（どこを触るか）: 入力欄は _build_ui() の「クリア」ボタンの近くに ttk.Entry を1つ足します。色の切り替えは _update() の self.labels["total"].config(...) の行です。
   ヒント②（使うもの）: 赤は config(fg="#e74c3c") のように指定し、元の青は "#3776ab" です。上限の文字列を数値にする int(...) は try/except ValueError で囲みます。
   つまずきやすい点: 上限欄を書き換えただけでは _update() は呼ばれません。更新は self.text の <KeyRelease> にだけ結び付いているので、上限欄にも同じバインドを足してください。

3. 課題3：保存機能の追加

   入力値や計算結果をファイルに保存する機能を追加しましょう。jsonやcsvモジュールを使います。