作成日 : 2021-06-03
更新日 : 2021-11-04
35 min readPythonTkinter

【コード付】Tkinterで活用されるcomboboxをわかりやすく解説!?

今回はTkinterで活用されるcomboboxに関して、コードを交えてわかりやすく解説いたします。comboboxに関して知りたい、comboboxの理解を深めたい方へおすすめです。是非最後までご一読ください。

そもそもTkinterで使われるcomboboxとは?

Tkinterで使われるcomboboxとは、Widgetの一種で様々な選択肢を表示して選んだり、文字入力できるテキストボックスを意味します。

Tkinterを熟達されている方は、entry Widgetとlistbox Widgetを1つにまとめたものと考えると良いでしょう。

entry Widgetに関しては、Tkinterで使われるentryって?有効な活用方法を徹底解説!?でまとめていますので、詳しく知りたい方は是非ご確認ください。

listbox Widgetに関しては、【サンプルコード付】Tkinterで使われるlistboxに関して徹底解説!?でまとめていますので、詳しく知りたい方は是非ご確認ください。

別名combobox Widgetと呼ばれます。

普段聞き慣れない言葉が出てきて少し難しいですね。。以下の「Tkinterの構成要素」を確認しながら、理解を深めましょう。

Tkinterの構成要素

Tkinterの構成要素として、Window, Frame, Widgetの概念が存在します。

前の章でTkinterで使われるcomboboxとは、Widgetの一種で様々な選択肢を表示して選んだり、文字入力できるテキストボックスとお伝えしました。

「Tkinterの構成要素」の画像内では、ピンク色枠に該当するWidgetに対して、編集することになります。

Tkinterの構成要素を理解したところで、実際にcomboboxの活用方法を理解していきましょう。

下準備

今回は先ほど紹介した「Tkinterの構成要素」の画像を元に、comboboxの使い方をお伝え致します。

下にコードを貼り付けておきますので、画像と見比べながら、コードを確認してみてください。できれば、一緒にcomboboxを体験しましょう。

1import tkinter as tk
2from tkinter import ttk
3
4class Application(tk.Frame):
5    # combobox Widgetに関する情報を変数として格納する
6    combobox = None
7
8    def __init__(self, master=None):
9        # Windowの初期設定を行う。
10        super().__init__(master)
11
12        # Windowの画面サイズを設定する。
13        # geometryについて : https://kuroro.blog/python/rozH3S2CYE0a0nB3s2QL/
14        self.master.geometry("300x200")
15
16        # Windowを親要素として、frame Widget(Frame)を作成する。
17        # Frameについて : https://kuroro.blog/python/P20XOidA5nh583fYRvxf/
18        frame = tk.Frame(self.master)
19        # Windowを親要素とした場合に、frame Widget(Frame)をどのように配置するのか?
20        # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
21        frame.pack()
22
23        # frame Widget(Frame)を親要素として、combobox Widgetを作成する。
24        # values : 表示される様々な選択肢(バイキンマン, 食パンまん)の設定
25        self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
26
27        # frame Widget(Frame)を親要素とした場合に、combobox Widgetをどのように配置するのか?
28        # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
29        self.combobox.pack()
30
31# Tkinter初学者参考 : https://docs.python.org/ja/3/library/tkinter.html#a-simple-hello-world-program
32if __name__ == "__main__":
33    # Windowを生成する。
34    # Windowについて : https://kuroro.blog/python/116yLvTkzH2AUJj8FHLx/
35    root = tk.Tk()
36    app = Application(master=root)
37
38    # Windowをループさせて、継続的にWindow表示させる。
39    # mainloopについて : https://kuroro.blog/python/DmJdUb50oAhmBteRa4fi/
40    app.mainloop()

上記のコードをPython環境で実行すると、「Tkinterの構成要素」で紹介した画像の結果が表示されます。

Tkinterで活用されるcombobox Widgetの定義

combobox Widgetは、

1from tkinter import ttk
2
3ttk.Combobox(option1, option2, ...) or ttk.Combobox('親要素', option1, option2, ...)

で定義されます。

combobox Widgetで使われるoptionの種類としては

• values
• justify
• show
• state
• cursor
• height, width
• font
• foreground
• postcommand
• 入力制限に関するoption
• xscrollcommand
• style

があります。順番に見ていきましょう。

※ optionの種類一覧を調べたい場合は、以下のようにコードを記述してご確認ください。

