tkinter を用いたユーザインタフェース

概要

Windows 上で tkinter を用いて、典型的なユーザインタフェース(ウィンドウ、ボタン、フォーム、ファイル選択、画像表示)を作る演習を説明する。

tkinter は、Python で GUI(ユーザインタフェース)を作るためのライブラリである。Python に標準で付属しているため、追加のインストールは不要である。本記事では Python 3.12 を使用し、Windows 環境を前提とする。

本記事の演習で確認できる基本概念は、次の五つである。各概念は、対応する演習のコードに現れる。

Python プログラムの編集・実行には、Visual Studio Code の利用を推奨する(第1章参照)。

目次

関連する外部ページ

tkinter の公式ドキュメント: https://docs.python.org/3/library/tkinter.html

ファイル選択ダイアログの公式ドキュメント: https://docs.python.org/3/library/dialog.html

1. 前準備

Python 3.12 のインストール

Python の開発環境 Visual Studio Code のインストールと Python 用の設定

Python プログラム実行手順

2. 演習1:ウィンドウの表示(動作確認)

テーマ名:ウィンドウの表示と、ウィジェットの配置・イベントループの確認

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウが開き、その中に「Hello, tkinter」と表示されれば、tkinter は正常に動作している。

import tkinter as tk

root = tk.Tk()
label = tk.Label(root, text="Hello, tkinter")
label.pack()
root.mainloop()

ヒント:tk.Tk() がウィンドウを作る。tk.Label(...) で文字表示の部品を作り、pack() でウィンドウに配置する。mainloop() がイベントループで、ウィンドウを表示し操作を待ち受け続ける。

考察ポイント:ウィンドウが開いてその中に文字が表示されること、ウィンドウを閉じるまでプログラムが動き続けることを観察する。

3. 演習2:ボタンとコールバック

テーマ名:ボタンの配置と、押したときに呼ばれる関数(コールバック)

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウにボタンが表示され、押すたびに、押した回数がコマンドプロンプトに表示される。

import tkinter as tk

count = 0

def on_click():
    global count
    count += 1
    print("押した回数:", count)

root = tk.Tk()
button = tk.Button(root, text="押してください", command=on_click)
button.pack()
root.mainloop()

ヒント:ボタンの command に関数 on_click を渡すと、ボタンが押されたときにその関数が呼ばれる。これがコールバックである。

考察ポイント:ボタンを押すたびに on_click が呼ばれ、回数が増えていくことを観察する。

4. 演習3:変数クラスによるラベルの書き換え

テーマ名:StringVar でラベルとボタンを連動させる

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウにラベルとボタンが表示され、ボタンを押すたびにラベルの文字が変わる。

import tkinter as tk

count = 0

def on_click():
    global count
    count += 1
    text_var.set("押した回数: " + str(count))

root = tk.Tk()
text_var = tk.StringVar()
text_var.set("押した回数: 0")
label = tk.Label(root, textvariable=text_var)
label.pack()
button = tk.Button(root, text="押してください", command=on_click)
button.pack()
root.mainloop()

ヒント:StringVar を作り、ラベルの textvariable に結び付ける。set()StringVar の値を変えると、結び付いたラベルの表示が変わる。これが変数クラスを介した値の受け渡しである。

考察ポイント:ボタンを押すと set() が呼ばれ、ラベルの表示が変わることを観察する。ラベルの文字を直接書き換えていないのに表示が変わる点に注目する。

5. 演習4:フォーム(テキスト入力)

テーマ名:テキスト入力欄とボタンによるフォーム

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウにテキスト入力欄とボタンが表示される。入力欄に文字を打ってボタンを押すと、入力した文字がコマンドプロンプトに表示される。

import tkinter as tk

def on_submit():
    print("入力された文字:", entry.get())

root = tk.Tk()
entry = tk.Entry(root)
entry.pack()
button = tk.Button(root, text="送信", command=on_submit)
button.pack()
root.mainloop()

ヒント:tk.Entry(...) がテキスト入力欄である。get() で、入力欄に打たれた文字を取り出せる。ボタンの command に渡した関数の中で get() を呼ぶ。

考察ポイント:入力欄に打った文字が get() で取り出せること、ボタンを押したときにその時点の入力内容が得られることを観察する。

6. 演習5:ファイル選択ダイアログ

テーマ名:ファイル選択ダイアログでファイルを選ぶ

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウにボタンが表示される。ボタンを押すとファイル選択ダイアログが開き、ファイルを選ぶと、選んだファイルのパスがコマンドプロンプトに表示される。

import tkinter as tk
from tkinter import filedialog

def on_open():
    path = filedialog.askopenfilename()
    print("選んだファイル:", path)

root = tk.Tk()
button = tk.Button(root, text="ファイルを選ぶ", command=on_open)
button.pack()
root.mainloop()

ヒント:filedialog.askopenfilename() がファイル選択ダイアログを開き、選ばれたファイルのパスを文字列で返す。キャンセルした場合は空の文字列を返す。ボタンの command に渡した関数の中で呼ぶ。

考察ポイント:ボタンを押すとダイアログが開くこと、選んだファイルのパスが文字列で得られることを観察する。

7. 演習6:画像の表示

テーマ名:選んだ画像ファイルをウィンドウに表示する

手順:次のコードを実行する(メモ帳を用いる場合は a.py のようなファイル名で保存して実行)。ウィンドウにボタンが表示される。ボタンを押すとファイル選択ダイアログが開き、PNG または GIF の画像ファイルを選ぶと、その画像がウィンドウに表示される。

import tkinter as tk
from tkinter import filedialog

def on_open():
    path = filedialog.askopenfilename(filetypes=[("画像ファイル", "*.png *.gif")])
    image = tk.PhotoImage(file=path)
    label.config(image=image)
    label.image = image

root = tk.Tk()
button = tk.Button(root, text="画像を選ぶ", command=on_open)
button.pack()
label = tk.Label(root)
label.pack()
root.mainloop()

ヒント:tk.PhotoImage(file=パス) が画像を読み込む(PNG と GIF に対応)。読み込んだ画像をラベルの image に設定すると表示される。label.image = image は、画像が消えないように参照を残すために必要である。

考察ポイント:選んだ画像がウィンドウに表示されること、ファイル選択ダイアログ(演習5)と画像表示を組み合わせていることを観察する。

8. まとめ