作成日 : 2021-05-30
更新日 : 2021-11-03
47 min readPythonTkinter

Tkinterで使われるspinboxとは!?用例を踏まえて徹底解説

今回はTkinterで使われるspinboxに関して、用例を踏まえて徹底解説いたします。spinboxに関して理解を深めたい、用例を通して学びたい方へおすすめです。是非最後までご覧ください。

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

Tkinterで使われるspinboxとは、Widgetの一種で、Webページやアプリの会員登録、お問い合わせ画面などで利用されるテキストボックスと、右側へ🔼🔽のボタンが付いたもの、entryと右側へ🔼🔽のボタンが付いたものを意味します。

別名spinbox Widgetと呼ばれます。

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

伝わりづらい言葉がいくつか出てきましたね。。以下の「Tkinterの構成要素」を確認しながら、情報を整理しましょう。

Tkinterの構成要素

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

前の章でTkinterで活用されるspinboxとは、Widgetの一種で、Webページやアプリの会員登録、お問い合わせ画面などで利用されるテキストボックスと、右側へ🔼🔽のボタンが付いたもの、entryと右側へ🔼🔽のボタンが付いたものとお伝えしました。

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

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

下準備

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

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

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

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

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

spinbox Widgetは、

1tk.Spinbox(option1, option2, ...) or tk.Spinbox('親要素', option1, option2, ...)

で定義されます。

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

• borderwidth, bd
• background, bg
• fg, foreground
• font
• cursor
• buttoncursor
• buttonbackground
• command
• relief
• from_, to
• buttondownrelief, buttonuprelief
• width
• selectborderwidth
• selectbackground, selectforeground
• highlightcolor, highlightbackground, highlightthickness
• insertbackground
• state
• disabledbackground, disabledforeground
• readonlybackground
• exportselection
• justify
• insertwidth
• insertofftime, insertontime
• wrap
• repeatdelay repeatinterval
• increment
• values
• xscrollcommand
• 入力制限周りのoption

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

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

1import tkinter as tk
2
3# spinboxを生成する。
4spinbox = tk.Spinbox()
5# spinboxに関するoptionの種類一覧を取得する。
6print(spinbox.keys())

borderwidth, bd

borderwidth option, bd optionを利用すると、spinbox Widgetの枠の大きさを設定します。

borderwidthとbd両方のoptionを用いて、値を設定した場合、後ろの引数に設定されるoptionが優先されます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(borderwidth=50) or self.spinbox.configure(borderwidth=50)
4##################################
5self.spinbox = tk.Spinbox(frame, borderwidth=50)

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

background, bg

background option, bg optionを利用すると、spinbox Widgetの背景色を設定します。

backgroundとbg両方のoptionを用いて、値を設定した場合、後ろの引数に設定されるoptionが優先されます。

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

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(bg='red') or self.spinbox.configure(bg='red')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, bg='red')

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

fg, foreground

fg option, foreground optionを利用すると、文字列色を変更できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(foreground='green') or self.spinbox.configure(foreground='green')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, foreground='green')

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

font

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

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

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(font=("", 20, "underline")) or self.spinbox.configure(font=("", 20, "underline"))
4##################################
5# fontについて : https://kuroro.blog/python/RZNjLl36upkumxwkTRWl/
6self.spinbox = tk.Spinbox(frame, font=("", 20, "underline"))

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

cursor

cursor optionを利用すると、spinbox Widgetのテキストボックスへマウスカーソルを移動すると矢印の見た目を変化できます。

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

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更して、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(cursor="clock") or self.spinbox.configure(cursor="clock")
4##################################
5self.spinbox = tk.Spinbox(frame, cursor="clock")

spinbox Widgetのテキストボックスへマウスカーソルを移動すると、矢印の見た目が変更します。

buttoncursor

buttoncursor optionを利用すると、spinbox Widgetの右側、🔼🔽のボタンへマウスカーソルを移動すると、矢印の見た目を変化できます。

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

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更して、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(buttoncursor="clock") or self.spinbox.configure(buttoncursor="clock")
4##################################
5self.spinbox = tk.Spinbox(frame, buttoncursor="clock")

