Tkinterの使い方：ラベルウィジェット（Label）の使い方

このページにはプロモーションが含まれています

このページでは、Tkinter のラベルウィジェットの作成方法および設定方法について説明していきたいと思います。

ラベルウィジェットの使いどころ

ラベルウィジェットは特にユーザーに情報を伝えるのに適したウィジェットになります。

例えばラベルウィジェットで下記のようにユーザーに情報を伝えることができます。

「ボタンを押してください」などの文字列を表示することでユーザーへ次に行うべき操作を伝える
「処理中です…」などの文字列を表示することで、ユーザーへ現在のアプリの情報を伝える
「画像のサイズ」を表示することで、ユーザーへ読み込んだ画像の情報を伝える（画像処理アプリなど）

こんな感じでいろんな情報をユーザーに伝えることができるので、よりユーザーに親切なアプリ開発を行う際にラベルウィジェットは有用です。

当然「文字列を表示すること」を目的としたアプリ開発でも利用できます。

特にラベルウィジェットは「文字列」を表示することを目的に使用されることが多いので、「ラベルウィジェットの作り方」だけでなく、「どのように表示する文字列を設定するか」「どのように表示中の文字列を変更するか」のあたりはしっかりマスターしておくと良いと思います！

ラベルウィジェットの作成

ラベルウィジェットは下記を実行することで生成することができます。

Tkinter の Label クラスのインスタンスを生成する

ラベルウィジェットを生成するスクリプト例は下記のようになります。

ラベルウィジェットの作成

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")

# Label Widget
label = tkinter.Label(
	app,
	text="label",
	width=10,
	height=5,
)
label.pack()

app.mainloop()

実行すると下の図のようにメインウィンドウの中に「ラベルウィジェット」が表示されることが確認できると思います（見た目は OS 等により異なります）。

メインウィンドウの作成とメインループ

下記部分はメインウィンドウ作成時と同じものになります。

メインウィンドウの作成とメインループ

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")

# 略

app.mainloop()

メインウィンドウが何かわからない方は、下記ページで解説していますのでコチラも読んでみてください。

Tkinterの使い方：メインウィンドウを作成する

Tkinter ではメインウィンドウの上にウィジェットの作成や配置を行うことで GUI アプリを開発していきます。

さらに、そのウィジェットの作成や配置は、基本的に「メインウィンドウの作成〜メインループの前」の間に行います。

ですので、GUI アプリを作成する場合は、上記のスクリプトで行っているメインウィンドウの作成（および設定）とメインループ実行部分は毎回記述することになります。

ラベルウィジェットの作成（`Label()`）

ラベルウィジェットを実際に作成しているのは下記になります。tkinter.Label クラスのインスタンスを生成しており、これによりラベルウィジェットが作成されます。

ラベルウィジェットの作成

label = tkinter.Label(
	app,
	text="label",
	width=10,
	height=5,
)

第１引数に指定するのは、作成するラベルウィジェットを配置する親ウィジェットになります。

基本的に第１引数には下記を指定します（上記スクリプトではメインウィンドウ app を指定している）。

メインウィンドウ
サブウィンドウ
フレームウィジェット

キーワード引数でウィジェットの設定（オプション）を指定することも可能です。

ラベルウィジェットの設定についてはラベルウィジェットの設定で解説します。

ラベルウィジェットの配置

下記ではラベルウィジェットの配置を行なっています。

ラベルウィジェットの配置

label.pack()

ウィジェットは作成するだけでは画面に表示されません。

配置を行うことで画面に表示されます（厳密には配置した後に mainloop を実行することで表示される）。

ウィジェットの配置については下記ページで解説していますので、詳しく知りたい方はコチラを読んでいただければと思います。

Tkinterの使い方：ウィジェットの配置（pack・grid・place）

ラベルウィジェットの設定

ここではラベルウィジェットの作成時（tkinter.Label() 実行時）にキーワード引数で指定する設定について解説していきます。

設定できる全てのキーワードは下記により確認することができます。

設定可能なキーワード

# labelはLabelのインスタンス
print(label.keys())

ここでは私がよく使うもの・動作を理解しているものをピックアップして説明していきたいと思います。

MEMO

私の下記環境での実行結果をもとに説明していますが、環境によっては動きが異なるかもしれません

実際にご自身の環境で実行結果を確認していただくと、より確実に設定の効果を理解することができると思います

OS：macOS Catalina
Python：3.8
Tkinter：8.6

最初に代表的なキーワードに対する設定が、ラベルウィジェットの何を設定するかを表した一覧図を載せておきます。

