Tkinter で初めての Python GUI を構築する

序章

Python の学習を始めたばかりで、簡単なアプリケーションを 1 つまたは 2 つ制作したことがあるかもしれません。おめでとう！しかし、今何ですか？では、ピカピカの新しい Python アプリと対話するためのグラフィカル ユーザー インターフェイス ("GUI") を構築するのはどうでしょうか?

Python で GUI アプリケーションを構築するには、 やなど、いくつかのオプションがあります。ただし、このガイドではについて紹介します。

「Tk インターフェイス」の略であるTkinterは、GUI を構築するための Python の標準であり、 に含まれています。これは、さまざまなプログラミング言語でグラフィカル インターフェイスを構築するために使用できる GUIウィジェットの無料のオープン ソース ライブラリであるTk GUI ツールキットへのバインディングです。

このチュートリアルでは、ユーザーが選択したタイムゾーンで現地時間を表示する基本的な GUI アプリケーションの設計について説明します。この手順では、アプリケーションを段階的に構築し、GUI 要素のレイアウト、ユーザー入力のキャプチャ、GUI 要素のコールバック メソッドへのバインドなど、 Tkinterを操作する際の重要な概念のいくつかについて説明します。

前提条件

このガイドを结束するには、次のものが必要性です。

• ました。
• インストールされたpip 。
• pytzタイムゾーン ライブラリをインストールしました。ライブラリはpipを使用してインストールできます。

 pip install pytz

ステップ 1 - 新しい Python アプリケーションを作成し、必要なインポートを設定する

timezone.pyという名前の新しい Python アプリケーションを作成し、次のimportステートメントを追加してTkinter 、 datetime 、およびpytzモジュールをインポートします。

 import tkinter as tk import datetime import pytz

ステップ 2 - タイムゾーンを追加する

このガイドには、 pytzでサポートされているタイムゾーンのごく一部である米国のタイムゾーンのセットが組み込まれています。アプリケーションの機能は、追加のpytzタイムゾーン名を追加することで拡張できます。次のコマンドを実行すると、 pytzで使用できるタイムゾーンの完全なリストを出力できます。

 print(pytz.all_timezones)

pytzを介して利用可能な米国のタイムゾーンのセットは、リストとして指定されます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"]

ステップ 3 - Tk クラスのインスタンスを作成する

Tkクラスをインスタンス化すると、タイムゾーン アプリケーションの GUI のメイン ウィンドウとして機能するルート ウィンドウが作成されます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk()

ステップ 4 - メイン ウィンドウのセットアップ

この手順では、ルート ウィンドウ、特にそのタイトル、ジオメトリ、およびサイズ変更或者性を構成します。

ステップ 4a - メイン ウィンドウのタイトルを設定する

ウィンドウのタイトルはtitleメソッドを使用して設定されます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application")

ステップ 4b - メイン ウィンドウの幅と高さの設定

ウィンドウの幅と高さの値 (ピクセル単位) を変数に割り当てて、コードを认识しやすくすることができます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175

ステップ 4c - メイン ウィンドウの中心位置の計算

メイン ウィンドウは画面のどこにでも配置できます。たとえば、中央、左上隅などです。中央に配置されたウィンドウは見栄えがよく、ルート ウィンドウのwinfo_screenwidth()を使用してメイン ウィンドウの中央位置を決定できます。 winfo_screenwidth()およびwinfo_screenheight()メソッドといくつかの簡単な計算。これら 2 つのメソッドは、メイン ウィンドウを中央に配置するための適切な (x,y) 座標を計算するために使用される画面の幅と高さを返します。ウィンドウの幅と高さと同様に、中心位置の値も変数に割り当てて、コードを読みやすくすることができます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2)

center_xとcenter_yの値もピクセルで表され、両方の計算値が整数になるようにintが使用されることに注意してください。

ステップ 4d - メイン ウィンドウのジオメトリの設定

メイン ウィンドウのサイズと位置を指定するrootウィンドウ ジオメトリは、ルート ウィンドウのgeometryメソッドを使用して設定されます。簡単にするために、実行時にジオメトリ変数の式を補間する、書式設定された文字列リテラルまたはf-stringを使用できます。次のコード ブロックに従って、 f-stringリテラルはgeometryメソッドにパラメーターとして渡されます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}")

