Python3最新版対応 Tkinterのまとめ

# こんにちは
最近PythonでUIを作ってみようと思ったのですが、画面上にウィンドウなどを表示させるためのモジュールである"Tkinter"についてのネット情報が動作しないものが(バージョンやハードの関係で)一部あったりしたので、
私なりに最新版に対応している情報をまあまあ詳しくまとめてみました。
あと、私がつまずいた注意ポイントなども載せているので、参考になると幸いです。

# 動作環境
Windows / Mac / Linuxといった主要なプラットフォームで動作

# Tkinterの基本文

```test.py
import sys
import tkinter

root = tkinter.Tk()
#他のコードはここに記載
root.mainloop()
```

実行するとこんな感じ。小さなTkというウィンドウが表示されます。
![スクリーンショット 2021-10-31 21.17.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/f9c1f82a-928f-7551-1dcc-3d185765f1d2.png)

:::note warn
ちなみに、pyファイルの名前をtkinter.pyにするとエラーが出ます。
tkinterを使うからといってtkinter.pyにするとえらい目に遭いましたww
:::

(このようなエラー内容です。)

```tkinter.py
AttributeError: partially initialized module 'tkinter' has no attribute 'Tk' (most likely due to a circular import)
```

## ウィンドウタイトル
ウィンドウの上についていた文字を変えるには基本文に加えて、このようにかきます。

```python
root.title("ウィンドウのタイトル")
```

実行するとこんな感じに、ウィンドウタイトルが変わっています。
![スクリーンショット 2021-10-31 21.21.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/8bccea62-f9ca-82a0-0702-e8bcc737fcfe.png)

