Pythonで作るGUIアプリ入門 Part17　-タブグループの設定-

タブグループの設定

タブグループは、ウィンドウ内で複数のレイアウトをタブとして持っているコンテナウィジェットです。タブは、タブグループの中に含まれていてそのままウィジェットとして配置する事は出来ません。タブグループは、sg.TabGroup([[sg.Tab(text', tab1_layout),   sg.Tab('text', tab2_layout)]]))として設定をします。タブグループ内にタブウィジェットを持ちます。タブは、sg.Tab(title, layout)として設定します。

図17-1に示すシンプルなGUIアプリを作成して、タブグループとタブの設定方法を学びましょう。Tab1とTab2にはテキストとボタンを設置して、ボタンを押すと図17-2のようにポップアップが表示されます。

図17-1

図17-2

コードは、以下の通りとなります。

import PySimpleGUI as sg

tab1_layout = [[sg.T('タブ１のレイアウト')], [sg.Button('ボタン1', key='-Btn1-')]]

tab2_layout = [[sg.T('タブ２のレイアウト')], [sg.Button('ボタン2', key='-Btn2-')]]

layout = [
    [sg.TabGroup(
        [[sg.Tab('Tab 1', tab1_layout, tooltip='タブ１です'),
          sg.Tab('Tab 2', tab2_layout, tooltip='タブ２です')]])],
]

window = sg.Window('タブ付きウィンドウ', layout, default_element_size=(30, 1), size=(200, 120))

while True:
    event, values = window.read()
    if event == '-Btn1-':
        sg.popup('ボタン１のイベント')
    elif event == '-Btn2-':
        sg.popup('ボタン２のイベント')
    if event is None:
        break

window.close()

レイアウトの設定

メインウィンドウのレイアウトを設定する前に、タブグループ内に配置するタブのレイアウトを指定します。ここでは、tab1_layoutとtab2_layoutとします。レイアウトの指定方法は、メインのレイアウトと同様です。テキストエリアやボタン、それ以外のウィジェットも設置出来ます。それぞれのウィジェットにキーを割り当てる事も出来ます。今回は、それぞれのタブにボタン１とボタン２を設置します。

tab1_layout = [[sg.Text('タブ１のレイアウト')], [sg.Button('ボタン1', key='-Btn1-')]]

tab2_layout = [[sg.Text('タブ２のレイアウト')], [sg.Button('ボタン2', key='-Btn2-')]]

次は、メインのレイアウトを設定します。 
複数行にまたがっていますが、１つのTabGroupウィジェットです。
1行目でsg.TabGroup([[sg.Tab(),sg.Tab()]]) を設定します。そして、そのプロパティーとしてタブを指定します。

2行目でタブ１をsg.Tab('Tab 1', tab1_layout, tooltip='タブ１です')として設定しています。タブは、'Tab 1'として、タブに表示されるテキストを指定します。そして、次に先ほど設定したtab1_layoutを指定します。また、ツールチップtooltip='タブ１です'を設定して、タブの説明を表示させる事も出来ます。

3行目でタブ２をsg.Tab('Tab 2', tab2_layout, tooltip='タブ２です')として設定しています。タブ１と同じですので、説明は割愛します。

layout = [
    [sg.TabGroup(
        [[sg.Tab('Tab 1', tab1_layout, tooltip='タブ１です'),
          sg.Tab('Tab 2', tab2_layout, tooltip='タブ２です')]])],
]

イベントの設定

タブ１、タブ２それぞれのボタン'-Btn1-'と'-Btn2-'が押された際にポップアップが表示されるようにしています。非常にシンプルな処理ですので説明は割愛いたします。

    if event == '-Btn1-':
        sg.popup('ボタン１のイベント')
    elif event == '-Btn2-':
        sg.popup('ボタン２のイベント')

以上のようにタブグループとタブを設定する事が出来ます。

GUIアプリ入門講座は毎日更新します！
記事が参考になりましたら、❤️を押していただけると励みになります😊