ステップ 4e - メイン ウィンドウのサイズ変更可能性の設定

x 軸と y 軸に沿ったルート ウィンドウのサイズ変更可能性は、ルート ウィンドウのresizableなメソッドを介して設定できます。 resizableなメソッドは、 heightとwidthのパラメーターをこの順序で受け入れます。いずれかのパラメーターのTrueまたはゼロ以外の値は、メイン ウィンドウが関連付けられた軸に沿ってサイズ変更可能であることを指定します。いずれかのパラメーターのFalseまたは0の値は、メイン ウィンドウが指定された軸に沿ってサイズ変更できないことを指定します。タイマー アプリケーションは、高さと幅の両方にFalseの値を使用して、メイン ウィンドウのサイズが変更されないようにします。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False)

ステップ 5 - ウィジェット レイアウトのグリッドを指定する

ウィジェットは、ジオメトリ マネージャーを使用してさまざまな方法でメイン ウィンドウの上に配置できます。通常、ウィジェットは次の 3 つの方法で配置できます。

1. pack()メソッドを使用してパックされます。 pack()ジオメトリ マネージャーは、ルート ウィンドウまたは親ウィジェットに追加される前に、ウィジェットをブロックに編成します。パッキングについて考える不完全だがおそらく役立つ方法は、食料品を買い物袋に追加することを考えることです。アイテムは、必ずしもバッグ内の事前定義された場所に追加されるとは限りません。むしろ、すべてのアイテムがバッグに入れられるまで、使用可能なスペースを使用して、次々と梱包されます。 pack()ジオメトリ マネージャも同様に機能します。

2. place()メソッドを使用して配置されます。 place()ジオメトリ マネージャーは、ウィジェットをルート ウィンドウまたは親ウィジェットの特定の事前定義された位置に配置します。このジオメトリ マネージャーは、正確な GUI レイアウトを構築するときに明らかに役立ちます。

3. grid()メソッドを使用してグリッドとして配置します。グリッドは、2 次元の行/列テーブルです。ウィジェットを配置する特定の行と列を指定して、ウィジェットをグリッドに追加します。グリッドは、ルート ウィンドウのcolumnconfigureおよびrowconfigureメソッドを使用してセットアップされます。これらの各メソッドには、 indexとweightの属性があります。 index属性は、開始基準0を使用して列または行の位置を指定します。 weight属性は、他の列に対する特定の列または行のサイズを指定します。たとえば、列 0の重みが1で、列 1の重みが3の場合、列 1は列 0の 3 倍の大きさになります。

   
   

グリッドは成分を隣り合わせに增加する場合に便利店で、実装も比較的簡単です。タイムゾーン アプリケーションは、4 つの等しい列に划分されたメイン ウィンドウ グリッドを施用します。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1)

ステップ 6 - ウィジェットを追加する

このステップでは、ステップ 4 で定義したメイン ウィンドウ グリッドにウィジェットを追加します。タイムゾーン アプリケーションは 3 つのTKinterウィジェットを使用します。

• Label
• Listbox
• Button

Tkinter のLabelウィジェットとButtonウィジェットは、その名前の通りです。 Labelウィジェットを使用すると、プログラマはテキスト (つまり、ラベル) を表示できますButtonウィジェットは、ボタンを表示するために使用されます。 Listboxウィジェットは、オプションのリストから値を選択するために使用されます。

もちろん、 SpinBox 、 Entry 、 Messageウィジェットなど、上記の 3 つ以外のウィジェットもあります。正式なは、Tk ツールキットで利用できるウィジェットについて詳しく知るのに役立つリソースです。

ステップ 6a - ウィジェットを作成する

各ウィジェット クラスのインスタンスは、GUI デザインで使用される特定のウィジェットに対して作成されます。タイムゾーン アプリケーションは、2 つのLabelウィジェット、1 つのListboxウィジェット、および 1 つのButtonウィジェットの 4 つのウィジェット インスタンスを使用します。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="")