勿論、ダブルクォーテーション(")の中の文字を変えるとタイトルが変わります。

プログラム全文

```window_title.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.mainloop()
```

## ウィンドウサイズ
ウィンドウのデフォルトサイズを変えるには、基本文に加えて、このようにかきます。

```python
root.geometry("横x縦")
```

試しに500x700のウィンドウを作ると、このように縦に長いウィンドウができます。
![スクリーンショット 2021-10-31 21.29.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/399e6b42-2512-8877-c994-532e528b69b0.png)

プログラム全文

```window_size.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x700")
root.mainloop()
```

## タイトルバーを隠す
タイトルバーは、ウィンドウにあるこういうやつなんですけど、これをTkinterで隠す方法があるので紹介します。
![スクリーンショット 2021-11-10 18.42.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/89f3b516-7186-8a82-26ea-1236d87f6c1b.png)
```#他のコードはここに記載```に次のように追加します。

```python
root.overrideredirect(True)
```

実行結果。ダークモードは気にしないでいただきたい。
![スクリーンショット 2021-11-10 18.41.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/4feb59aa-94b8-8c31-cdd1-667f55622da2.png)


## 最大化の無効化
最大化の無効化は意外と役に立ちます。
タイトルバーを無効化するのと同じところに、このように記載します。

```python
root.resizable(0, 0)
```

実行結果。最大化が押せなくなっています。
![スクリーンショット 2021-11-10 18.47.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/df94246f-bdc4-0470-0f02-661ff991be3c.png)


#Tkinterの要素
ここからがメインです。Tkinterでは主にGUIを作るための要素が用意されています。

##ラベル
ラベルとは、普通でいうテキストのことです。
文字をウィンドウ上に表示します。
ちなみにプログラムは基本文の「＃他のコードはここに記載」の下に追加していきます。（上でもよい）

```python
label = tkinter.Label(text='ラベルの文字')
label.pack()
```

実行するとこんな感じ。
![スクリーンショット 2021-11-01 16.22.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/5dcf54e0-c8f7-775f-5db8-a4d8a01acdc2.png)

プログラム全文

```tk_label.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

label = tkinter.Label(text='ラベルの文字')
label.pack()

root.mainloop()
```

文字を変えるにはシングルクォーテーションの中を書き換えます。
```label = tkinter.Label(text='ラベルの文字')```の```label```は変数なので別の文字列も指定できます。（他のところ```label.pack()```なども適用する必要あり。）
また、```label.pack```では位置を自動的に合わせてくれるという感じです。

### 文字の装飾
文字色を変えたり、文字サイズを変えたりするには、基本的に```label = tkinter.Label(text='ラベルの文字')```のカッコの中にコンマで区切って付け足していきます。

### 文字色
背景色は先述したところに```foreground='#ff0000'```を付け足します。
（下のサンプルはその行を丸ごと置き換えています。）

```Python
label = tkinter.Label(text='ラベルの文字', foreground='#ff0000')
```

＃ff0000の部分はHTMLカラーコードを使って、設定できます。
[原色大辞典 - HTMLカラーコード](https://www.colordic.org/)

実行結果
![スクリーンショット 2021-11-01 16.36.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/2ea6b7d7-efc8-7790-f0c5-b87659c24aa7.png)
プログラム全文

```label_color.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

label = tkinter.Label(text='ラベルの文字', foreground='#ff0000')
label.pack()

root.mainloop()
```

### 文字の背景色
文字の背景色も文字色と同じところにコンマで区切って、```background='HTMLカラーコード'```を付け足します。

```Python
label = tkinter.Label(text='ラベルの文字', background='#ffff00')
```

実行結果
![スクリーンショット 2021-11-01 16.50.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/35ad6dde-cc88-4179-a5c4-b2bf0d372f24.png)
プログラム全文

```label_color_background.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

label = tkinter.Label(text='ラベルの文字', background='#ffff00')
label.pack()

root.mainloop()
```

### フォント、文字サイズ、太さ
フォント、文字サイズ、太さを設定する場合は同じようにコンマ区切りで```font=("フォント", "文字サイズ", "太さ")```のようにします。

:::note warn
注意
カッコやダブルクォーテーションを忘れないように注意してください。
:::

```python
label = tkinter.Label(text='ラベルの文字', background='#ffff00', font=("MSゴシック", "20", "bold"))
```

実行結果
![スクリーンショット 2021-11-01 17.02.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/58f8556e-a15c-edc4-0c05-280b5adaaf72.png)

プログラム全文

```label_font.py
import sys
import tkinter


root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

label = tkinter.Label(text='ラベルの文字', background='#ffff00', font=("MSゴシック", "20", "bold"))
label.pack()

root.mainloop()
```

##文字の位置
文字の位置は```label.pack()```を潰して、このように記載します。

```Python
label.place(x=150, y=200)
```

実行結果。このように移動しているのがわかります。
![スクリーンショット 2021-11-01 17.18.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/f302d9fe-c414-bc55-cdf6-2e2caa8eb525.png)
プログラム全文

```label_place.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

label = tkinter.Label(text='ラベルの文字')
label.place(x=150, y=200)

root.mainloop()
```

```label.place(x=x座標, y=y座標)```という感じで、位置を変えれます。

placeは他のTkinter要素でも使えるので、覚えておくといいです。

## ボタン
ボタンはアプリケーションでもよく使われる要素の一つです。
Tkinterでは```button = tkinter.Button(text='ボタン')```でボタンを作ることができます。
勿論、```.pack()```はボタンでも機能します。

```python
Button = tkinter.Button(text='ボタン')
Button.pack()
```

実行結果
![スクリーンショット 2021-11-01 17.28.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/a3616648-b3f1-86c8-abd4-71e180c7ab19.png)
プログラム全文

```tk_button.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

button = tkinter.Button(text='ボタン')
button.pack()

root.mainloop()
```

基本的なことはラベルと同じです。
```button = tkinter.Button(text='ボタン')```のシングルクォーテーション内の文字列を変えることでボタンの文字列も変わります。
また、placeもボタンではラベルと同じように、文の最初の変数名を変えるだけで機能するので、説明は省略します。
一応実行画面
![スクリーンショット 2021-11-01 17.36.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/c52918a5-e22d-d83f-280e-44eb781b4ebf.png)
プログラム全体

```button_place.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

button = tkinter.Button(text='ボタン')
button.place(x=150, y=200)

root.mainloop()
```

### その他のオプション
#### 文字色
ラベルと同じようにカッコ内にコンマ区切りで```foreground="HTMLカラーコード"```を追加します。
![スクリーンショット 2021-11-01 17.40.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/46b25f11-02c3-ad4f-5760-e3771f162c4c.png)
プログラム全文

```button_color.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

button = tkinter.Button(text='ボタン', foreground="#ff0000")
button.place(x=150, y=200)

root.mainloop()
```

#### ボタンの長さ
文字色と同じところに```width=長さ```を追加します。
![スクリーンショット 2021-11-01 17.53.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/d32617e7-e9a2-51fe-e5c0-06f145bba2e0.png)
プログラム全文

```button_width.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

button = tkinter.Button(text='ボタン', width=100)
button.pack()

root.mainloop()
```

#### ボタンが押されたときの処理
実行結果
![スクリーンショット 2021-11-02 18.20.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/05f9bad2-f6e7-7128-63e9-1366f4f6abea.png)
プログラム全文

```button_event.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

def click(event):
    print("Hello")

button = tkinter.Button(text='ボタン', width=100)
button.pack()
button.bind("<Button-1>",click) 

root.mainloop()
```

処理は```def```を用いて新しく関数を作ります。
```button.bind("<Button-1>",関数名)```で処理を関数に飛ばしてる感じです。
```<Button-1>```は左クリックという意味です。
```<Button-2>```に変えると右クリックで反応するようになります。

## 入力ボックス
入力ボックスは```Entry```を使います。
新しく変数を指定します。

```python
boxa = tkinter.Entry()
boxa.pack()
```

実行結果
![スクリーンショット 2021-11-03 16.40.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/ce6f759a-a1e1-b658-0018-8b79337027d8.png)
画面が黒いのはダークモードになってるからです。

プログラム全文

```textbox.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

boxa = tkinter.Entry()
boxa.pack()

root.mainloop()
```

### オプション
#### 入力ボックスの長さ
```Entry()``` のカッコ内に```width=長さ```を入れます。

```python
boxa = tkinter.Entry(width=100)
```

実行結果
![スクリーンショット 2021-11-03 17.03.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/8e4d1b13-2f95-f9be-653b-41c5c378755e.png)
プログラム全文

```textbox_width.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

boxa = tkinter.Entry(width=100)
boxa.pack()

root.mainloop()
```

#### 入力された内容を取得
Entryに入力された情報を変数に入れて、取得することができます。
```取得する変数 = 取得するEntryの名前.get()```を追加します。
先ほどのサンプルコードに当てはめるとこんな感じです。

```python
input_ = boxa.get()
```

プログラム全文

```box_get.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

boxa = tkinter.Entry(width=100)
boxa.pack()

input_ = boxa.get()

root.mainloop()
```

取得した内容を```print(input_)```などで出力してみると確認することができます。

#### 入力ボックスの中身を削除する
普通にやるとわかりづらいので、先ほどのボタンを活用して、ボタンを押すと中身が消えるという感じにしていきます。
新規にボタンと関数を作り、関数内に```boxa.delete(0, tkinter.END)```を追加します。

実行結果。写真なので伝わらないかもですが、ボタンを押すと入力した文字が消えます。
![スクリーンショット 2021-11-03 18.21.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/d4d0b3e4-3b7e-5012-95da-623e02f2fbe1.png)

プログラム全文

```box_del.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

def click(event):
    boxa.delete(0, tkinter.END)

boxa = tkinter.Entry(width=100)
boxa.pack()

button = tkinter.Button(text="削除")
button.pack()
button.bind("<Button-1>",click) 

root.mainloop()
```

#### デフォルトで文字を入力しておく方法
先に実行結果
![スクリーンショット 2021-11-03 18.27.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2236248/647626c0-aa7e-e082-0730-b9f1e09cdec7.png)

プログラム全文

```textbox_insert.py
import sys
import tkinter

root = tkinter.Tk()
root.title("ウィンドウのタイトル")
root.geometry("500x400")

def click(event):
    boxa.delete(0, tkinter.END)

boxa = tkinter.Entry(width=100)
boxa.insert(tkinter.END,"事前に入力しておく文字列")
boxa.pack()

root.mainloop()
```

# 終わりに
今回はtkinterについてまとめました。動作しない箇所がありましたら、コメントにて教えていただけますと幸いです。