このページでは、Tkinter のペインドウィンドウの作成方法・使い方・設定方法等について説明していきたいと思います。
Contents
ペインドウィンドウ(Paned Window)とは
まずは、ペインドウィンドウについて簡単に説明していきます。
ペインドウィンドウ
ペインドウィンドウウィジェットは、複数のウィジェットをまとめて表示するウィジェットです。さらに、ペインドウィンドウウィジェットにはサッシが設けられ、このサッシのスライドによってウィジェットのサイズをユーザーが変更することができるようになっています。
もう詳しく説明すると、まずペインドウィンドウウィジェットには複数の表示領域が存在し、それらの各表示領域にウィジェットが表示されることになります。さらに、これらの表示領域(ウィジェット)の間にはサッシが設けられています。
そして、このサッシをスライドさせることで各表示領域のサイズ(各ウィジェットのサイズ)をユーザーが調整することができるようになっています。
ペインドウィンドウの英語でのスペルは Paned window で、日本語に訳すと「スライド式の窓」ぐらいになると思います。スライド式の窓には複数の窓が付いており、さらにサッシがついていてスライドできるようになっています。そして、スライドすることで窓の開きサイズを調整することが可能です。
ペインドウィンドウウィジェットでは窓の開きではなく表示領域のサイズを調整することになりますが、サッシをスライドさせてサイズを調整するという点は、まさにスライド式の窓と同様であることを感じ取っていただけるのではないかと思います。
スポンサーリンク
フレームウィジェットとの違い
で、前述の通り、ペインドウィンドウウィジェットには複数の表示領域が存在し、それらの表示領域にボタンやキャンバス等のウィジェットを配置して表示することが可能です。
複数のウィジェットを表示できるという点は、下記ページで解説しているフレームウィジェットと同様になります。
Tkinterの使い方:フレームウィジェット(Frame)の使い方上記ページでも解説しているように、フレームウィジェットに他のウィジェットを配置することで、それらのウィジェットを1つのグループとして扱うことができるようになります。そして、それによってグループ単位での一括した処理が可能となるというメリットが得られますし、フレーム単位で部品化することでアプリ間での流用が効率的に行えるというメリットも得られます。
これらのメリットは、ペインドウィンドウウィジェットの利用によっても得ることはできます。ただ、ペインドウィンドウウィジェットの最大の特徴はユーザーがサッシのスライドによってウィジェットのサイズの調整が可能という点になります。このウィジェットのサイズの調整が不要なのであれば、ペインドウィンドウウィジェットを利用する意味はあまりありませんので、上記のようなメリットを得ることが目的なのであれば、ペインドウィンドウウィジェットよりも、扱い方がシンプルなフレームウィジェットを利用する方が良いと思います。
ペインドウィンドウウィジェットの構成
ここまでにも簡単に説明を行いましたが、次はペインドウィンドウウィジェットの構成について解説したいと思います。
前述の通り、ペインドウィンドウウィジェットには複数の表示領域とサッシが存在します。そして、それらの表示領域にはウィジェットが表示されます。といっても、元から表示領域やサッシが存在するというわけではありません。ペインドウィンドウウィジェットを単に作成して配置しても、アプリには単なる四角の図形が表示されるだけになります。この状態だとペインドウィンドウウィジェットは意味を持たないウィジェットとなります。
ペインドウィンドウウィジェットが効果を発揮するのは、ペインドウィンドウウィジェットに複数の他のウィジェットを追加した時になります。ペインドウィンドウウィジェットに他のウィジェットを追加すれば、その追加したウィジェットの個数分の表示領域がペインドウィンドウウィジェットに追加され、それらの表示領域に追加したウィジェットが表示されることになります。これらのペインドウィンドウウィジェットに追加されたウィジェットは「子ウィジェット」と呼ばれます。
さらに、それらの表示領域の間にはサッシが自動的に追加されるようになっています。つまり、追加したウィジェットの個数 - 1
個のサッシがペインドウィンドウウィジェットに追加されることになります。そして、このサッシをスライドさせることで、表示領域のサイズを変化させることができ、表示領域のサイズの変化に伴って、その表示領域に表示されているウィジェットのサイズも変化することになります。
ただし、追加したウイジェットの個数が1つの場合はサッシが追加されないことになります。サッシが存在しないとウィジェットのサイズ変更も行えませんので、この場合はペインドウィンドウウィジェットを利用する意味はほとんど無いことになります。
また、ペインドウィンドウウィジェットの設定を変更することで、サッシに「ハンドル」を付けることが可能です。ただ、このハンドル自体には機能的な意味合いは特になく、それがサッシでスライド可能であることを示す目印くらいに考えて良いと思います。
ここまでの説明からも分かるように、ペインドウィンドウウィジェットでユーザーがウィジェットのサイズを調整できるようにするためには、単にペインドウィンドウウィジェットを作成するだけでなく、ペインドウィンドウウィジェットに他のウィジェットを複数追加する処理も必要となります。
ウィジェットのサイズが変化する仕組み
ここまで説明してきたように、ペインドウィンドウには複数の表示領域を設けることができ、各表示領域に子ウィジェットを表示することができます。そして、サッシをスライドさせることで、表示領域のサイズおよび子ウィジェットのサイズを変化させることが可能です。
ここで、サッシをスライドさせることで、子ウィジェットのサイズが変化する仕組みについて簡単に説明しておきます。
まず最初に理解していただきたいのが、サッシをスライドさせることで変化するのはあくまでも表示領域のサイズになります。そして、その表示領域のサイズの変化に伴って子ウィジェットのサイズが変化することになります。
子ウィジェットのサイズが変化するのは、その子ウィジェットの設定としてデフォルトで sticky=tkinter.NSEW
が指定されているからになります。sticky
に関しては、下記ページの sticky の節で解説しているので、詳細に関しては下記ページを参照していただければと思います。
sticky
は、ウィジェットを表示領域のどの方向の隅にくっつけて表示するのか、要は、どの方向に寄せて表示するのかを指定する設定となります。さらに、sticky
に複数の方向を指定することで、ウィジェットをそれらの方向の隅まで引き伸ばして表示することが可能となります。そして、tkinter.NSEW
は上下左右の全ての方向を指定するための定数であり、これを指定すれば、表示領域全体にウィジェットが引き伸ばして表示されることになります。
この引き伸ばしは表示領域が変化するたびに行われるため、サッシのスライドによって表示領域のサイズが変化すれば子ウィジェットのサイズも表示領域のサイズに合わせて変化することになります。つまり、サッシのスライドによって子ウィジェットのサイズが自動的に変化するのは、sticky
の設定によって子ウィジェットが引き伸ばして表示するようになっているからになります。
で、ここまで説明してきたように、子ウィジェットが上下左右の方向に対して引き伸ばして表示されるようになっているのは sticky
に tkinter.NSEW
が指定されているからであって、この指定を変更してやれば、上下左右の全方向にウィジェットを引き伸ばすのではなく、特定の方向に対してのみ子ウィジェットを引き伸ばすようにすることも可能です。例えば、sticky
に tkinter.W+tkinter.E
を指定すれば、子ウィジェットを左右方向に対してのみ引き伸ばすようにできます。
この sticky
に関しては、後述の sticky の節で詳細を解説します。
まずは、サッシのスライドの変更によって子ウィジェットのサイズが変化するのは sticky
の設定によるものであることは覚えておいてください。
スポンサーリンク
ペインドウィンドウウィジェットの使い方
では、続いてはペインドウィンドウウィジェットの使い方について解説していきたいと思います。
まずは、ペインドウィンドウウィジェットの使い方のイメージが湧くように、ペインドウィンドウウィジェットを利用した簡単なアプリのスクリプト例を示したいと思います。
import tkinter
app = tkinter.Tk()
app.geometry('700x400')
# ペインドウィンドウの作成
paned_window = tkinter.PanedWindow(
app,
sashrelief=tkinter.RAISED, # サッシの見た目
sashwidth=20, # サッシの幅
relief=tkinter.RAISED, # ペインドウィンドウの見た目
borderwidth=5, # ペインドウィンドウの外枠の太さ
)
# キャンバス作成
canvas = tkinter.Canvas(
paned_window,
width=300,
height=300,
background='pink'
)
# ボタン作成
button = tkinter.Button(
paned_window,
text='Button',
font=('', 20)
)
# エントリー作成
entry = tkinter.Entry(
paned_window,
font=('', 20),
width=10
)
# ペインドウィンドウにキャンバス追加
paned_window.add(canvas)
# ペインドウィンドウにボタン追加
paned_window.add(button)
# ペインドウィンドウにエントリー追加
paned_window.add(entry)
# ペインドウィンドウの配置(真ん中)
paned_window.place(
relx=0.5,
rely=0.5,
anchor=tkinter.CENTER
)
# 子ウィジェットを全て取得
children = paned_window.panes()
# 子ウィジェットの設定変更
for child in children:
paned_window.paneconfig(
child,
sticky=tkinter.E+tkinter.W, # 引き伸ばし方向
padx=10, # 横方向の余白
pady=10 # 縦方向の余白
)
# メインループ
app.mainloop()
このスクリプトを実行すれば、次の図のようなアプリが起動します。
真ん中に表示されているのがペインドウィンドウウィジェットで、このペインドウィンドウウィジェットには3つの表示領域が存在します。そして、この3つの表示領域には、左から順にキャンバスウィジェット、ボタンウィジェット、エントリーウィジェットが表示されています。
さらに、これらの表示領域の間にはサッシが存在し、このサッシをスライドさせることで、そのサッシの隣の表示領域および表示領域内の子ウィジェットのサイズが変化することが確認できると思います。
こんな感じで、複数の表示領域およびサッシが設けられ、さらにサッシのスライドによって表示領域および表示領域内の子ウィジェットのサイズを変更可能なウィジェットが「ペインドウィンドウウィジェット」になります。
ペインドウィンドウウィジェットの作成
次は、ペインドウィンドウウィジェットの使い方の手順を説明していきます。
まず、ペインドウィンドウウィジェットを使うためにはペインドウィンドウウィジェットの作成が必要となります。
ペインドウィンドウウィジェットは、tkinter の PanedWindow
クラスのコンストラクタを実行することで作成することができます。第1引数には、そのペインドウィンドウウィジェットの配置先となるウィジェット(メインウィンドウなど)を指定します。
先ほど示したスクリプトにおいては、下記部分でペインドウィンドウウィジェットの作成を行っています。
paned_window = tkinter.PanedWindow(
app,
sashrelief=tkinter.RAISED, # サッシの見た目
sashwidth=20, # サッシの幅
relief=tkinter.RAISED, # ペインドウィンドウの見た目
borderwidth=5, # ペインドウィンドウの外枠の太さ
)
ペインドウィンドウウィジェットの場合は、コンストラクタ実行時に必須となるのは第1引数(配置先ウィジェット)のみです。上記では他にも様々な引数を指定していますが、これらはペインドウィンドウウィジェットの見た目を調整するために指定しており、各引数については ペインドウィンドウウィジェットの設定 で説明します。
追加する子ウィジェットの作成
前述の通り、ペインドウィンドウウィジェットに表示領域やサッシを追加するためには、ペインドウィンドウウィジェットへの子ウィジェットの追加が必要となります。
そのため、まずはペインドウィンドウウィジェットに追加する子ウィジェットを作成する必要があります。これらの子ウィジェットは、特にペインドウィンドウウィジェットに追加することを意識することなく、通常通りに作成すればよいです。ただし、ペインドウィンドウウィジェットにサッシを表示して表示領域のサイズの調整をユーザーが行えるようにするためには、複数の子ウィジェットを作成する必要があるという点には注意してください。
先ほど示したスクリプトにおいては、キャンバスウィジェットとボタンウィジェットとエントリーウィジェットの3つの作成を行っています。
# キャンバス作成
canvas = tkinter.Canvas(
paned_window,
width=300,
height=300,
background='pink'
)
# ボタン作成
button = tkinter.Button(
paned_window,
text='Button',
font=('', 20)
)
# エントリー作成
entry = tkinter.Entry(
paned_window,
font=('', 20),
width=10
)
スポンサーリンク
子ウィジェットの追加
各種ウィジェットが作成できれば、次はペインドウィンドウウィジェットへの子ウィジェットの追加処理を行います。
この子ウィジェットの追加は、ペインドウィンドウウィジェットに add
メソッドを実行させることで実施することができます。この add
メソッドの引数には追加する子ウィジェットを指定します。
先ほど示したスクリプトにおいては、下記部分でペインドウィンドウウィジェットへの子ウィジェットの追加を実施しています。
# ペインドウィンドウにキャンバス追加
paned_window.add(canvas)
# ペインドウィンドウにボタン追加
paned_window.add(button)
# ペインドウィンドウにエントリー追加
paned_window.add(entry)
ペインドウィンドウウィジェットを利用しない場合、ウィジェットを表示するためには pack
メソッド or grid
メソッド or place
メソッドを利用してウィジェットの配置を実施する必要があります。ですが、ペインドウィンドウウィジェットの配置さえ行えば、そのペインドウィンドウウィジェットの子ウィジェットも一緒に表示されるようになるため、子ウィジェットに関しては配置処理の実施は不要となります。
ペインドウィンドウウィジェットの配置
ただし、ペインドウィンドウウィジェット自体は pack
メソッド or grid
メソッド or place
メソッドを利用したウィジェットの配置が必要となります。
この配置に関しては他のウィジェットと同様の手順で実施することが可能で、配置の詳細に関しては下記ページでまとめていますので、詳しく知りたい方は下記ページを参照してください。
Tkinterの使い方:ウィジェットの配置(pack・grid・place)先ほど示したスクリプトにおいては、下記でペインドウィンドウウィジェットの配置を行っています(アプリの中央に表示されるようにしています)。
paned_window.place(
relx=0.5,
rely=0.5,
anchor=tkinter.CENTER
)
ここまで説明してきたペインドウィンドウウィジェットの作成と配置を行えば、後は mainloop
を実行することでアプリが起動し、作成したペインドウィンドウウィジェットがアプリ上に表示されることになります。
子ウィジェットの設定変更
また、必要に応じて子ウィジェットの配置・表示の設定を変更することも可能です。
基本的には、ウィジェットの設定の変更は、ウィジェットの作成時、すなわちウィジェットのクラスのコンストラクタを実行する時に実施することになります。先ほど示したスクリプトにおいても、Canvas()
・Button()
・Entry()
実行時に引数を指定して各種ウィジェットの設定の変更を行っています。
また、下記ページで解説しているように、作成後の各ウィジェットに config
メソッドを実行させることでも設定の変更を行うことが可能です。
ただし、これらは各ウィジェットに対する個別の設定となります。ペインドウィンドウウィジェットでは、それらに加えて表示領域への子ウィジェットの配置・表示の仕方の設定も変更することが可能です。例えば、padx
や pady
を変更して表示領域に対して余白を設けて子ウィジェットを表示するようなことが可能です。また、ウィジェットのサイズが変化する仕組み でも紹介した sticky
の変更も可能です。こういった、子ウィジェットの配置・表示の仕方の設定は、ペインドウィンドウウィジェットの paneconfig
メソッドで変更可能です。
先ほど示したスクリプトにおいては下記部分で子ウィジェットの配置・表示の設定変更を実施しています。
# 子ウィジェットを全て取得
children = paned_window.panes()
# 子ウィジェットの設定変更
for child in children:
paned_window.paneconfig(
child,
sticky=tkinter.E+tkinter.W, # 引き伸ばし方向
padx=10, # 横方向の余白
pady=10 # 縦方向の余白
)
paneconfig
の第1引数には子ウィジェットを指定し、それ以降にはキーワード引数を指定します。このように引数を指定して paneconfig
メソッドを実行すれば、第1引数に指定した子ウィジェットの設定が、指定したキーワード引数に応じて変更されることになります。指定可能なキーワード引数に関しては、後述の 子ウィジェットの設定 で説明します。
また、上記で最初に実行している panes
は、実行したペインドウィンドウウィジェットの子ウィジェット全てを要素とするタプルを取得するメソッドになります。したがって、上記では、paned_window
の子ウィジェット全てに対して paneconfig
による設定変更を行っていることになります。もちろん、for
ループを使用せずに、children[1]
のように添え字を指定して特定の子ウィジェットのみに対して設定変更を行うことも可能です。
ペインドウィンドウウィジェットを利用する場合は、こういった子ウィジェットの配置・表示の仕方の設定変更に関しても必要に応じて実施する必要があります。
スポンサーリンク
ペインドウィンドウウィジェットの設定
次は、ペインドウィンドウウィジェットの設定について解説していきます。
他のウィジェット同様に、ペインドウィンドウウィジェットの見た目等の設定はキーワード引数を指定してコンストラクタ(tkinter.PanedWindow()
)や config
メソッドを実行することで変更可能です。これらに指定可能なキーワード引数名は下記により確認することができます。
# paned_window:ペインドウィンドウウィジェット
print(paned_window.keys())
ここでは、私が動作を理解している設定に対する解説のみを行わせていただきます。具体的には、下記の設定について説明していきます。
- orient
- width
- height
- background
- borderwidth
- relief
- sashwdith
- sashrelief
- sashpad
- showhandle
- handlepad
- handlesize
- opaqueresize
- proxybackground
- proxyborderwidth
- proxyrelief
- cursor
- sashcursor
これらは、あくまでもペインドウィンドウウィジェットに対する設定となります。前述の通り、ペインドウィンドウウィジェットに追加された子ウィジェットの設定も別途実施することが可能で、それらの設定に関しては 子ウィジェットの設定 で説明します。
私の下記環境での実行結果をもとに説明していますが、環境によっては動きが異なるかもしれません
実際にご自身の環境で実行結果を確認していただくと、より確実に設定の効果を理解することができると思います
- OS:Windows 11
- Python:3.12
- Tkinter:8.6
orient
orient
は、ペインドウィンドウウィジェットにおける表示領域の並び方向を設定するキーワード引数です。
orient
には、下記の2つの値が指定可能です。orient
のデフォルト値は tkinter.HORIZONTAL
です。
tkinter.HORIZONTAL
:表示領域を水平方向に並べるtkinter.VERTICAL
:表示領域を垂直方向に並べる
orient
がデフォルト値 or orient
に tkinter.HORIZONTAL
を指定している場合は、ペインドウィンドウウィジェットに追加したウィジェットは左から順に並べられて表示されることになります。さらに、サッシは水平方向にのみスライド可能で、サッシのスライドによって各ウィジェットの幅を変更することが可能です。
それに対し、orient
に tkinter.VERTICAL
を指定している場合は、ペインドウィンドウウィジェットに追加したウィジェットは上から順に並べられて表示されることになります。さらに、サッシは垂直方向にのみスライド可能で、サッシのスライドによって各ウィジェットの高さを変更することが可能です。
例えば下記のようにペインドウィンドウウィジェットを生成してウィジェットの追加を行えば、そのペインドウィンドウウィジェットには上から順にキャンバスウィジェット、ボタンウィジェット、エントリーウィジェットが並んで表示されることになります。
paned_window = tkinter.PanedWindow(
# 略
orient=tkinter.VERTICAL
)
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
entry = tkinter.Entry(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.add(entry)
width
・height
width
と height
は、それぞれペインドウィンドウウィジェットの幅と高さを指定するキーワード引数です。
width
と height
には整数を指定します。単位はピクセルです。
ペインドウィンドウウィジェットに width
や height
を指定した場合は、ペインドウィンドウウィジェットが指定された幅と高さになるよう、子ウィジェット側の幅や高さが自動的に調整されるようになっています。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、そのペインドウィンドウウィジェットの幅と高さがそれぞれ 1000
ピクセル・500
ピクセルに設定されます。
paned_window = tkinter.PanedWindow(
# 略
width=1000,
height=500
)
width
と height
を指定しなかった場合は、基本的には子ウィジェットの幅と高さは、子ウィジェット側で設定された幅と高さがそのまま適用され、それらの幅と高さに応じてペインドウィンドウウィジェット側の幅と高さが自動的に調整されることになります。
ただし、orient
に tkinter.HORIZONTAL
を指定した場合、高さに関しては、全ての子ウィジェットのうち、一番大きな高さが各子ウィジェットに適用されることになります。
それに対し、orient
に tkinter.VFRTICAL
を指定した場合は、幅に関しては、全ての子ウィジェットのうち、一番大きな幅が各子ウィジェットに適用されることになります。
つまり、ペインドウィンドウウィジェットのサッシのスライド可能な方向と直交する方向のウィジェットのサイズ(高さ or 幅)は全ての子ウィジェットで均一となります。
この理由は、ウィジェットのサイズが変化する仕組み で説明した子ウィジェットの sticky
の設定が作用しているからになります。したがって、この sticky
の設定を変更すれば、ペインドウィンドウウィジェットのサッシのスライド可能な方向と直交する方向のサイズを均一ではなく、子ウィジェットごとに設定することも可能となります。この sticky
に関しては、後述の sticky の節で解説します。
スポンサーリンク
background
background
は、ペインドウィンドウウィジェットの外枠の色・各表示領域の背景色・サッシの色を設定するキーワード引数です。background
に関しては、略して bg
キーワード引数で指定することも可能です。
background
の値としては、色名やカラーコード等を指定することが可能です。
基本的に、ペインドウィンドウウィジェットの子ウィジェットは表示領域全体に引き伸ばした状態で表示するため、表示領域の背景は見えないようになっています。ただし、余白量や引き伸ばしの設定を変更した場合、子ウィジェットは表示領域全体に引き伸ばされないようになるため、その際には表示領域の背景が見えるようになり、その背景の色が background
で指定した色となります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、そのペインドウィンドウウィジェットの外枠の色、各表示領域の背景色及びサッシの色が青色に変化することになります。
paned_window = tkinter.PanedWindow(
# 略
background='blue'
)
borderwidth
borderwidth
は、ペインドウィンドウウィジェットの外枠の太さを設定するキーワード引数です。
borderwidth
には整数を指定します。単位はピクセルです。borderwidth
のデフォルト値は、おそらく 1
です。外枠を消したい場合は 0
を指定してやれば良いです。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェットの外枠の幅が 10
ピクセルに変化します。
paned_window = tkinter.PanedWindow(
# 略
borderwidth=10
)
relief
relief
は、ペインドウィンドウウィジェットの見た目を設定するキーワード引数です。
relief
に指定可能な値や、それらの値を指定したときのウィジェットの見た目に関しては下記ページで解説していますので、詳しくは下記ページの relief をご参照ください(フレームの例で説明していますが、見た目の変化に関してはペインドウィンドウウィジェットにおいても同様になります)。
relief
の指定によってウィジェットの見た目が変化するのは外枠が太い場合です。boarderwidth
に小さい値が指定されていたりデフォルト値のままだったりすると relief
の指定を変更しても見た目が変化しないので注意してください。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、そのペインドウィンドウウィジェットが浮き上がるような見た目に変化します。
paned_window = tkinter.PanedWindow(
# 略
borderwidth=10,
relief=tkinter.RAISED
)
スポンサーリンク
sashwidth
sashwidth
は、ペインドウィンドウウィジェットのサッシの幅を設定するキーワード引数です。ちなみに、sash とはサッシを表す英単語になります。
sashwidth
には整数を指定します。単位はピクセルです。sashwidth
のデフォルト値は、おそらく 3
です。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェットのサッシの幅が 10
ピクセルに変化します。
paned_window = tkinter.PanedWindow(
# 略
sashwidth=10
)
sashrelief
sashrelief
は、ペインドウィンドウウィジェットのサッシの見た目を設定するキーワード引数です。relief で紹介した relief
はペインドウィンドウ自体の見た目を設定する引数であり、ここで説明する sashrelief
はサッシ部分の見た目を設定する引数となります。
sashrelief
に指定可能な値に関しては、relief でも紹介した、下記ページの relief の節をご参照ください。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、そのペインドウィンドウウィジェットのサッシが浮き上がるような見た目に変化します。
paned_window = tkinter.PanedWindow(
# 略
sashrelief=tkinter.RAISED
)
sashpad
sashpad
は、ペインドウィンドウウィジェットのサッシ周りの余白の大きさを設定するキーワード引数です。
sashpad
には整数を指定します。単位はピクセルです。sashpad
のデフォルト値は、おそらく 0
です。
sashpad
に 1
以上の整数を指定した場合、表示領域の並びの方向に対する余白が表示されるようになります。具体的には、orient=tkinter.HORIZONTAL
を指定している場合は、サッシの左右に余白が表示されます。それに対し、orient=tkinter.VERTICAL
を指定している場合は、サッシの上下に余白が表示されます。
また、このサッシの余白の色に関しても background で紹介した background
に指定した色が設定されることになります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェットのサッシの余白のサイズが 10
ピクセルになります。
paned_window = tkinter.PanedWindow(
# 略
sashpad=10
)
スポンサーリンク
showhandle
showhandle
は、ペインドウィンドウウィジェットのサッシへのハンドルの表示 / 非表示を設定するキーワード引数です。
showhandle
には Bool 値(True
or False
)を指定します。showhandle
のデフォルト値は False
なので、ハンドルを表示したいのであれば showhandle=True
を指定する必要があります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェットのサッシにハンドルが表示されるようになります。
paned_window = tkinter.PanedWindow(
# 略
showhandle=True
)
handlesize
handlesize
は、ハンドルのサイズ(幅と高さ)を設定するキーワード引数です。ハンドルに関する設定となりますので、この引数を指定する場合は showhandle=True
を指定しておく必要があります。
handlesize
には整数を指定します。handlesize
のデフォルト値は、おそらく 8
です。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、表示されるハンドルのサイズが 30
になります。
paned_window = tkinter.PanedWindow(
# 略
handlesize=30
)
handlepad
handlepad
は、ハンドルの位置を設定するキーワード引数です。ハンドルに関する設定となりますので、この引数を指定する場合は showhandle=True
を指定しておく必要があります。
handlepad
には整数を指定します。handlepad
のデフォルト値は、おそらく 8
です。
orient=tkinter.HORIZONTAL
を指定している場合は、サッシの一番上から handlepad
だけ下に移動させた位置にハンドルが配置されることになります。それに対し、orient=tkinter.VERTICAL
を指定している場合は、サッシの一番左から handlepad
だけ右に移動させた位置にハンドルが配置されることになります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ハンドルはサッシの一番上から 30
ピクセル下の位置に表示されることになります。
paned_window = tkinter.PanedWindow(
# 略
orient=tkinter.HORIZONTAL
handlepad=30,
)
スポンサーリンク
opaqueresize
opaqueresize
は、サッシのスライドによる表示領域のサイズの変更の仕方を設定するキーワード引数です。
opaqueresize
には Bool 値(True
or False
)を指定します。デフォルト値は True
です。
opaqueresize
に True
を指定している場合(or opaqueresize
を指定しない場合)、マウスのドラッグ操作でサッシをスライドするとリアルタイムに表示領域のサイズが変化することになります。
それに対し、opaqueresize
に False
を指定している場合、サッシをスライドさせてもマウスのドラッグ操作中は表示領域のサイズは変化しません。代わりに、サッシの分身となる線がスライドするのみとなります。そして、マウスのドラッグ操作をやめたタイミングで、その分身となる線の位置にサッシが移動して表示領域のサイズも変化するようになります。
いずれにしてもサッシのスライドによって表示領域のサイズが変化することになりますが、変化させるときの見せ方・見え方が opaqueresize
の指定によって異なることになります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、サッシをマウスのドラッグ操作でスライドさせるとサッシの代わりに分身となる線がスライドするようになり、ドラッグ操作をやめると、その線の位置にサッシが移動して表示領域のサイズが変化するようになります。
paned_window = tkinter.PanedWindow(
# 略
opaqueresize=False
)
proxybackground
前述の通り、opaqueresize=False
を指定している場合、サッシのスライド時にサッシの分身となる線が表示されるようになります。proxtybackground
は、その線の色を指定するキーワード引数となります。
proxybackground
の値としては、色名やカラーコード等を指定することが可能です。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、サッシのスライド時に表示される分身の線の色がピンク色に変化することになります。
paned_window = tkinter.PanedWindow(
# 略
opaqueresize=False,
proxybackground='pink'
)
proxyborderwidth
proxtybackground
は、サッシのスライド時に表示されるサッシの分身となる線の枠の太さを設定するキーワード引数です。前述の通り、この線を表示するためには opaqueresize=False
を指定しておく必要があります。
proxyborderwidth
には整数を指定します。単位はピクセルです。
proxyborderwidth
は、サッシの分身となる線の幅を指定するキーワード引数ではなく、サッシの分身となる線の「枠の太さ」を設定するキーワード引数であるという点に注意してください。この線の幅自体はサッシの幅、すなわち sashwidth
によって決まります。そして、proxyborderwidth
を指定することで、この線の内側に存在する枠の太さを設定することができます。
さらに、次に説明する proxyrelief
を指定することで、その proxyrelief
の指定と枠の太さに応じてサッシの分身の線の見た目が変化することになります。ただし、proxyrelief
に tkinter.FLAT
を指定した場合や、proxyrelief
を指定しない場合は、枠も含めてサッシの分身の線が平坦な見た目となるため、proxyborderwidth
に指定する値を変化させてもサッシの分身の線の見た目は変化しないことになります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、サッシのスライド時に表示される分身の線の枠の太さが 5
ピクセルになります。
paned_window = tkinter.PanedWindow(
# 略
opaqueresize=False,
proxyborderwidth=5
)
スポンサーリンク
proxyrelief
proxyrelief
は、サッシのスライド時に表示されるサッシの分身となる線の見た目を設定するキーワード引数です。前述の通り、この線を表示するためには opaqueresize=False
を指定しておく必要があります。
proxyrelief
に指定可能な値に関しては、relief でも紹介した、下記ページの relief の節をご参照ください。また、見た目が変化するのは枠が太い時になりますので、proxyborderwidth
も併せて指定する必要があります。
例えば下記のようにペインドウィンドウウィジェットを生成すれば、サッシのスライド時に表示される分身の線が浮き上がるような見た目に変化します。
paned_window = tkinter.PanedWindow(
# 略
opaqueresize=False,
proxyborderwidth=5,
proxyrelief=tkinter.RAISED
)
cursor
cursor
は、マウスカーソルをペインドウィンドウウィジェット上(サッシ部分を除く)に移動させたときのカーソルの見た目を設定するキーワード引数です。
cursor
に指定可能な値に関しては、公式の下記ページで紹介されていますので、下記ページを参考にしていただければと思います。
https://tcl.tk/man/tcl8.6/TkCmd/cursors.htm
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェット上にマウスカーソルを合わせたときのカーソルの見た目が「手」に変化します(Windows の場合は)。
paned_window = tkinter.PanedWindow(
# 略
cursor='hand1'
)
sashcursor
sashcursor
は、マウスカーソルをペインドウィンドウウィジェットのサッシ上に移動させたときのカーソルの見た目を設定するキーワード引数です。
sashcursor
に指定可能な値は cursor
と同じであり、これらの指定可能な値に関しては公式の下記ページで紹介されていますので、下記ページを参考にしていただければと思います。
https://tcl.tk/man/tcl8.6/TkCmd/cursors.htm
例えば下記のようにペインドウィンドウウィジェットを生成すれば、ペインドウィンドウウィジェットのサッシ上にマウスカーソルを合わせたときのカーソルの見た目が「手」に変化します(Windows の場合は)。
paned_window = tkinter.PanedWindow(
# 略
sashcursor='hand1'
)
スポンサーリンク
子ウィジェットの設定
続いて、子ウィジェットの設定について解説していきます。
ここまで説明してきたように、add
メソッドでペインドウィンドウウィジェットにウィジェットを追加することで、ペインドウィンドウウィジェット上に追加したウィジェットを並べて表示することができるようになります。さらに、サッシのスライドによってウィジェットのサイズも変化するようになります。この、ペインドウィンドウウィジェットに追加されたウィジェットのことを子ウィジェットと呼びます。
そして、この子ウィジェットの特に表示・配置に関する設定は、ペインドウィンドウィジェットに paneconfig
メソッドを実行させることで変更可能です。このメソッドの第1引数には、設定を変更したい子ウィジェットを指定します。さらに、それ以降にキーワード引数を指定することで、その引数指定に応じて子ウィジェットの表示・配置に関する設定が変更されることになります。
# paned_window:PanedWindowのインスタンス
paned_window.paneconfig(子ウィジェット, キーワード引数1, キーワード引数2, …)
もしくは、add
メソッドにキーワード引数を指定することで、ペインドウィンドウウィジェットにウィジェットを追加するときに、同様の設定を行うことも可能です。
# paned_window:PanedWindowのインスタンス
paned_window.add(子ウィジェット, キーワード引数1, キーワード引数2, …)
ここでは、add
メソッドや paneconfig
メソッドに指定可能な「子ウィジェットの設定を変更するキーワード引数」の紹介を行っていきます。これらのメソッドに指定可能なキーワード引数は、具体的には下記の8個となります。
以降では、paneconfig
を利用して設定を変更することを前提に解説を進めますが、add
でも paneconfig
と同じキーワード引数が指定で、そのキーワード引数を指定したときの効果も同じとなります。
after
・before
after
と before
は、paneconfig
メソッドの第1引数に指定した子ウィジェットを、他の特定の子ウィジェットの後ろ側 or 前側に移動することを設定するキーワード引数になります。
基本的には、子ウィジェットはペインドウィンドウウィジェットに追加された順に表示されることになりますが、この after
と before
の指定により、子ウィジェットの並びを変更することができます。
after
と before
には、子ウィジェットを指定します。
例えば第1引数に widget2
を指定し、さらに before=widget1
を指定して paneconfig
メソッドを実行した場合、widget2
が widget1
の前側に移動することになります。
それに対し、第1引数に widget2
を指定し、さらに after=widget3
を指定して paneconfig
メソッドを実行した場合、widget2
が widget3
の後ろ側に移動することになります。
例えば下記のように paneconfig
メソッドを実行すれば、ボタンウィジェット(button
)がキャンバスウィジェット(canvas
)の前側に表示されることになります。
# paned_window:ペインドウィンドウウィジェット
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.paneconfig(button, before=canvas)
width
・height
width
と height
は、paneconfig
メソッドの第1引数に指定した子ウィジェットの幅と高さを設定するキーワード引数になります。
width
と height
には整数を指定します。単位はピクセルです。
ただし、必ずしもこれらの設定が子ウィジェットに適用されるわけではないという点に注意してください。例えば、ペインドウィンドウウィジェット側の幅や高さを width
や height
を指定した場合は、ペインドウィンドウウィジェットの幅や高さがそれらの値となるように自動的に子ウィジェットの幅や高さが調整されることになります。また、ウィジェットのサイズが変化する仕組み で説明したように、sticky
の設定によっては子ウィジェットが表示領域に対して引き伸ばして表示されることになり、この場合も子ウィジェットの幅や高さが自動的に変更されることになります。
このように、paneconfig
メソッドによる子ウィジェットの width
や height
の設定が適用されず、自動的に幅や高さが調整される場合があるので注意してください。
例えば下記のように paneconfig
メソッドを実行すれば、ボタンウィジェット(button
)の幅が 200
ピクセルに設定されることになります。
# paned_window:ペインドウィンドウウィジェット
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.paneconfig(button, width=200)
スポンサーリンク
padx
・pady
padx
と pady
は、paneconfig
メソッドの第1引数に指定した子ウィジェットを表示する表示領域の余白のサイズを設定するキーワード引数になります。
padx
と pady
には整数を指定します。単位はピクセルです。
例えば下記のように paneconfig
メソッドを実行すれば、ボタンウィジェット(button
)を表示する表示領域には横方向に 10
ピクセル、縦方向に 20
ピクセルの余白が設けられ、その余白を除いた領域に対してボタンウィジェットが引き伸ばされた状態で表示されることになります。
# paned_window:ペインドウィンドウウィジェット
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.paneconfig(button, padx=10, pady=20)
minsize
minsize
は、paneconfig
メソッドの第1引数に指定した子ウィジェットの最小サイズを設定するキーワード引数になります。
minsize
には整数を指定します。単位はピクセルです。
minsize
で最小サイズを設定しておけば、サッシのスライドを行っても、その子ウィジェットは設定した最小サイズよりも小さくならないようになります。
例えば下記のように paneconfig
メソッドを実行すれば、サッシのスライドを行っても、ボタンウィジェット(button
)は 100
ピクセルよりも小さなサイズにならないようになります。
# paned_window:ペインドウィンドウウィジェット
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.paneconfig(button, minsize=100)
sticky
sticky
は、paneconfig
メソッドの第1引数に指定した子ウィジェットを表示領域のどの方向の隅にくっつけて表示するのかを設定するキーワード引数になります。また、複数の方向を指定することで、それらの方向に引き伸ばした子ウィジェットを表示することも可能です。
ウィジェットのサイズが変化する仕組み で解説したように、サッシのスライドによって表示領域のサイズが変化し、さらにそれに伴ってウィジェットのサイズが変化するのは、子ウィジェットが表示領域の全方向に引き伸ばした状態で表示されるようになっているためです。この引き伸ばしに関する設定を sticky
引数の指定によって変更することができます。
sticky
には、下記のような値を指定することが可能です。さらに、これらの値を足し合わせることで、複数の方向を同時に指定することが可能となります。
tkinter.N
:上tkinter.S
:下tkinter.W
:左tkinter.E
:右tkinter.NW
:左上tkinter.NE
:右上tkinter.SW
:左下tkinter.SE
:右下
1つの方向のみを指定した場合、基本的にはウィジェットは、その方向の隅に配置されることになります。例えば、sticky
に tkinter.E
を指定した場合は、ウィジェットは右隅に表示されることになります。
複数の方向を指定した場合、複数の方向の隅に配置されるよう、ウィジェットが引き伸ばされて配置されることになります。例えば、sticky
に tkinter.E + tkinter.W
を指定した場合は、左右の両方の隅にウィジェットが表示されるよう、左右方向に引き伸ばしたウィジェットが表示されることになります。
この sticky
の設定により、子ウィジェットの配置位置や子ウィジェットの引き伸ばし方を変更することが可能です。ただし、サッシのスライドによってウィジェットのサイズが変化するようにするために、サッシがスライドする方向への引き伸ばしが行われるように sticky
を設定するようにした方が良いです。
というか、そのように sticky
を設定しなかったとしても、アプリ表示時は設定どおりに子ウィジェットは表示されますが、サッシをスライドしたときに自動的にサッシがスライドする方向への引き伸ばしが行われるように設定変更が行われるようです…。
ということで、sticky
の設定を変更するとしても、サッシがスライドする方向への引き伸ばしは行われるように変更するようにしましょう。
具体的に言えば、orient=tkinter.HORIZONTAL
が指定されている場合、サッシは左右にスライドされることになるため、子ウィジェットの左右への引き伸ばしを実現するために tkinter.E + tkinter.W
の指定は必須で、それに加えて tkinter.N
or tkinter.S
の足し合わせを必要に応じて行えば良いです。すなわち、sticky
には下記のいずれかを指定してやれば良いことになります。
- 上に表示したい場合:
tkinter.E + tkinter.W + tkinter.N
- 中央に表示したい場合:
tkinter.E + tkinter.W
- 下に表示したい場合:
tkinter.E + tkinter.W + tkinter.S
同様に、orient=tkinter.VERTICAL
が指定されている場合は、sticky
には下記のいずれかを指定してやれば良いことになります。
- 左に表示したい場合:
tkinter.N + tkinter.S + tkinter.W
- 中央に表示したい場合:
tkinter.N + tkinter.S
- 右に表示したい場合:
tkinter.N + tkinter.S + tkinter.E
例えば下記のように paneconfig
メソッドを実行すれば、ボタンウィジェットは横方向に引き伸ばされ、さらに下側に配置されることになります(キャンバスの高さがボタンウィジェットの高さよりも大きい場合)。
# paned_window:ペインドウィンドウウィジェット
canvas = tkinter.Canvas(略)
button = tkinter.Button(略)
paned_window.add(canvas)
paned_window.add(button)
paned_window.paneconfig(
button,
sticky=tkinter.W + tkinter.E + tkinter.S
)
スポンサーリンク
PanedWidget
クラスのメソッド
最後に PanedWidget
クラスに用意されたメソッドについて紹介していきたいと思います。
ここでは、PanedWidget
クラス特有のメソッド&私が動作を理解している下記のメソッドを紹介します。
add
add
は、実行したペインドウィンドウウィジェットに、引数で指定されたウィジェットを子ウィジェットとして追加するメソッドとなります。ここまで説明してきた通り、追加されたウィジェットはペインドウィンドウィジェット上に表示されるようになります。また、各子ウィジェットの間にはサッシが追加され、そのサッシのスライドによって各子ウィジェットのサイズが変更可能です。
add
メソッドの第1引数には、ペインドウィンドウウィジェットに追加したいウィジェットを指定します。それ以降に 子ウィジェットの設定 で紹介したキーワード引数を指定すれば、追加するウィジェットの表示や配置に関する設定を変更することが可能です。また、add
メソッドの返却値はなし(None
)となります。
例えば下記のように add
メソッドを実行すれば、paned_window
にボタンウィジェット(button
)を追加することができ、さらに、そのボタンウィジェットの最小サイズが 60
ピクセルとなります。
button = tkinter.Button(略)
#paned_window:PanedWindowのインスタンス
paned_window.add(button, minsize=60)
remove
・forget
remove
と forget
は同じメソッドで、実行したペインドウィンドウウィジェットから、引数で指定された子ウィジェットを削除するメソッドになります。
remove
・forget
メソッドの第1引数には、ペインドウィンドウウィジェットに追加済みの子ウィジェットを指定します。また、remove
・forget
メソッドの返却値はなし(None
)となります。
例えば下記のように remove
メソッドを実行すれば、paned_window
に追加済みのボタンウィジェット(button
)を paned_window
から削除することができます。
button = tkinter.Button(略)
#paned_window:PanedWindowのインスタンス
paned_window.add(button)
paned_window.remove(button)
スポンサーリンク
panes
panes
は、実行したペインドウィンドウウィジェットに追加済みの全ての子ウィジェットを要素とするタプルを取得するメソッドになります。
panes
の引数はなしです。また、panes
の返却値は、前述の通り、実行したペインドウィンドウウィジェットに追加済みの全ての子ウィジェットを要素とするタプルとなります。これらの要素は、ペインドウィンドウ上に表示される順に整列されています。
例えば下記を実行すれば、paned_window
に追加済みの全ての子ウィジェットに対して remove
メソッドが実行され、全ての子ウィジェットが削除されることになります。
#paned_window:PanedWindowのインスタンス
for w in paned_window.panes():
paned_window.remove(w)
paneconfig
・paneconfigure
paneconfig
と paneconfigure
は同じメソッドで、子ウィジェットの表示や配置に関する設定を変更するメソッドになります。
paneconfig
・paneconfigure
の第1引数には、設定を変更したい子ウィジェットを指定します。それ以降に、子ウィジェットの設定 で紹介したキーワード引数を指定することで、それらの指定に応じて子ウィジェットの設定を変更することができます。また、paneconfig
・paneconfigure
の返却値はなし(None
)となります。
例えば下記のように paneconfig
を実行すれば、paned_window
に追加したボタンウィジェット(button
)の最小サイズが 60
ピクセルとなります。
button = tkinter.Button(略)
#paned_window:PanedWindowのインスタンス
paned_window.add(button)
paned_window.paneconfig(button, minsize=60)
panecget
panecget
は、子ウィジェットの設定を取得するメソッドになります。
panecget
の第1引数には、設定を取得したい子ウィジェットを指定し、第2引数に取得したい設定名を文字列で指定します。指定可能な設定名は、子ウィジェットの設定 で紹介したキーワード引数のキー名となります。第1引数に、panecget
を実行するペインドウィンドウウィジェットの子ウィジェットでないウィジェットを指定した場合は下記のような例外が発生することになります。
_tkinter.TclError: not managed by this window
また、panecget
メソッドの返却値は、指定した設定名の設定値となります。
例えば下記のように paneconfig
を実行すれば、paned_window
に追加したボタンウィジェット(button
)の最小サイズを取得することができます。
button = tkinter.Button(略)
#paned_window:PanedWindowのインスタンス
paned_window.add(button)
paned_window.panecget(button, 'minsize')
スポンサーリンク
sash_coord
sash_coord
は、サッシの左上座標を取得するメソッドになります。
sash_coord
の第1引数には、座標を取得したいサッシのインデックスを指定します。インデックスは、0
から始まる整数であり、orient=tkinter.HORIZONTAL
が指定されている場合は一番左のサッシから順に 0
・1
・2
・・・ のインデックスが割り当てられることになり、orient=tkinter.VERTICAL
が指定されている場合は一番上のサッシから順に 0
・1
・2
・・・ のインデックスが割り当てられることになります。第1引数に指定したインデックスのサッシが存在しない場合は、下記の例外が発生します。
_tkinter.TclError: invalid sash index
また、sash_coord
メソッドは、指定したインデックスのサッシの左上隅部分の x
座標と y
座標を要素とするタプルを返却します。
例えば下記のように sash_coord
を実行すれば、paned_window
の上から3番目のサッシの左上座標を取得することができます。
# paned_widget:ペインドウィンドウウィジェット
paned_window.config(orient=tkinter.VERTICAL)
paned_window.sash_coord(2)
sash_place
sash_place
は、サッシを特定の座標にスライドさせるメソッドになります。
sash_place
の第1引数にはスライドさせたいサッシのインデックスを指定し、第2引数にスライド先の x
座標、第3引数にスライド先の y
座標を指定します。
あくまでも、sash_place
はサッシをスライドするメソッドとなるため、第2引数と第3引数で指定した x
座標と y
座標のうち、スライド不可の方向の座標は無視されることになります。具体的には、orient=tkinter.HORIZONTAL
が指定されている場合は第3引数で指定した y
座標が無視され、orient=tkinter.VERTICAL
が指定されている場合は第2引数で指定した x
座標が無視されることになります。
また、sash_place
でサッシをスライド可能な位置は、マウスのドラッグ操作でもスライド可能な位置のみとなります。例えば、ペインドウィンドウウィジェットのサイズを超えた位置を指す座標を指定して sash_place
を実行した場合でも、ペインドウィンドウウィジェット内の位置にサッシがスライドされるのみとなります。
さらに、第1引数に指定したインデックスのサッシが存在しない場合は、下記の例外が発生します。
_tkinter.TclError: invalid sash index
また、sash_place
メソッドの返却値は空のタプルとなります。
例えば下記のように sash_place
を実行すれば、paned_window
の上から3番目のサッシが y = 100
の 座標にスライドすることになります(その座標にサッシがスライド可能であれば)。
# paned_widget:ペインドウィンドウウィジェット
paned_window.config(orient=tkinter.VERTICAL)
paned_window.sash_place(2, 0, 100)
まとめ
このページでは、Tkinter のペインドウィンドウウィジェットについて解説しました!
ペインドウィンドウウィジェットは、追加された子ウィジェットをまとめて並べて表示するウィジェットです。さらに、ペインドウィンドウウィジェットにはサッシが設けられており、このサッシをマウスでスライドすることでウィジェットのサイズを変更することが可能です。
特に、ウィジェットのサイズをユーザーがマウス操作で変更可能という点がペインドウィンドウウィジェットならではの特徴です。使いどころが見つかればかなり有用なウィジェットになると思いますので、まずはペインドウィンドウウィジェットの特徴や、ペインドウィンドウウィジェットの使い方について覚えておきましょう!
オススメ参考書(PR)
Tkinter に興味がある方には下記のPythonでつくる ゲーム開発 入門講座がオススメです。
Tkinter をゲーム開発を通して「楽しく学ぶ」ことができます。Python 入門者、Tkinter 入門者の方にオススメです。