`width`・`height`

width・heightキーワード引数を指定することで、ラベルウィジェットの幅と高さを設定することが可能です。

width を指定すれば、ラベルウィジェットの幅は「width で指定した値 × １文字の幅」に設定されます。

height を指定すれば、ラベルウィジェットの高さは「height で指定した値 × １文字の高さ」に設定されます。

`text`

text キーワード引数を指定することで、ラベルに表示する文字列を設定することが可能です。

文字列を複数行にしたい場合は、行と行の間に改行コードを挟みます。

複数行の文字列の設定例

# Label Widget
label = tkinter.Label(
	app,
	text="ラベル一行目です\n二行目です",
)

途中で表示する文字列を変更する可能性がある場合は、次に説明する textvariable が便利です（後に説明する config メソッドで文字列を変更することも可能です）。

`textvariable`

textvariable キーワード引数を指定することで、ラベルに表示する文字列を設定することが可能です。

textvariable キーワード引数には tkinter.StringVar クラスのインスタンスを参照する変数を指定します。

ラベルの文字列としては、この tkinter.StringVar のインスタンスに設定された文字列が表示されます。

tkinter.StringVar のインスタンスに設定される文字列は、tkinter.StringVar クラスの set メソッドを実行することで変更することが可能です。

下記は textvariable を設定し、ラベル上でマウスボタンが押された時に表示される文字列を変更する例になります。

textvariableの設定例

# -*- coding:utf-8 -*-
import tkinter

def label_click(event):
    global label_text

    label_text.set("クリックされました！！")

app = tkinter.Tk()
app.geometry("400x300")

label_text = tkinter.StringVar(app)
label_text.set("ココをクリックしてください")

# Label Widget
label = tkinter.Label(
    app,
    textvariable=label_text,
    width=20,
    height=5,
)
label.pack()

label.bind("<ButtonPress>", label_click)

app.mainloop()

上記スクリプトを実行すれば、ラベルをクリックする前のラベルに表示される文字列は「ココをクリックしてください」ですが、

ラベルをクリックすることで「クリックされました！」に表示される文字列が変化することが確認できます。

`font`

font キーワード引数を指定することで、ラベルに表示する文字列のフォントを設定することが可能です。

より具体的には、font キーワード引数には tkinter.font.Font クラスのインスタンスもしくはフォントの情報を格納したタプルを指定します。

下記はフォントの情報を格納したタプルを指定する例になります。これによりフォントファミリーが “Menlo“、フォントサイズが 50 のフォントでラベルの文字列が表示されます。

fontの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label = tkinter.Label(
    app,
    font=("Menlo", 50),
    text="LABEL0",
    width=10,
    height=2,
)
label.pack()

app.mainloop()

表示結果は下の図のようになり、フォントが変化していることが確認できると思います。

Tkinter で利用するフォントに関しては下記ページで解説していますので、コチラも参考にしてください。

Tkinterの使い方：フォントの指定方法

`foreground` (`fg`)・`background`（`bg`）

foreground と background キーワード引数を指定することで、「通常状態」のラベルの文字の色と背景色を設定することが可能です。それぞれは fg と bg で略することも可能です。

foreground にカラーコードもしくは色名を指定することで、「通常状態」のラベルの文字の色を変更することが可能です。

また background にカラーコードもしくは色名を指定すれば、「通常状態」のボタンの背景の色を変更することが可能です。

foregroundとbackgroundの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label = tkinter.Label(
    app,
    font=("Menlo", 50),
    text="LABEL0",
    width=10,
    height=2,
    foreground="yellow",
    background="blue"
)
label.pack()

app.mainloop()

`highlightcolor`・`highlightbackground`・`highlightthickness`

highlightcolor・highlightbackground・highlightthickness の指定により、ラベルにフォーカスがあてられた時＆フォーカスが外れた時のラベルの囲い線の設定が可能です。

highlightcolor：フォーカスがあてられた時の囲い線の色
highlightbackground：フォーカスが外れた時の囲い線の色
highlightthickness：囲い線の太さ（px）

下記はこれらのキーワードを指定するスクリプトの例になります。

foregroundとactiveforegroundの設定例

# -*- coding:utf-8 -*-
import tkinter

# クリックされたラベルにフォーカスを合わせる
def label1_click(event):
    global label1
    label1.focus()

def label2_click(event):
    global label2
    label2.focus()

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label1 = tkinter.Label(
    app,
    font=("Menlo", 50),
    text="LABEL1",
    width=10,
    height=1,
    highlightcolor="blue",
    highlightbackground="gray",
    highlightthickness=20
)
label1.pack()

