【PySimpleGUIでメモアプリ開発】<>テキストボックス作成

PySimpleGUIはPythonでGUIアプリを作成できるツールです。

使ってみた印象として３点の特徴が挙げられ、プログラミング初心者の方には特におすすめしたいツールです。

ただし、現在のPySimpleGUIには致命的なデメリットがあります。

数行のシンプルなアプリであれば実害ないかもしれませんが、作りたいアプリがある際にコードを1から作成することは大変です。

また、アプリが複雑になればなるほど開発に行き詰まるとそれまでの努力が無駄になってしまうリスクを負います。

英語力がなければ課題の解決は現状難しいので、本サイトで少しでもお役に立ればと思っております。

PySimpleGUIに興味のある方はこのサイトをブックマークして更新をお待ちください。

それでは本題です。

今回は数回に分けてメモアプリを完成させるまでを解説していきます。

Step1. アプリの構成理解とテキストの表示

先に完成イメージをお見せします。

たった数行のコードでアプリが表示されます。

本記事を読み切ることで、コードの全文が理解できます。

Step.2 テキストボックスによる入力部分作成

Step.1のコードをもとに数行追加すると、このように簡単なメモアプリの入力ボックスが作成できます。

ウィンドウや各項目のサイズ調整方法についても解説します。

イメージ沸きましたでしょうか。それでは早速説明していきます。

Step1. アプリの構成理解とテキストの表示

AnacondaのインストールとJupyter notebookの準備

本記事ではJupyter notebookを使って実行しています。

同じ環境でやりたい方はこちらの記事を参考に環境を準備してください。

この記事ではJupyter notebookの起動と使い方まで紹介しています。

【2020年版、Python3をはじめよう！(Mac&Win対応)】AnacondaとJupyter notebookの始め方 はじめに Jupyter notebookとは Jupyter notebook（ジュピター・ノートブック）はブラウザ上で...

PySimpleGUIのインストール方法とインポート

たった1行で完了です。

pip install pysimplegui

sgとしてPySimpleGUIをインポートします。

import PySimpleGUI as sg

たったこれだけ準備完了です。

それでは早速Step1.のコードを書いていきます。

テーマの選定

sg.theme()でテーマを指定します。

今回は’DarkBrown2’を選択します。

sg.theme('DarkBrown2')

※2020年４月時点で140種類のデザインテーマが用意されているようです

ウィンドウに配置するコンポーネント（部品）とレイアウトを設定

layout=[]の中に部品とレイアウトに関するコードを書いていきます。

Step1.では「メモ内容」という一つのテキストを表示させてみます。

sg.Text()でテキストを表示できます。

layout =[sg.Text('メモ内容')]

ウィンドウの作成

sg.Window()に先ほどのlayoutを指定して、ウィンドウを生成します。

第1引数としてウィンドウタイトル（今回は’メモアプリ_ver1.0’）を指定できます。

window = sg.Window('メモアプリ_ver.1.0', layout)

イベントループの作成

ボタンのクリックなどのイベントはWhileループを作成し、イベントの発生を待つ構成として実行されます。

Trueとなった場合にevent, values = window.read()となり、

行うべき処理を記述しておくと実行される仕様です。

if文の中は、ウィンドウの×ボタンが押された場合(sg.WIN_CLOSED)にbreak（while文から抜ける）するようになっています。

この際、window.close()が実行されウィンドウが閉じます。

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED: 
        break
    
window.close()

ここまででStep1.は完成です。

実行してみましょう。

import PySimpleGUI as sg

sg.theme('DarkBrown2')

layout =[[sg.Text('メモ内容')]]

window = sg.Window('メモアプリ_ver.1.0', layout)

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED: 
        break
    
window.close()

メモ内容と書かれた文字が表示され×ボタンで閉じられます。

Step.2 テキストボックスによる入力部分作成

レイアウトの変更

ここからはテキストボックスを作成する方法について解説します。

sg.Text(),sg.InputText()

とsg.Textの後に続いてsg.InputTextとすることで、文字の隣に入力ボックスが作成されます。

layout =[[sg.Text('メモ内容')],
         [sg.Text('日付'), sg.InputText()]]

ウィンドウのサイズ変更

続いて、ウィンドウのサイズを変更してみましょう。

sg.Window(●●,size=(幅,高さ))とすることでウィンドウのサイズを変更できます。

window = sg.Window('メモアプリ_ver.1.1', layout, size=(300, 100))

Step2.前段階の実行結果

ここまでで実行してみます。

import PySimpleGUI as sg

sg.theme('DarkBrown2')

layout =[[sg.Text('メモ内容')],
         [sg.Text('日付'), sg.InputText()]]

window = sg.Window('メモアプリ_ver.1.1', layout, size=(300, 100))

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED: 
        break
    
window.close()

日付という入力ボックスが新しくでき、ウィンドウのサイズが幅広になりました。

Step2.完成版の解説

先ほどと同様にsg.InputTextでテキストボックスを3つ作成しますが、一点だけ工夫します。

sg.Text(‘日付’,size=(5,1))

とするとテキストボックスとの間の隙間部分を変更でき、見やすいようにレイアウトを調整できます。

layout =[[sg.Text('メモ内容')],
         [sg.Text('日付', size=(5, 1)), sg.InputText()],
         [sg.Text('分類', size=(5, 1)), sg.InputText()],
         [sg.Text('内容', size=(5, 1)), sg.InputText()]]

実行してみます。

import PySimpleGUI as sg

sg.theme('DarkBrown2')

layout =[[sg.Text('メモ内容')],
         [sg.Text('日付', size=(5, 1)), sg.InputText()],
         [sg.Text('分類', size=(5, 1)), sg.InputText()],
         [sg.Text('内容', size=(5, 1)), sg.InputText()]]

window = sg.Window('メモアプリ_ver.1.2', layout, size=(300, 100))

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED: 
        break
    
window.close()

Step.2はここまでで完了です。

【おまけ】サイズ指定について視覚的に分かるまとめ

sg.Textのサイズ指定

sg.InputTextのサイズ指定

作ったGUIアプリをexe化してみよう

exe化することで誰でもどこでも使えるアプリになります。

Python環境がないPCで使えることはメリットしかないのでぜひ一度試してみてください。

やり方はこちらの記事を参考にして下さい。

【Pythonでexeファイル作成】pyinstallerで誰でも簡単に.pyを起動 pyインストーラを使うとexeファイルが作成できるのでpython環境がないPCでもPythonファイルを実行することができます。 今...