上記のコード ブロックに見られるように、各ウィジェット インスタンスはrootウィンドウに「接続」されています。 Listboxウィジェットには、特別な Tkinter Variable()クラスのインスタンス化も必要です。これは、ユーザーがListboxのlistvariable属性を介して選択できるタイムゾーン オプションのリストをウィジェットに提供するために使用されます。各Labelウィジェットによって表示されるテキストは、 text属性を使用して構成できます。 time_labelのテキスト値は、ユーザーが選択したタイムゾーンの時間を「取得」するたびに動的に設定されるため、空白のままにします。

ステップ 6b - ウィジェットをグリッドに配置する

ステップ 5a で作成されたウィジェット インスタンスは、 grid()メソッドを使用して、ステップ 4 で定義されたグリッドに配置できます。タイムゾーン アプリケーションは、次のgrid()メソッド属性を使用してレイアウトを定義します。

• column : 0基準を使用してウィジェットが配置される特定の列を指定します。

• row : 0ベースを使用してウィジェットが配置される特定の行を指定します。

• columnspan : ウィジェットが指定された数の列にまたがるように指定します。たとえば、値がcolumnspan=3のウィジェットは、ウィジェット自体が 3 列より小さい場合でも、3 列にまたがります。

• sticky : Tkinter のデフォルトの動作は、セルの水平方向および垂直方向の中央 (つまり、特定の行/列の位置) にウィジェットを配置することです。このデフォルトの動作は、コンパスのような値 ( NW 、 N 、 NE 、 W 、 E 、 SW 、 S 、 SEなど) を使用するsticky属性を使用してオーバーライドでき、ウィジェットのセル内の特定の位置にウィジェットを配置できます。たとえば、 sticky=tK.Wは、ウィジェットをグリッド セルの西隅に配置するように指定します。同様に、 sticky=tK.Eは、ウィジェットをグリッド セルの東隅に配置する必要があることを指定します。

• padx 、 pady : padxおよびpady属性は、ピクセルで指定された値でそれぞれ x 軸および y 軸のパディングを追加するために使用されます。当然のことながら、パディングは、ウィジェットがルート ウィンドウや他のウィジェットの端に直接「ぶつかる」ことがないように、よりプロフェッショナルな外観の GUI を提供できます。

  
  

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10)

ステップ 7 - Get Time ボタンのコールバック メソッドを作成する

手順 5 で作成したselect_timezone_buttonボタンをユーザーがクリックしたときにイベントを処理するには、コールバック メソッドを定義する必要があります。

ステップ 7a - Get Time ボタンのバインド

コールバック ロジックを定義する前に、最終的にコールバック コードを含むメソッド名にボタンをバインドすることをお勧めします。 bind()メソッドをlambda関数と組み合わせて使用して、 select_timezone_buttonを指定されたコールバック メソッドにバインドできます。また、 lambda関数を使用してselect_timezone_listboxおよびtime_labelウィジェットへの参照をコールバック パラメータとして渡すことにも注意してください。 select_timezone_listboxとtime_labelはグローバル スコープ内にあるため、これらのコールバック パラメータは実際には必要ありません。ただし、引数をコールバック関数に渡す方法を示すことは間違いなく役に立ちます。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_button.bind("<Button>", lambda e, args=[select_timezone_listbox, time_label]: get_timezone_time(e, args))

ステップ 7b - コールバック ロジックの定義

ボタン クリック イベントを処理するためのコールバック ロジックを下に定義します。

 def get_timezone_time(e, args): select_timezone_listbox = args[0] time_label = args[1] selection_index = select_timezone_listbox.curselection() selected_timezone = select_timezone_listbox.get(selection_index) now_time = datetime.datetime.now() tz_time = now_time.astimezone(pytz.timezone(selected_timezone)) tz_formatted = tz_time.strftime("%H:%M:%S") time_label.configure({"text": f"The time in {selected_timezone} is {tz_formatted}."}) time_label.update()