spinbox Widgetの右側、🔼🔽のボタンへマウスカーソルを移動すると、矢印の見た目が変更します。

buttonbackground

buttonbackground optionを利用すると、spinbox Widgetの右側、🔼🔽のボタンの背景色を変更できます。

※ 2021年7月7日現在、筆者のMac OSではbuttonbackground opitonを設定しても、spinbox Widgetの右側、🔼🔽のボタンの背景色は変更されませんでした。

command

command optionを利用すると、spinbox Widgetの右側、🔼🔽のボタンが選択された際に実行する関数を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更して、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(command=self.helloWorld) or self.spinbox.configure(command=self.helloWorld)
4##################################
5self.spinbox = tk.Spinbox(frame, command=self.helloWorld)

🔼🔽のボタンを選択すると、以下の画像のようにself.helloWorld関数が実行されて'hello world'が表示されます。

relief

relief optionを利用すると、spinbox Widgetの枠のデザインを設定できます。

指定方法としては、

• tk.RAISED
• tk.SUNKEN
• tk.FLAT
• tk.RIDGE
• tk.GROOVE
• tk.SOLID

の6種類があります。

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

1def __init__(self, master=None):
2    ...
3    frame.pack()
4+   reliefList = [tk.RAISED, tk.SUNKEN, tk.FLAT, tk.RIDGE, tk.GROOVE, tk.SOLID]
5+   for relief in reliefList:
6-   self.spinbox = tk.Spinbox(frame)
7+       self.spinbox = tk.Spinbox(frame, relief=relief, bd=10)
8-   self.spinbox.pack()
9+       self.spinbox.pack()

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

from_, to

from_ opiton, to optionを利用すると、それぞれspinbox Widgetのテキストボックスへ入力される文字列に、数値の下限・上限を設けます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# from_ : spinbox Widgetのテキストボックスへ入力される文字列に、数値の下限を設ける。デフォルトは0。fromはPythonの予約語なので、fromの後に_(アンダーバー)を付加する
2# 予約語とは? : https://ja.wikipedia.org/wiki/%E4%BA%88%E7%B4%84%E8%AA%9E#:~:text=%E4%BA%88%E7%B4%84%E8%AA%9E%EF%BC%88%E3%82%88%E3%82%84%E3%81%8F%E3%81%94,%E3%80%81%E5%AD%97%E5%8F%A5%E3%81%AA%E3%81%A9%EF%BC%89%E3%81%AE%E3%81%93%E3%81%A8%E3%80%82
3# to : spinbox Widgetのテキストボックスへ入力される文字列に、数値の上限を設ける。デフォルトは0。
4self.spinbox = tk.Spinbox(frame, from_=1, to=10)

'1'より小さい文字列を入力できなくなり、かつ'10'より大きい文字列を入力できなくなります。

buttonuprelief, buttondownrelief

buttonuprelief option, buttondownrelief optionを利用すると、それぞれspinbox Widgetの右側、🔼ボタンの枠のデザイン、🔽ボタンの枠のデザインを変更します。

指定方法としては、

• tk.RAISED
• tk.SUNKEN
• tk.FLAT
• tk.RIDGE
• tk.GROOVE
• tk.SOLID

の6種類があります。

※ 2021年7月7日現在、筆者のMac OSではbuttonuprelief option, buttondownrelief optionを設定しても、それぞれspinbox Widgetの右側、🔼ボタンの枠のデザイン、🔽ボタンの枠のデザインは変更されませんでした。

width

width optionを利用すると、spinbox Widgetの幅を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(width=60) or self.spinbox.configure(width=60)
4##################################
5self.spinbox = tk.Spinbox(frame, width=60)

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

selectborderwidth

selectborderwidth optionを利用すると、spinbox Widgetのテキストボックスで選択される領域の幅を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(selectborderwidth=40) or self.spinbox.configure(selectborderwidth=40)
4##################################
5self.spinbox = tk.Spinbox(frame, selectborderwidth=40)

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

selectbackground, selectforeground

selectbackground option, selectforeground opitonを利用すると、spinbox Widgetのテキストボックスで選択される文字列の背景色、文字列色を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(selectbackground='red', selectforeground='green') or self.spinbox.configure(selectbackground='red', selectforeground='green')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, selectbackground='red', selectforeground='green')

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