1from tkinter import ttk
2
3# comboboxを生成する。
4combobox = ttk.Combobox()
5# comboboxに関するoptionの種類一覧を取得する。
6print(combobox.keys())

values

values optionを利用すると、表示される選択肢の内容を設定できます。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1self.combobox = ttk.Combobox(frame, values=('aaa', 'bbb'))

以下の画像のようにcombobox Widgetを描画します。

また下準備コードを、以下のように変更すると、

1class Application(tk.Frame):
2+    # combobox Widgetの選択肢が選択された場合に実行される。
3+    def changeValues(self, event):
4+        # values : 表示される様々な選択肢(aaa, bbb)を設定する。
5+        # もしくはself.combobox.config(values=('aaa', 'bbb'))
6+        self.combobox.configure(values=('aaa', 'bbb'))
7     def __init__(self, master=None):
8         ...
9         self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
10+        # combobox Widgetの選択肢を選択した場合に、実行される関数の設定
11+        # 第一引数 : sequence(イベント内容(combobox Widgetの選択肢を選択した場合)を設定)。<<ComboboxSelected>> : combobox Widgetの選択肢を選択した場合
12+        # 第二引数 : func(第一引数のイベント内容(combobox Widgetの選択肢を選択した場合)が実行された場合に、呼ばれる関数を設定)
13+        # bindについて : https://kuroro.blog/python/eI5ApJE1wkU7bHsuwk0H/
14+        self.combobox.bind('<<ComboboxSelected>>', self.changeValues)

選択肢を一度も選択していない場合に、以下の画像のようにcombobox Widgetが描画されて、

選択肢を一度選択した後の場合に、以下の画像のようにcombobox Widgetが描画されます。

bind関数に関しては、【コード付】Tkinterで使われるbindとは?bindの仕組みを交えて解説でまとめていますので、詳しく知りたい方は是非ご確認ください。

justify

justify optionを利用すると、combobox Widgetで表示する、文字列をどちらに揃えるか設定できます。

指定できる値としては、

• tk.LEFT : 左寄せ(デフォルト)
• tk.CENTER : 中央寄せ
• tk.RIGHT : 右寄せ

の3種類があります。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(justify='right') or self.combobox.configure(justify='right')
4##################################
5self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), justify='right')

以下の画像のようにcombobox Widgetを描画します。

show

show optionを利用すると、入力内容の表示を、指定する文字列へ変換できます。パスワードなどセキュリティに関する入力項目へ、show optionが有効です。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(show='*') or self.combobox.configure(show='*')
4##################################
5self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), show='*')

以下の画像のようにcombobox Widgetを描画します。

state

state optionを利用すると、combobox Widgetの状態を設定できます。

指定できる値としては、

• normal : 様々な選択肢を選んだり、combobox内へ直接文字入力可能(デフォルト)
• disabled : 様々な選択肢を選んだり、combobox内へ直接文字入力不可
• readonly : 様々な選択肢を選ぶことはできる。combobox内へ直接文字入力不可

があります。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(state='disabled') or self.combobox.configure(state='disabled')
4##################################
5self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), state='disabled')

以下の画像のようにcombobox Widgetを描画します。

cursor

cursor optionを利用すると、combobox Widget内へマウスカーソルを移動すると矢印の見た目を変化できます。

見た目のバリエーションについてはこちらのサイトにまとまっていますので、ご確認ください。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更して、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(cursor="clock") or self.combobox.configure(cursor="clock")
4##################################
5self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), cursor="clock")

combobox Widget内へマウスカーソルを移動すると、矢印の見た目が変更します。

height, width

height option, width optionを利用すると、それぞれ選択肢の高さ・幅を設定できます。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(height=1, width=10) or self.combobox.configure(height=1, width=10)
4##################################
5# width : 選択肢の幅を設定する。デフォルトは20。
6self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), height=1, width=10)

以下の画像のようにcombobox Widgetを描画します。

font

font optionを利用すると、文字の形式や大きさを設定できます。

fontに関しては、Tkinterで使われるフォントって?2種類のフォントの設定方法を丁寧に解説でまとめておりますので、詳しく知りたい方は是非ご確認ください。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(font=("", 20, "underline")) or self.combobox.configure(font=("", 20, "underline"))
4##################################
5# font option第一引数(必須) : 文字列の形式(デフォルト)
6# font option第二引数(必須) : 文字列の大きさを設定。
7# font option第三引数(任意) : underline = 文字列へ下線をつける。
8# fontについて : https://kuroro.blog/python/RZNjLl36upkumxwkTRWl/
9self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), font=("", 20, "underline"))

