lisz-works

技術と興味の集合体

tkinter 簡素なUIはgridでレイアウトがオススメ

【スポンサーリンク】

Python

Python3で簡単に簡単なGUIを作るライブラリ「tkinter」についてです。

今回はgrid()での、ラベルやボタンなどのオブジェクトを、ウィンドウに追加していく方法についてです!

ある程度の体裁を、サクッと作るのにオススメです!

grid()で構築していく

grid()は、ラベルやボタンなどを、ウィンドウに設置していくのに使う関数の1つです。

grid()の特徴は、名前の通り、グリッド状にものが置けることです。

イメージとしては、ExcelやSpreadsheetsなどの表計算ソフトを想像するとよいです。
表計算ソフトでいう各セルに、ラベルやボタンなどを配置していったような見た目にする感じですね。

1番簡単なgrid()

grid()で連続して追加していくことで、縦にどんどん追加いくことができます。

例えばこんな感じ。

縦に追加していく

この画面はこのようにコーディングしています。

root = tk.Tk()
root.title(u"test app")
root.geometry("400x300")
label1 = tk.Label(root, text='これはラベル1です')
label1.grid()
label2 = tk.Label(root, text='これはラベル2です')
label2.grid()
label3 = tk.Label(root, text='これはラベル3です')
label3.grid()
label4 = tk.Label(root, text='これはラベル4です')
label4.grid()
root.mainloop()

どんどん次の行に追加されていくイメージですね!

「とりあえず単純に表示したいだけ」

という場合は1番簡素で、かつオブジェクトを並べて表示できます。

デバッグ情報の表示~みたいな場合は、もはやこれでいい気がしますね。

行列を指定してgrid()

「表計算のような~」と前述しましたが、そのとおり行列を指定して追加していくことができます。

例えばこんな感じ。

表計算のように配置していく

これはこのようにコーディングしています。

root = tk.Tk()
root.title(u"test app")
root.geometry("400x300")
label1_1 = tk.Label(root, text='これはラベル1-1です')
label1_1.grid(row=1, column=1)
label1_2 = tk.Label(root, text='これはラベル1-2です')
label1_2.grid(row=1, column=2)
label2_1 = tk.Label(root, text='これはラベル2-1です')
label2_1.grid(row=2, column=1)
label2_2 = tk.Label(root, text='これはラベル2-2です')
label2_2.grid(row=2, column=2)
root.mainloop()

grid()を使うとき、

  • row : 行
  • column : 列

指定します。

これによって「どの位置に配置するか?」を指定することができます。

注意1:要素を飛ばす場合は他のセルが影響する


memo: 行列飛ばしは、他の要素が飛ばした行列にいないと飛ばせない 2-2がいて1-3を作るのは、「2列目の幅」がわかっているので飛ばせるが いない場合、飛ばせない

恐らく「間に入るセルの幅がわからない」=幅0(1?)で要素が置かれるため、事実上飛ばせない、ということになっていると思われる

「行列を指定したとき、指定するマス飛ばしたらどうなるのか?」というと……

グリッド内の行列で飛ばした位置、またはその隣接位置に要素があるか?が影響してきます。

例えばこのように設置した場合

列1 列2 列3
行1 Label Label
行2 Label Label

行1-列3のラベルはキレイに設置できます。

列を飛ばして作成

しかしこれが

列1 列2 列3
行1 Label Label
行2 Label

というように設置した場合、このような表示となってしまいました。

列が飛ばせていないような表示になる

行でも同じようなことが起きます。

行が飛ばせていないような表示になる

同行列または隣接行列がいないと空白状態となる

なぜこのような表示になるのか?ですが、同じ行列や隣接行列がいないと、恐らく「空白状態=幅0が挟まれて追加される」という状況なのだと思われます。

しかし他の行で「列2」があった場合、ウィンドウ側は列2の幅がわかります。

そのため1行目の列3は、きちんと余白を取った形となります。

列の幅による余白

ウィンドウ側としては、あくまで「きちんと言われたとおりの幅を取っていた」ということになりますね。

注意2:幅が同列の大きいものに引っ張られる

空白を開けた場合を見ていたらわかるかもしれませんが、その列の幅は全体の列の幅で最長のものが適用されます。

例えば

  1. 名前
  2. ここ数日で1番面白かったこと

という入力フォームを作ったとします(謎の内容ですが)。

するとこうなります。

最長の幅がその列の幅

「名前」に対して、「面白かったこと」が長く、テキストボックスとの間にかなりの余白がありますね。

表計算ソフトで、幅の自動調整をしたときと似ていますね。

このように

「多少適当でいいけど、ある程度はキレイなフォームにしたいなー」

と、お考えの場合は、注意が必要です。

あとがき

Python3のGUI作成ライブラリ「tkinter」で、grid()を使ったUIの作り方についてでした。

注意点はあるものの、かなり簡素に整ったフォームが作れます。

「PythonでサクッとGUI作りたい」

という方は、ぜひお試しあれ!

tkinterの説明はコチラ。