PysimpleGUI 入力ボックスの作り方

2021年6月20日

こんにちは、せつやです。

今回は、PysimpleGUIシリーズ第3弾として「入力ボックス」の作り方になります。
データを入力させたい場合に、よく使用すると思いますので参考にしてみてください。

PysimpleGUI 入力ボックス完成サンプル画像

テキストボックスに文字を入力した後
ボタンをクリックするとテキストに入力した文字が表示されます。

入力ボックス部分のコード

layout = [
           [ sg.InputText("ここに入力してください。",
                       font=('メイリオ',10),
                       size=(31,0),
                       key='input1')],
    ]

解説付きコード

layout = [
                       # (1)入力ボックス内の初期値を指定
           [ sg.InputText("ここに入力してください。",

                       # (2)入力ボックス内の文字フォント、文字サイズを指定
                       font=('メイリオ',10),

                       # (3)入力ボックスのサイズを指定 size=(長さ、高さ)
                       size=(31,0),

                       # (4)入力ボックスの名前(動作コードに紐づけます)
                       key='input1')],
    ]
(1) 入力ボックスの初期値
 [ sg.InputText("ここに入力してください。",

テキストボックスに最初から値を入力させておきたい場合に指定します。
空欄にしたい場合は、ここに入力してください。の部分は何も入力しなくて大丈夫です。
また、変数を指定することもできます🙂

(2) 入力ボックス内の文字フォント
font=('メイリオ',10),

文字フォントと文字サイズを指定しています。

(3) 入力ボックスのサイズ
size=(31,0),

入力ボックスの横幅と縦幅を指定します。

ただし、縦幅については、文字の大きさに依存するため、ボックス縦に大きくしたい場合は
文字のサイズも一緒に大きくする必要があります。

※size=(横幅,縦幅)

(4) 入力ボックスの固有キー
key='input1')

固有キーを設定することで、キーに紐づけて設置した入力ボックスの値を取得したり
また、逆に入力ボックスに値を戻すといった事が可能になります。
名前は任意に指定して構いません。

ボタンの動作部分のコード

    if event == "button1":
        # (1) input1 に入力された文字を取得
        input1 = values['input1']

        # (2) input1 に入力された文字をテキスト3へ代入して更新
        window['text3'].update(input1,text_color=("#ffffff"))
(1) 入力ボックスに入力された文字を変数に取得します。
input1 = values['input1']

values を使って入力ボックスに割り当てたkeyを指定することで
入力ボックスの値を取得することができます。

(2) 入力ボックスから取得した文字を表示します。
window['text3'].update(input1,text_color=("#ffffff"))

取得した変数データを使って、text3の文字を更新しています。

Pythonでそのまま使えるサンプルコード

# coding: utf-8
# *************************************************************************************
# * PysimpleGUI 入力ボックスの作り方
# *************************************************************************************
# *====================================================================================
# * インポートライブラリ
# *====================================================================================
# +-----------------------------------------------------------------------------------+
# + PySimpleGUI
# +-----------------------------------------------------------------------------------+
#(pip install pysimplegui)
import PySimpleGUI as sg

# +-----------------------------------------------------------------------------------+
# + PyAutoGUI
# +-----------------------------------------------------------------------------------+
#(pip install pyautogui)
import pyautogui as pg

# *====================================================================================
# * GUI作成
# *====================================================================================
# +-----------------------------------------------------------------------------------+
# + スタイル設定
# +-----------------------------------------------------------------------------------+
sg.theme('Dark Blue 3')

# +-----------------------------------------------------------------------------------+
# + レイアウト設定
# +-----------------------------------------------------------------------------------+
layout = [
           # 文字表示
           [ sg.Text('▼ テキスト入力ボックス',
                       font=('yu Gothic UI',10),key='text1')],

           # 入力ボックス
           [ sg.InputText("ここに入力してください。",font=('メイリオ',10),
                       size=(31,0),
                       pad=((5,0),(5,5)),
                       key='input1')],

           # ボタンレイアウト
           [ sg.Submit(button_text='OK',
                       font=('yu Gothic UI',10),size=(15,1),
                       pad=((145,0),(0,0)),
                       key='button1'),],

          [ sg.Text('▼ 入力した値を表示',
                       font=('yu Gothic UI',10),key='text2')],

           # テキストレイアウト
           [ sg.Text('ここに入力した値を表示させます。',
                       font=('yu Gothic UI',10),
                       pad=((5,0),(5,0)),
                       text_color=("#778a9f"),
                       key='text3'),]
    ]

# +-----------------------------------------------------------------------------------+
# + ウィンドウ作成
# +-----------------------------------------------------------------------------------+
window = sg.Window('テキスト入力ボックスの作り方',layout,size=(280,155))

# *====================================================================================
# * プログラム開始
# *====================================================================================
# +-----------------------------------------------------------------------------------+
# + 入力ボックス初期値
# +-----------------------------------------------------------------------------------+
input1 = ""

# +-----------------------------------------------------------------------------------+
# + GUIループ
# +-----------------------------------------------------------------------------------+
while True:
    # ウィンドウ表示
    event, values = window.read()

    if event is None:
        break

    if event == "button1":
        #ボタン(1)で実行させたい処理
        input1 = values['input1']
        window['text3'].update(input1,text_color=("#ffffff"))

Pythonをまとめて学びたい方は、まずは無料オンラインセミナーがおすすめ