以下の画像のようにcombobox Widgetを描画します。

foreground

foreground optionを利用すると、 文字列色を設定できます。

色に関しては、Tkinterの色の使い方とは?活用例から色の一覧をまとめて紹介!?で総括していますので、詳しく知りたい方は是非ご確認ください。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
3# self.combobox.config(foreground='red') or self.combobox.configure(foreground='red')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), foreground='red')

以下の画像のようにcombobox Widgetを描画します。

postcommand

postcommand optionを利用すると、選択肢を表示するタイミングで実行する関数を設定できます。

例えば下準備コードを以下のように変更すると、

1class Application(tk.Frame):
2+    # 選択肢を表示するタイミングで実行される関数
3+    def callFunc(self):
4+        print('hello world')
5
6     def __init__(self, master=None):
7         ...
8-        self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
9+        self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), postcommand=self.callFunc)

以下の画像のようにcombobox Widgetを描画します。

入力制限に関するoption

入力制限に関するoption(invalidcommand, validate, validatecommand)に関しては、【コード付】Tkinterのentryを使った入力制限の方法をお伝えしますでまとめておりますので、是非ご確認ください。

xscrollcommand

xscrollcommand optionに関しては、Tkinterで使われるscrollbarとは?活用事例を交えて徹底解説の「その他のWidgetを使った、scrollbar Widgetサンプル集」でまとめておりますので、是非ご確認ください。

style

style optionを利用すると、combobox Widgetのoptionをまとめて設定したり、entry Widgetにある一部のoptionを設定できるようになります。

以下の3ステップで設定できます。

1. スタイルオブジェクト(ttk.Style())の生成
2. configure()関数を使用して、optionの設定
3. combobox Widget内のstyle optionへ2で作成したものを設定

例えば下準備コードを以下のように変更すると、

1def __init__(self, master=None):
2    ...
3    frame.pack()
4+   # 1. スタイルオブジェクト(ttk.Style())の生成
5+   style = ttk.Style()
6+   # 2. configure()関数を使用して、optionの設定
7+   # 第一引数 : {お好みの名前}.TComboboxで設定ください。
8+   # 第二引数以降 : optionを設定ください。
9+   # 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
10+   style.configure("test.TCombobox", selectbackground='red', foreground='green')
11-   self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
12+   # 3. combobox Widget内のstyle optionへ2で作成したものを設定
13+   self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'), style='test.TCombobox')

以下の画像のようにcombobox Widgetを描画します。

筆者のMac OSで調べたところ、style optionを活用すると、追加して以下のoptionが利用できます。

• selectbackground
• selectforeground
• selectborderwidth
• insertwidth

上記のoptionに関しては、entry Widgetの各option名でまとめていますので、そちらをご確認ください。

次項で述べる、テーマ(名前)によってstyleで指定するoptionが適用されない場合もございます。これはテーマ(名前)で設定されるstyleが優先されるためです。優先度 : テーマ(名前)のstyle > style option

テーマ(名前)を利用して、combobox Widgetの外観を変更

ttk.Combobox()では、テーマ(名前)を指定することで、combobox Widgetの外観を変更できます。

例えば以下のようなコードを作成すると、

1import tkinter as tk
2from tkinter import ttk
3
4class Application(tk.Frame):
5    # combobox Widgetに関する情報を変数として格納する
6    combobox = None
7
8    def __init__(self, master=None):
9        # Windowの初期設定を行う。
10        super().__init__(master)
11
12        # Windowの画面サイズを設定する。
13        # geometryについて : https://kuroro.blog/python/rozH3S2CYE0a0nB3s2QL/
14        self.master.geometry("300x200")
15
16        # Windowを親要素として、frame Widget(Frame)を作成する。
17        # Frameについて : https://kuroro.blog/python/P20XOidA5nh583fYRvxf/
18        frame = tk.Frame(self.master)
19        # Windowを親要素とした場合に、frame Widget(Frame)をどのように配置するのか?
20        # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
21        frame.pack()
22
23+       # ttk.Combobox()の外観を変更
24+       style = ttk.Style()
25+       # テーマ(名前)の指定を行う。
26+       style.theme_use('classic')
27
28        # frame Widget(Frame)を親要素として、combobox Widgetを作成する。
29        # values : 表示される様々な選択肢(バイキンマン, 食パンまん)の設定
30        self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
31
32        # frame Widget(Frame)を親要素とした場合に、combobox Widgetをどのように配置するのか?
33        # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
34        self.combobox.pack()
35
36# Tkinter初学者参考 : https://docs.python.org/ja/3/library/tkinter.html#a-simple-hello-world-program
37if __name__ == "__main__":
38    # Windowを生成する。
39    # Windowについて : https://kuroro.blog/python/116yLvTkzH2AUJj8FHLx/
40    root = tk.Tk()
41    app = Application(master=root)
42
43    # Windowをループさせて、継続的にWindow表示させる。
44    # mainloopについて : https://kuroro.blog/python/DmJdUb50oAhmBteRa4fi/
45    app.mainloop()