highlightcolor, highlightbackground, highlightthickness

highlightcolor option, highlightbackground option, highlightthickness optionを利用すると、それぞれspinboxのテキストボックスへフォーカスがあてられた時の囲い線の色, spinboxのテキストボックスへフォーカスが外れた時の囲い線の色, 囲い線の太さを設定します。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(highlightbackground='red', highlightthickness=20, highlightcolor='green') or self.spinbox.configure(highlightbackground='red', highlightthickness=20, highlightcolor='green')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, highlightbackground='red', highlightthickness=20, highlightcolor='green')

テキストボックスへカーソルがあてられた場合に、以下の画像のようにspinbox Widgetを描画して、

テキストボックスへカーソルが外れている場合に、以下の画像のようにspinbox Widgetを描画します。

insertbackground

insertbackground optionを利用すると、spinbox Widgetのテキストボックスで点滅するカーソルの背景色を変更できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(insertbackground='red') or self.spinbox.configure(insertbackground='red')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, insertbackground='red')

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

state

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

指定できる値としては、

• normal : テキストボックスへの入力を有効。spinbox Widgetの右側、🔼🔽のボタンを使って値の更新可能。テキストボックスへカーソルもあてられる。デフォルト。
• disabled : テキストボックスへの入力を無効。spinbox Widgetの右側、🔼🔽のボタンを使って値の更新不可能。テキストボックスへカーソルをあてられない。
• readonly : テキストボックスへの入力を無効。spinbox Widgetの右側、🔼🔽のボタンを使って値の更新可能。テキストボックスへカーソルはあてられる。

があります。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(state='disabled') or self.spinbox.configure(state='disabled')
4##################################
5self.spinbox = tk.Spinbox(frame, state='disabled')

以下の画像のように、spinbox Widgetのテキストボックスへ入力できなくなります。

disabledbackground, disabledforeground

disabledbackground option, disabledforeground optionを利用すると、それぞれspinbox Widgetのstateが'disabled'の時の背景色、文字列色を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(state='disabled', disabledforeground='red', disabledbackground='green', from_=1, to=10) or self.spinbox.configure(state='disabled', disabledforeground='red', disabledbackground='green', from_=1, to=10)
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, state='disabled', disabledforeground='red', disabledbackground='green', from_=1, to=10)

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

readonlybackground

readonlybackground optionを利用すると、spinbox Widgetの状態(state)がreadonlyの時の、背景色を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(state='readonly', readonlybackground='green') or self.spinbox.configure(state='readonly', readonlybackground='green')
4##################################
5# 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
6self.spinbox = tk.Spinbox(frame, state='readonly', readonlybackground='green')

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

exportselection

exportselection optionを利用すると、カーソルを使って選択された文字列を、データとして記憶させるべきか設定できます。

具体的にカーソルを使って選択された文字列を画像を通して説明すると、

黄緑色で囲まれる箇所をカーソルを使って選択された文字列と呼びます。

値としてboolean(True, False)の指定が可能で、デフォルトではTrue(データとして記憶する)になります。

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

1    def __init__(self, master=None):
2        ...
3-       self.spinbox = tk.Spinbox(frame)
4+       # exportselection=Falseへ変更する。
5+       self.spinbox = tk.Spinbox(frame, command=self.helloWorld, exportselection=False, from_=1, to=10)
6
7    # hello worldを出力する関数
8    def helloWorld(self):
9        print('hello world')
10+       # selection_get() : 現在テキストボックス内で選択中の文字列を返す。文字列が選択されていない、exportselectionがFalseの場合は、以下のエラーが表示される。
11+       # _tkinter.TclError: PRIMARY selection doesn't exist or form "STRING" not defined
12+       print(self.spinbox.selection_get())

spinbox Widgetの右側、🔼のボタンをクリックすると、# _tkinter.TclError: PRIMARY selection doesn't exist or form "STRING" not definedのエラーがターミナルに表示されます。

justify

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

指定方法としては、

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

の3種類があります。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(from_=100, to=200, justify=tk.RIGHT) or self.spinbox.configure(from_=100, to=200, justify=tk.RIGHT)
4##################################
5self.spinbox = tk.Spinbox(frame, from_=100, to=200, justify=tk.RIGHT)

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