label1.bind("<ButtonPress>", label1_click)

# Label Widget
label2 = tkinter.Label(
    app,
    font=("Menlo", 50),
    text="LABEL2",
    width=10,
    height=1,
    highlightcolor="blue",
    highlightbackground="gray",
    highlightthickness=20
)
label2.pack()

label2.bind("<ButtonPress>", label2_click)

app.mainloop()

上記スクリプトでは同じ設定のラベルを２つ（label1 と label2）を作成・配置しており、クリックされた方のラベルに focus メソッドを用いてフォーカスを合わせるようにしています。

スクリプトを実行すると下図のような画面が表示されます。

label1 と label2 共にフォーカスがあてられていないのでそれぞれのラベルを囲う線の色は highlightbackground で指定した灰色になります。線の太さは highlightthickness で指定した 20 px です。

LABEL1 の方のラベルをクリックすると、label1 にフォーカスが合わされるため、label1 を囲う線が highlightcolor で指定した青色に変わります。

LABEL2の方のラベルをクリックすると、label2 にフォーカスが合わされるため、label2 を囲う線が highlightcolor で指定した青色に変わります。

逆に label1 からフォーカスが外れるため、label1 の囲う線が highlightbackground で指定した灰色に戻ります。

`wraplength`

wraplength キーワードを指定することで、ラベルの文字列が自動的に改行されるサイズを設定することができます（１行のサイズが wraplength で指定したピクセル数になる）。

wraplengthの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label = tkinter.Label(
    app,
    text="ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789",
    width=10,
    height=4,
    background="blue",
    foreground="white",
    wraplength=90
)
label.pack()

app.mainloop()

例えば上記のスクリプトを実行すれば、ラベルの文字列が wraplength で指定した 90 px ごとに自動的に改行されるようになります。

wraplength を指定してなかった場合は改行されずに、ラベルの文字列が多い場合はラベル内に収まらなくなります。下図は wraplength 上のスクリプトから wraplength 指定を削除したスクリプトの実行結果になります。

`justify`

justify キーワードを指定することで、ラベルの文字列が複数行の場合に文字列を揃える位置を設定することができます。

justify に指定できる位置は下記のようになります。

tkinter.CENTER：各行を中央に揃える
tkinter.LEFT：各行を左側に揃える
tkinter.RIGHT：各行を右側に揃える

指定しない場合はデフォルトで tkinter.CENTER が指定されます。

`anchor`

anchor キーワードを指定することで、ラベルの文字列自体をラベル内のどこの方向に寄せるかを設定することができます。

anchor に指定できる方向は下記のようになります。

tkinter.N：上方向
tkinter.S：下方向
tkinter.W：左方向
tkinter.E：上方向
tkinter.NW：左上方向
tkinter.NE：右上方向
tkinter.SW：左下方向
tkinter.SE：右下方向
tkinter.CENTER：中央

上方向と北方向に見立てた方角で考えると覚えやすいです。例えば ↓ こんな感じ

上：北（North）
右上：北東（North East）
左下：南西（South West）

指定しない場合はデフォルトで tkinter.CENTER が指定されます。

`padx`・`pady`

padx と pady キーワードを指定することで、ラベル内の空白量を設定することが可能です。

padx・pady の設定例は下記のスクリプトにようになります。

padxとpadyの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label = tkinter.Label(
    app,
    text="ABC",
    width=10,
    height=4,
    background="blue",
    foreground="white",
    padx=20,
    pady=20
)
label.pack()

app.mainloop()

実行してアプリを起動すると、anchor=tkinter.SE 指定によりラベルの文字列が右下に寄せられるはずですが、縦方向横方向ともに 20 px 程度空白がある状態で配置されていることが確認できると思います。

この空白のサイズは padx・pady で指定した値（20）で設定されています。

`relief`

relief キーワードを指定することで、ラベルの見た目を設定することができます。

relief キーワードに指定できるのは下記の６つになります。

tkinter.RAISED
tkinter.SUNKEN
tkinter.FLAT
tkinter.RIDGE
tkinter.GROOVE
tkinter.SOLID

例えば relief キーワードに tkinter.RAISED を指定した場合のスクリプト下記のようになります。

reliefの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")
app.title("ラベルウィジェット")


# Label Widget
label = tkinter.Label(
    app,
    text="ABC",
    width=10,
    height=4,
    background="blue",
    foreground="white",
    relief=tkinter.RAISED,
    bd=20
)
label.pack()