curselection()およびget()メソッドは、ユーザーが選択したタイムゾーンをselect_timezone_listboxウィジェットへの参照から取得するために使用されます。次に、ユーザーの現在の時刻が、選択したタイムゾーンの時刻に変換されます。最後に、 configureメソッドを使用して、 time_labelへの参照のtext属性を、選択したタイムゾーンの現地時間に変更します。 update()メソッドは、 time_labelウィジェットを新しいテキスト値で更新するよう「強制」するために使用されることに注意してください。

ステップ 8 - アプリケーションを完成させて実行する

ルート ウィンドウのmainloop()メソッドは、コードの最後の行として適用されます。 mainloop()メソッドは、ユーザーが終了するまで GUI を無限ループで実行します。

做完したコードは次のとおりです。

 import tkinter as tk import datetime import pytz timezones = ["US/Alaska", "US/Aleutian", "US/Arizona", "US/Central", "US/East-Indiana", "US/Eastern", "US/Hawaii", "US/Indiana-Starke", "US/Michigan", "US/Mountain", "US/Pacific", "US/Samoa"] def get_timezone_time(e, args): select_timezone_listbox = args[0] time_label = args[1] selection_index = select_timezone_listbox.curselection() selected_timezone = select_timezone_listbox.get(selection_index) now_time = datetime.datetime.now() tz_time = now_time.astimezone(pytz.timezone(selected_timezone)) tz_formatted = tz_time.strftime("%H:%M:%S") time_label.configure({"text": f"The time in {selected_timezone} is {tz_formatted}."}) time_label.update() root = tk.Tk() root.title("Simple Timezone Application") window_width = 450 window_height = 175 screen_width = root.winfo_screenwidth() screen_height = root.winfo_screenheight() center_x = int((screen_width - window_width)/2) center_y = int((screen_height - window_height)/2) root.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}") root.resizable(False, False) root.columnconfigure(0, weight=1) root.columnconfigure(1, weight=1) root.columnconfigure(2, weight=1) root.columnconfigure(3, weight=1) # Instance of Label widget class for selection prompt. select_timezone_label = tk.Label(root, text="Please select a timezone.") # Instance of Listbox class for selection of timezone from list. list_var = tk.Variable(value=timezones) select_timezone_listbox = tk.Listbox(root, listvariable=list_var, height=1) # Instance of Button class to get the local time in the selected timezone. select_timezone_button = tk.Button(root, text="Get Time") # Second instance of the Label class to display the local time in the selected timezone. time_label = tk.Label(root, text="") # Place widgets on grid. select_timezone_label.grid(column=0, row=0, columnspan=4, sticky=tk.W, padx=10, pady=10) select_timezone_listbox.grid(column=0, row=1, columnspan=3, sticky=tk.EW, padx=10, pady=10) select_timezone_button.grid(column=4, row=1, sticky=tk.E, padx=10, pady=10) time_label.grid(column=0, row=4, columnspan=4, sticky=tk.W, padx=10, pady=10) # Bind button to callback. select_timezone_button.bind("<Button>", lambda e, args=[select_timezone_listbox, time_label]: get_timezone_time(e, args)) root.mainloop()

アプリケーションを起動すると、GUI は次のようになります。

アプリケーションを使用するには、リスト ボックスをクリックし、キーボードの上下カーソル キーを使用してタイムゾーン オプションをスクロールします。 [時刻を取得] ボタンをクリックして、選択したタイムゾーンで現在の時刻を表示します。

次のステップ

Tkinterを使用した最初の Python GUI アプリケーションの作成、おめでとうございます!はじめにで述べたように、このガイドはいくつかの基本的な概念を紹介するように設計されています。前述のとリファレンスは、より高度な Tkinter の特徴と機能について学習するのに役立つ 2 つの優れたリソースです。

Tkinter GUI アプリケーションは、非ネイティブなルック アンド フィールを持っていると批判されることがあります。それは本当かもしれません。しかし、ツールキット ウィジェットは宽度に構成几率であり、Tkinter GUI アプリケーションは、外观の Python パッケージをインストールする一定要なく比較的速度快に構築できます。

正式的なドキュメント本身にも、Tkinter を操作してより洗練された GUI アプリケーションを構築する的办法を学ぶための無数のチュートリアルがインターネット経由で多买できます。