insertwidth

insertwidth optionを利用すると、カーソル幅を変更できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(insertwidth=10) or self.spinbox.configure(insertwidth=10)
4##################################
5self.spinbox = tk.Spinbox(frame, insertwidth=10)

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

insertofftime, insertontime

insertofftime optionを利用すると、カーソルが表示されてから消えるまでの時間(ミリ秒)を指定できます。0を指定すると、点滅なしになります。デフォルトは300ミリ秒です。

insertontime optionを利用すると、カーソルが消えてから表示されるまでの時間(ミリ秒)を指定できます。デフォルトは600ミリ秒です。

wrap

wrap optionを利用すると、テキストボックスの文字列が、最高値(to option)へ達した場合に、🔼のボタンを押すと最低値(from_ option)に戻り、テキストボックスの文字列が、最低値(from_ option)へ達した場合に🔽のボタンを押すと最高値(to option)に戻す設定ができます。

True(テキストボックスの文字列が、最高値(to option)へ達した場合に🔼のボタンを押すと最低値(from_ option)に戻り、テキストボックスの文字列が、最低値(from_ option)へ達した場合に🔽のボタンを押すと最高値(to option)に戻る)

False(デフォルト。テキストボックスの文字列が、最高値(to option)へ達した場合に🔼のボタンを押しても何も変化しない。テキストボックスの文字列が、最低値(from_ option)へ達した場合に🔽のボタンを押しても何も変化しない。)を設定できます。

repeatdelay, repeatinterval

repeatdelay option, repeatinterval optionを利用すると、🔼🔽のボタンを長押ししている最中に、関数(command option)を呼び出すことができます。

repeatdelay optionでは長押しによる1回目の関数(command option)呼び出しの時間を遅らせること(ミリ秒で設定)ができます。

repeatinterval optionでは長押しによって、何秒間隔(ミリ秒で設定)で関数(command option)呼び出しするか設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(from_=1, to=10, command=self.helloWorld, repeatdelay=800, repeatinterval=1000) or self.spinbox.configure(from_=1, to=10, command=self.helloWorld, repeatdelay=800, repeatinterval=1000)
4##################################
5self.spinbox = tk.Spinbox(frame, from_=1, to=10, command=self.helloWorld, repeatdelay=800, repeatinterval=1000)

🔼🔽のボタン押下後800ミリ秒後に1回目の関数(command option)呼び出しを行い、その後1000ミリ秒ごとに関数(command option)呼び出しを行います。

format

format optionを利用すると、文字列の形式を変更できます。

formatの値としては、

1# W : どのくらいのpx数を空けてから、文字列を表示するのか設定
2# P : 小数第何位まで文字列を表示するのか設定
3# %, ., f : ただの文字列。
4'%W.Pf'

で定義されます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(from_=1, to=10, format='%30.4f') or self.spinbox.configure(from_=1, to=10, format='%30.4f')
4##################################
5self.spinbox = tk.Spinbox(frame, from_=1, to=10, format='%30.4f')

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

increment

increment optionを利用すると、文字列の数値の増減幅を設定できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# increment : 文字列の数値の増減幅を設定。デフォルト1。
2self.spinbox = tk.Spinbox(frame, from_=1, to=10, increment=2)

🔼🔽のボタンを押す度に文字列の数値の増減幅が±2されます。

values

values optionを利用すると、spinbox Widgetを選択形式へ変更できます。

例えば下準備コードのself.spinbox = tk.Spinbox(frame)箇所を、以下のように変更すると、

1# 別解法 ##########################
2# self.spinbox = tk.Spinbox(frame)
3# self.spinbox.config(values=('red', 'blue', 'green')) or self.spinbox.configure(values=('red', 'blue', 'green'))
4##################################
5self.spinbox = tk.Spinbox(frame, values=('red', 'blue', 'green'))

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

xscrollcommand

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

入力制限周りのoption

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

spinbox Widgetで活用される5種類の関数

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

• insert
• delete
• get
• index
• invoke

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

insert

insert関数を利用すると、spinbox Widgetのテキストボックスへ文字列を挿入できます。