app.mainloop()

スクリプトを実行するとラベルが下図のように表示され、ラベルの見た目が変化していることが確認できると思います（特に bd を設定して枠線の太さを太くすると違いが分かりやすくなります）。

`image`

image キーワードを指定することで、ラベルに画像を表示することができます。

image キーワードには表示したい画像を設定した PhotoImage クラスやBitmapImage クラスのインスタンスを指定します。

下記は image キーワードの指定例です（”cute_cat_300.png” の部分はご自身で用意した画像ファイルへのパスを指定して課題）。

imageの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("600x400")
app.title("ラベルウィジェット")

# Image
image = tkinter.PhotoImage(
    file="cute_cat_300.png"
)

# Label Widget
label = tkinter.Label(
    app,
    image=image,
)
label.pack()

app.mainloop()

スクリプトを実行すれば下図のようにアプリ内（ラベル内）に画像が表示されます。

`compound`

image キーワードを指定して画像を表示すると、通常は text キーワードに文字列を指定しても文字列は表示されません。

しかし、この compound キーワードを指定することで、ラベルに文字列と画像を両方を表示することができます。

compound キーワードでは「画像に対する文字列の配置位置」を指定します。指定できる具体的な値は下記の５つになります。

tkinter.LEFT
tkinter.RIGHT
tkinter.BOTTOM
tkinter.TOP
tkinter.CENTER

例えば tkinter.LEFT を指定すれば「画像の左」に文字列が配置されて表示されます。

下記は compound キーワードに thinter.LEFT を指定する例です。

compoundの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("600x400")
app.title("ラベルウィジェット")

# Image
image = tkinter.PhotoImage(
    file="cute_cat_300.png"
)

# Label Widget
label = tkinter.Label(
    app,
    image=image,
    text="LABEL",
    foreground="red",
    font=("Menlo", 50, "bold"),
    compound=tkinter.LEFT
)
label.pack()

app.mainloop()

スクリプトを実行すれば compound の指定通り、画像の左に文字列が表示されていることがかくにんできます。

tkinter.CENTER を指定すれば画像の中央に文字列を表示することも可能です。

`bitmap`

bitmap キーワードを指定することにより、OS にもともと用意されているビットマップ画像をラベル内に表示することができます。

おそらく OS によって異なると思いますが、MacOSX では下記を指定することができます。

"document"
"stationery"
"edition"
"application"
"accessory"
"folder"
"pfolder"
"trash"
"floppy"
"ramdisk"
"cdrom"
"preferences"
"querydoc"
"stop"
"note"
"caution"

下記は MacOSX で指定可能な全ビットマップ画像をアプリ上の各ラベル内に表示するサンプルスクリプトになります。

bitmapの設定例

# -*- coding:utf-8 -*-
import tkinter

# Macに用意されているビットマップ名リスト
bitmap_list = [
	"document",
	"stationery",
	"edition",	
	"application",
	"accessory",
	"folder",
	"pfolder",	
	"trash",
	"floppy",
	"ramdisk",
	"cdrom",
	"preferences",
	"querydoc",
	"stop",
	"note",
	"caution",
]

app = tkinter.Tk()

# 全ビットマップをラベルに表示
i = 0
j = 0
for bitmap in bitmap_list:

	label = tkinter.Label(
		app,
		bitmap=bitmap,
	)
	label.grid(
		row=j, column=i,
		padx=10, pady=10,
	)

	# ラベルの配置位置調整
	i = i + 1
	if i >= 8:
		i = 0
		j = j + 1

app.mainloop()

実行してアプリを起動すると下のような画面が表示されます。Mac を使っているとよく目にするビットマップ画像がアプリに表示されることを確認できると思います。

`cursor`

cursor キーワードではラベル上にマウスカーソルが入ったときのカーソルの見た目（アイコン）を設定することができます。

例えば cursor には下記のような値を設定することが可能です。

"hand"
"ibeam"
"wait"
"poof"

cursor に関しても bitmap 同様に OS 毎に指定可能な値が異なる可能性が高いです。

cursor によりラベルの上にマウスカーソルが入った時の見た目を設定するサンプルスクリプトは下記のようになります。

cursorの設定例

# -*- coding:utf-8 -*-
import tkinter

app = tkinter.Tk()
app.geometry("400x300")


# Label Widget
label1 = tkinter.Label(
    app,
    font=("Menlo", 50),
    text="LABEL1",
    width=10,
    height=1,
    cursor="hand"
)
label1.pack()

app.mainloop()