文字数カウンター
入力した文章の文字数・単語数をリアルタイムにカウントするアプリ。テキストウィジェットのイベント処理を学びます。
1. アプリ概要
応募書類の自己PRやSNSの投稿を「◯字以内」に収めたいとき、書いている途中の字数をその場で確かめられれば、別のツールに貼り付けて数え直す必要がなくなります。入力欄でキーを離すたびに文字数・単語数などをリアルタイムに数え直す仕組みを、テキストウィジェットのイベント処理(<KeyRelease>)の練習台にしています。
「スペース除く」は半角と全角のスペースを、「改行除く」は改行だけを数から外した値です。
2. 機能一覧
- 「クリア」ボタン(
lambda: (self.text.delete('1.0', tk.END), self._update()))で操作 - キー
<KeyRelease>から_update()を実行 - ウィンドウはタイトル「文字数カウンター」・サイズ 811x800 で起動
3. 事前準備・環境
Python 3.11 以上(Ubuntu で 3.14・3.15 の起動を確認) / Windows 11(実機)で起動・基本操作を確認 / Linux Mint 22.3(仮想マシン)で起動・画面表示を確認(macOS は未検証)
Windows 11(実機)で起動と基本操作を確認しています(全機能の網羅テストではありません)。Linux Mint 22.3(仮想マシン)では起動と画面表示を確認しました。macOS は標準ライブラリの範囲で動作する想定ですが、未検証です。
- Python 3.11 以上(Ubuntu で 3.14・3.15 の起動を確認)
- 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. コード解説
文字数カウンターのコードを、実際に書かれている実装に沿って解説します。
クラス設計とコンストラクタ
App22 クラスにアプリの全機能をまとめています(メソッド3個・全77行)。__init__ ではタイトル「文字数カウンター」とウィンドウサイズ 811x800 を設定します。最後に _build_ui() で画面を組み立てます。
※ 該当部分のコード本体は 「4. 完全なソースコード」 をご参照ください(重複表示を避けるため再掲を省略しています)。
ウィジェット構成
画面は tk.Frame×2・tk.Label(ループで生成)・ttk.LabelFrame×2・tk.Text・ttk.Scrollbar・ttk.Button で構成しています。見出し付きの枠(LabelFrame)は「テキストを入力」「カウント結果」のラベルでエリアを区切っています。
※ 該当部分のコード本体は 「4. 完全なソースコード」 をご参照ください(重複表示を避けるため再掲を省略しています)。
イベント処理とボタンの接続
「クリア」ボタン(lambda: (self.text.delete('1.0', tk.END), self._update()))を command= で接続しています。また bind("<KeyRelease>", ...) から _update() を呼べるようにイベントも登録しています。
※ 該当部分のコード本体は 「4. 完全なソースコード」 をご参照ください(重複表示を避けるため再掲を省略しています)。
6. ステップバイステップガイド
このアプリをゼロから自分で作る手順を解説します。コードをコピーするだけでなく、実際に手順を追って自分で書いてみましょう。
-
1ファイルを作成する
新しいファイルを作成して app22.py と保存します。使うのは
tkinterだけなので、追加インストールは不要です。 -
2クラスの骨格を作る
App22クラスを定義し、__init__と、末尾のroot = tk.Tk()~mainloop()の最小構成を書いて、まず空のウィンドウが出ることを確認します。 -
3ウィンドウを設定する
title("文字数カウンター")・geometry("811x800")・configure(bg="#f8f9fc")・minsize(811, 800)をコンストラクタで設定します。 -
4画面部品を並べる
_build_ui()の中で、tk.Frame×2・tk.Label(ループで生成)・ttk.LabelFrame×2・tk.Text・ttk.Scrollbar・ttk.Buttonを作って配置します(掲載コードと同じ並び順で書くとレイアウトが一致します)。まず表示だけ確認しましょう。 -
5イベントを接続する
「2. 機能一覧」で挙げた各ボタンを
command=で対応するメソッド(lambda: (self.text.delete('1.0', tk.END), self._update()))につなぎます。bind("<KeyRelease>", ...)の登録も忘れずに。 -
6中心になるメソッドを実装する
アプリの本体である
_update()(7行) を実装します。 -
7動作確認する
python app22.pyで起動し、各ボタンが反応すること・キー操作(<KeyRelease>)が効くことを確認します。
7. カスタマイズアイデア
基本機能を習得したら、以下のカスタマイズに挑戦してみましょう。少しずつ機能を追加することで、Pythonのスキルが飛躍的に向上します。
💡 ダークモードを追加する
bg色・fg色を辞書で管理し、ボタン1つでダークモード・ライトモードを切り替えられるようにしましょう。
💡 結果をファイルに保存する
このコードに保存処理はないため、表示中の数値や結果はアプリを閉じると消えます。テキストファイルへ書き出して、次回起動時に読み込む機能を追加してみましょう。
💡 入力履歴機能
以前の入力値を覚えておいてComboboxのドロップダウンで再選択できる履歴機能を追加しましょう。
8. よくある問題と解決法
❌ 文字のフォントが崩れる・見た目が違う
原因:このコードは font=("Noto Sans JP", ...) のようにフォント名を直接指定しています。環境にこのフォントが入っていないと、OS が代わりのフォントで表示するため、見本と見た目が変わることがあります。
解決法:書体の指定は Noto Sans JP の1種類で、タイトル・入力欄・項目名・数値の4か所に大きさと太さを変えて使っています。項目名の欄は width=22 という文字数単位で幅を決めているため、代わりのフォントになると欄の広さが変わり、数値の位置が見本と同じになるとは限りません。5つの数は _update() が文字列の長さ・改行の数・空白での区切りから計算しており、計算にフォントの情報は入りません。書体を変えるなら対象は 20・30・57・60 行目の "Noto Sans JP" で、font 引数ごと消した場合は入力欄の文字が等幅の書体に変わります。
❌ <KeyRelease> キーを押しても反応しない
原因:bind("<KeyRelease>", ...) はウィジェット単位で登録されるため、ウィンドウ(またはバインド先)にキーボードフォーカスが無いとイベントが届きません。
解決法:一度ウィンドウ内をクリックしてフォーカスを与えてから、キーを押してください。
❌ ウィンドウの大きさが画面に合わない
原因:geometry("811x800") の固定サイズで起動するためです。
解決法:geometry() と minsize() の両方の数値を書き換えて起動サイズを調整してください。なお、このコードにはウィンドウサイズを固定する設定(resizable の指定)が無いため、ウィンドウの端をドラッグしたサイズ変更は既定どおり可能です。ただし minsize(811, 800) を指定しているため、起動時の大きさより小さくは縮められません(縮めると画面部品が表示されなくなるのを防ぐためです)。
9. 練習問題
アプリの理解を深めるための練習問題です。気になるものから挑戦してみてください(課題3は全アプリ共通の定型課題です)。
-
課題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:文字数の上限を決めて、超えたら赤で知らせる
上限を入力する欄(初期値 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:保存機能の追加
入力値や計算結果をファイルに保存する機能を追加しましょう。jsonやcsvモジュールを使います。
写経中に赤いエラー文が出たら、Pythonエラー一覧&解決法(英語メッセージ逆引き)で原因と直し方をすぐ確認できます。
写経しながら「なぜこう書くのか」が気になり始めたら、入門書を1冊通して読むと断片的な知識がつながります。Python入門書のおすすめ2冊(当サイトの参考書ランキング総合1〜2位)で、独学者向けの最初の1冊を比較しています。