1# 文字列を挿入する関数
2# 第一引数 : 挿入index(文字位置)
3# 第二引数 : 文字列
4.insert('挿入index(文字位置)', '文字列')

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

例えば下準備コードのself.spinbox.pack()の下へ、以下のコードを記述すると、

1     self.spinbox.pack()
2+    self.spinbox.insert(0, 'こんにちは')

以下の画像のように'こんにちは'の文字列を挿入します。

delete

delete関数を利用すると、index(文字位置)に該当する値(文字 or 文字列)を削除できます。

1# 文字を削除する場合
2# 第一引数に該当する文字を削除
3# 第一引数 : index(文字位置)
4.delete('index(文字位置)')
5
6# 文字列を削除する場合
7# 第一引数から第二引数の間に該当する文字列を削除
8# 第一引数 : 開始index(文字位置)
9# 第二引数 : 終わりindex(文字位置)
10.delete('開始index(文字位置)', '終わりindex(文字位置)')

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

例えば下準備コードのself.spinbox.pack()の下へ、以下のコードを記述すると、

1     self.spinbox.pack()
2+    self.spinbox.insert(0, 'こんにちは')
3+    self.spinbox.delete(0)

以下の画像のように'こんにちは'の'こ'部分を削除します。

また下準備コードのself.spinbox.pack()の下へ、以下のコードを記述すると、

1     self.spinbox.pack()
2+    self.spinbox.insert(0, 'こんにちは')
3+    self.spinbox.delete(0, 2)

以下の画像のように'こんにちは'の'こん'部分を削除します。

get

get関数を利用すると、現在spinbox Widgetのテキストボックスへ書き込まれる、文字列の値を取得できます。

1# 戻り値 : 現在spinbox Widgetのテキストボックスへ書き込まれる、文字列の値
2.get()

で定義されます。戻り値として現在spinbox Widgetのテキストボックスへ書き込まれる、文字列の値が返されます。

例えば下準備コードのself.spinbox.pack()の下へ、以下のコードを記述すると、

1     self.spinbox.pack()
2+    self.spinbox.insert(0, 'こんにちは')
3+    print(self.spinbox.get())

以下の画像のように'こんにちは'を取得します。

index

index関数を利用すると、index(文字位置)を取得できます。

1# index(文字位置)を取得する関数
2# 第一引数 : index(文字位置)
3# 戻り値 : 第一引数に該当するindex(文字位置)
4.index('index(文字位置)')

で定義されます。戻り値として、index(文字位置)を取得します。

例えば下準備コードのself.spinbox.pack()の下へ、以下のコードを記述すると、

1     self.spinbox.pack()
2+    self.spinbox.insert(0, 'こんにちは')
3+    # tk.END : 文字列の終わりindex(文字位置)
4+    print(self.spinbox.index(tk.END))

以下の画像のように最終文字のindex(文字位置)を取得します。

invoke

invoke関数を利用すると、指定する文字列の動作を一度行います。

1# 指定する文字列の動作を一度行います。
2# 第一引数 : 指定する文字列(none or buttonup or buttondown)
3# none : 何もしない
4# buttonup : 右側の🔼のボタンを一度選択する
5# buttondown : 右側の🔽のボタンを一度選択する。
6.invoke('指定する文字列')

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

また指定する文字列として'buttonup', 'buttondown'を選択した場合、command optionで設定される関数を一度実行します。

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

1-    self.spinbox = tk.Spinbox(frame)
2+    self.spinbox = tk.Spinbox(frame, command=self.helloWorld, from_=1, to=10)
3     self.spinbox.pack()
4+    self.spinbox.invoke('buttonup')

以下の画像のように、右側の🔼のボタンが一度押されて'2'が表示されます。

またself.helloWorld関数を一度実行して、'hello world'が表示されます。

まとめ

• Tkinterは、Window, Frame, Widgetで構成される。
• Tkinterで使われるspinboxとは、Widgetの一種で、Webページやアプリの会員登録、お問い合わせ画面などで利用されるテキストボックスと、右側へ🔼🔽のボタンが付いたもの、entryと右側へ🔼🔽のボタンが付いたものを意味します。

参考文献

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