Python tkinterのFrameの使い方〜サンプルコード+スライドつき〜

pythonを用いて、GUIソフトを作成する際にTkinterが使用されることが多いです

tkinterではウィジェットと呼ばれる数種類の部品を使いながら、GUI画面を作ってきます

このとき「Frame」を使用することで、GUIソフトの開発に役立てることができます

この記事では、pythonのtkinterを使用する際に、重要になるFrameについて、実例と詳しいスライドを使って解説をしていきたいと思います

実際に手を動かしながら進めていくと、理解が深まると思います！

この記事でわかること

レイアウトを綺麗で楽に作ることができる
アプリの部品化をする方法
pythonのtkinterでサンプルアプリを作る方法

Contents

1 python tkinterのFrameについて
2 Frameをうまく使えば綺麗なレイアウトが作れる
- 2.1 tkinterのサンプルコードに少し付け足し
3 python学習でつまづかないためには？
- 3.1 python初心者におすすめのプログラミングスクール

python tkinterのFrameについて

python tkinterのFrameとは、ウィジェットと呼ばれる部品を配置しておく入れ物のことを指します

Frameはメインウィジェットの中に配置され、ウィジェットはFrameの中に配置されていくことになります

イメージとしては以下のような感じです

tkinterでGUIソフトを作成する上で、Frameは使わなくても大丈夫です

しかし、Frameを使用することで、複雑なレイアウトも簡単に行うことができ、GUI画面の自由度が増します

Frameの作成

Frameを作成するには、以下のコードを入力します

frame=tk.Frame(root,option)

第一引数には親ウィジェットを、第二引数以降はオプションを指定します

Frameのオプション一覧

オプション	値	説明
width	int	フレームの横幅
height	int	フレームの縦幅
relief	flat（デフォルト）,raised sunken,groove,ridge	フレームの枠を指定
bg or background	color	フレームの背景色
bd or borderwidth	int	ボーダーの幅
cursor	マウスポインタの種類	マウスポインタの見た目を指定
pady	int	枠とテキストとの間の縦の空白
padx	int	枠とテキストとの間の横の空白
takefocus	True, False	Tabキーでのフォーカス移動の有無

Frameの配置

Frameを配置するには以下の3種類の方法があります

pack
grid
place

pack/grid/placeはFrameだけではなく、その他のウィジェットを配置する際にも使用します

Frameは作成するだけでは、GUI画面上に表示されません

pack/grid/placeのいずれかを使用して、配置をする必要があります

packでの配置

ここからは実際に配置していき、pack/grid/placeの違いについて確認していきます

まずはpackからいきます

今回はラベル、ボタン、テキストボックスを配置していきます

# tkinterのインポート
import tkinter as tk

# rootメインウィンドウの設定
root = tk.Tk()
root.title("Frame")
root.geometry("300x100")

frame = tk.Frame(root, pady=10, padx=10)
frame.pack()

label = tk.Label(frame, text='ラベル')
entry = tk.Entry(frame)
button = tk.Button(frame, text='ボタン')

label.pack()
entry.pack()
button.pack()

root.mainloop()

gridでの配置

次はgridで配置をしていきます
gridで配置をする場合には、rowとcolumnで配置する場所を決める必要があります

rowは行、columnsは列になります

# tkinterのインポート
import tkinter as tk

# rootメインウィンドウの設定
root = tk.Tk()
root.title("Frame")
root.geometry("300x100")

frame = tk.Frame(root, pady=10, padx=10)
frame.grid()

label = tk.Label(frame, text='ラベル')
entry = tk.Entry(frame)
button = tk.Button(frame, text='ボタン')

#横一列に配置
label.grid(row=1,column=1)
entry.grid(row=1,column=2)
button.grid(row=1,column=3)

root.mainloop()

placeで配置

最後にplaceで配置を行なっていきます
placeではx座標とy座標を決めて、配置していく必要があります

# tkinterのインポート
import tkinter as tk

# rootメインウィンドウの設定
root = tk.Tk()
root.title("Frame")
root.geometry("300x100")

frame = tk.Frame(root, pady=10, padx=10)

label = tk.Label(text='ラベル')
entry = tk.Entry()
button = tk.Button(text='ボタン')

label.place(x=120,y=30)
entry.place(x=50,y=60)
button.place(x=110,y=100)

root.mainloop()

tkinterでのplaceではx,y座標を定める必要がありますが、左上がスタート位置となります
そこから左右がx座標、上下がy座標となっています

placeを使用することで、おきたい場所にピンポイントでウィジェットを配置することができます

また、textvariableを使うことで、テキストボックスに入力した文字列を、即座にレベルなどに反映させることができます

Python tkinterのtextvariableについて〜サンプルコード+図解付きtkinterを使ってアプリを作成していると、文字入力を反映させる場面がよく出てきます。このとき、textvariableを使うことでコードを簡単にすることができます。今回はpythonのtkinterでtextvariableをどのように使うのかについて解説をしていきたいと思います。...

Frameをうまく使えば綺麗なレイアウトが作れる

tkinterで配置する際のpack, grid,placeについて紹介をしてきましたが、Frameをうまく使えば綺麗なレイアウトを作ることができます

ウィジェットが一つや二つの場合には問題ないですが、ウィジェットの数が増えて、複雑になってくる時にこそFrameは力を発揮します

上記のようにFrameをいくつも指定することで、その中にウィジェットを配置することができますし、Frame自体もpack, grid,placeで配置することができるので、ウィジェットが増えてきても綺麗に配置することができます

実際に以下のように配置をしてみましょう

# tkinterのインポート
import tkinter as tk
# rootメインウィンドウの設定
root = tk.Tk()
root.title("Frame")
root.geometry("300x300")

frame = tk.Frame(root)
frame.grid(row=0,column=1)
frame2=tk.Frame(root)
frame2.grid(row=0,column=2)

text=tk.Text(frame)
label = tk.Label(frame2, text='ラベル')
entry = tk.Entry(frame2)
button = tk.Button(frame2, text='ボタン')

text.grid(row=0,column=1)
label.grid(row=0,column=2)
entry.grid(row=1,column=2)
button.grid(row=2,column=2)
root.mainloop()

Frameを使いこなすことができれば、綺麗なレイアウトのアプリを作成することができるので、ぜひ活用してみてください！

tkinterのサンプルコードに少し付け足し

tkinterのサンプルコードに少し付け足すだけで、テキストボックスに入力した値をテキストウィジェットに反映させることができます

これは、配置しているボタンに.get()の機能を持たせることで可能になります

今回のサンプルコードでは実用性が低いですが、テンプレの文章を入力する場合などに活用することができます

# tkinterのインポート
import tkinter as tk
# rootメインウィンドウの設定
root = tk.Tk()
root.title("Frame")
root.geometry("300x300")

frame = tk.Frame(root)
frame.grid(row=0,column=1)
frame2=tk.Frame(root)
frame2.grid(row=0,column=2)

text=tk.Text(frame)
label = tk.Label(frame2, text='ラベル')
entry = tk.Entry(frame2)

#.get()は入力されている値を取得する
#.insert()は指定のウィジェットに値を入力する
def btnclick():
    text.insert(tk.END,"今日の気温は"+entry.get())

#command=関数名はボタンがクリックされた時に実行する関数を設定する
button = tk.Button(frame2, text='ボタン',command=btnclick)
text.grid(row=0,column=1)
label.grid(row=0,column=2)
entry.grid(row=1,column=2)
button.grid(row=2,column=2)
root.mainloop()