以下の画像のように、combobox Widgetを描画します。

また現在利用中のテーマ(名前)を確認する場合は、

1from tkinter import ttk
2
3style = ttk.Style()
4# 現在利用中のテーマ(名前)を確認
5currentTheme = style.theme_use() 
6print(currentTheme)

利用できるテーマ(名前)の一覧を確認する場合は、

1from tkinter import ttk
2
3style = ttk.Style() 
4# テーマ(名前)の一覧を確認
5allTheme = style.theme_names() 
6print(allTheme)

テーマ(名前)の指定を行う場合は、

1from tkinter import ttk
2
3style = ttk.Style()
4# テーマ(名前)の指定を行う。
5style.theme_use('テーマ(名前)') 

をご利用ください。

【4種類】comboboxで活用される関数

comboboxで活用される関数として、

• get
• current
• set
• delete

の4種類が存在します。順に見ていきましょう。

get

get関数を利用すると、現在のcomboboxの値を取得できます。

1# 現在のcomboboxの値を取得する。
2# 戻り値 : 現在のcomboboxの値
3.get()

で定義されます。戻り値として、現在のcomboboxの値を返します。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('aaa')
3+ print(self.combobox.get())

以下の画像のようにcombobox Widgetを描画します。

current

current関数を利用すると、現在のcomboboxの値に合致する選択肢のindex(位置)を取得 or 選択肢のindex(位置)を指定して選択肢を選択できます。

1# 現在のcomboboxの値に合致する選択肢のindex(位置)を取得する場合
2# 戻り値 : 現在のcomboboxの値に合致する選択肢のindex(位置。上(0)から順に数えられる)を返す。現在のcomboboxの値が選択肢以外の場合、-1を返す。
3.current()
4
5# 選択肢のindex(位置)を指定して選択肢を選択する場合
6# 第一引数 : 選択肢のindex(位置。上(0)から順に数えられる)
7# 戻り値 : なし
8.current(数字)

で定義されます。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('バイキンマン')
3+ print(self.combobox.current())

以下の画像のようにcombobox Widgetを描画します。

また下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('バイキンマン')
3+ self.combobox.current(1)

以下の画像のようにcombobox Widgetを描画します。

set

set関数を利用すると、comboboxの値を設定できます。

1# comboboxの値を設定
2# 第一引数 : 値
3# 戻り値 : なし
4.set('値')

で定義されます。戻り値はありません。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('aaa')

以下の画像のようにcombobox Widgetを描画します。

delete

delete関数を利用すると、combobox内へ入力される、文字 or 文字列を削除できます。

1# 文字を削除する場合
2# 第一引数 : 削除する文字位置(左(0)からスタート)
3# 戻り値 : なし
4.delete(数字)
5
6# 文字列を削除する場合
7# 第一引数 : 削除する文字列の開始位置(左(0)からスタート)
8# 第二引数 : 削除する文字列の終わり位置
9# 戻り値 : なし
10.delete(数字, 数字)

で定義されます。戻り値はありません。

例えば下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('abc')
3+ self.combobox.delete(0)

以下の画像のようにcombobox Widgetを描画します。

また下準備コードのself.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))箇所の下で、以下のようなコードを追加すると、

1  self.combobox = ttk.Combobox(frame, values=('バイキンマン', '食パンまん'))
2+ self.combobox.set('abc')
3+ self.combobox.delete(0, 2)

以下の画像のようにcombobox Widgetを描画します。

まとめ

• Tkinterで活用するcomboboxとは、Widgetの一種で様々な選択肢を表示して選んだり、文字入力できるテキストボックスを意味します。
• 別名combobox Widgetと呼ばれます。

参考文献

• Tkinterのcomboboxに関するサンプルコード
• テキストボックスとは?
• マウスカーソルとは?
• Tkinterで使われるマウスカーソルの種類
• テーマとは?