MENU

Python-seleniumではてなブログ自動投稿プログラムを作ってみる②~GUI編~

こんにちは、のちたままです。

今回は、以前記事にしたはてなブログ自動投稿プログラムの続きになります。

まだ前回の記事を読んでいない場合は、先にそちらをお読みください。

nochitamama.hatenablog.com

※今回は画面だけの作成なので、実行ボタンを押しても実際に動作するわけではありません。 スクリプトGUIの接続はまた別記事で書く予定です。

今回の目次はこちら

GUIの外観

今回作成したGUIの外観はこのようになっています。

今後作るうちに変わっていくかもしれませんが、その場合は更新していこうと思います。

また、今回はPySimpleGUIを使用して作成しています。

複雑な動作をするGUIでなければtkinterよりもコードが書きやすいのでこちらを使用しました。

PySimpleGUIの基本とインストール方法については以下の2つの記事をご覧ください。

qiita.com

nochitamama.hatenablog.com

GUIに必要な機能

GUIには以下の5つの機能をつけることにしました。

・ID,Passwordの入力
・ファイルの指定
・公開設定(公開、予約投稿、下書き保存)
・公開、予約投稿時の日時指定
・実行ボタン

コードについて

以下がGUI全体のコードになります。

最初に話したようにこれだけではポップアップが出るだけで何も動作しないのでご注意ください。

import PySimpleGUI as sg

sg.theme('Dark Blue 3')

layout=[
    [sg.Text('ID',size=(15,1)),sg.InputText(''),sg.Checkbox('保存',default=True)],
    [sg.Text('Password',size=(15,1)),sg.InputText('')],
    [sg.Text('ファイル',size=(15,1)),sg.InputText(''),sg.FileBrowse()],
    [sg.Text('公開設定',size=(15,1)),sg.Radio('公開','RADIO1',default=True),sg.Radio('予約投稿','RADIO1'),sg.Radio('下書き保存','RADIO1')],
    [sg.Text('日付',size=(15,1)),sg.InputText('',size=(5,1)),sg.Text('年'),sg.InputText('',size=(5,1)),sg.Text('月'),sg.InputText('',size=(5,1)),sg.Text('日'),sg.Checkbox('日付を保存する',default=True)],
    [sg.Text('時刻',size=(15,1)),sg.InputText('',size=(5,1)),sg.Text('時'),sg.InputText('',size=(5,1)),sg.Text('分'),sg.Text('',size=(8,1)),sg.Checkbox('時刻を保存する',default=True)],
    [sg.Submit(button_text='実行する')]
]

window=sg.Window('hatena',layout)

while True:
    event, value=window.read()
    if event=='実行する':
        show_message='しばらくお待ちください。\n'
        sg.popup(show_message)
        
    if event is None:
        print('exit')
        break

window.close()

PySimpleGUIについて少し補足をしておきます。

PySimpleGUIではlayoutの中にボタンやTextなどを置いていきます。

layout=[
    [sg.Text('ID',size=(15,1)),sg.InputText(''),sg.Checkbox('保存',default=True)],
    [sg.Text('Password',size=(15,1)),sg.InputText('')],
    [sg.Text('ファイル',size=(15,1)),sg.InputText(''),sg.FileBrowse()],
    [sg.Text('公開設定',size=(15,1)),sg.Radio('公開','RADIO1',default=True),sg.Radio('予約投稿','RADIO1'),sg.Radio('下書き保存','RADIO1')],
    [sg.Text('日付',size=(15,1)),sg.InputText('',size=(5,1)),sg.Text('年'),sg.InputText('',size=(5,1)),sg.Text('月'),sg.InputText('',size=(5,1)),sg.Text('日'),sg.Checkbox('日付を保存する',default=True)],
    [sg.Text('時刻',size=(15,1)),sg.InputText('',size=(5,1)),sg.Text('時'),sg.InputText('',size=(5,1)),sg.Text('分'),sg.Text('',size=(8,1)),sg.Checkbox('時刻を保存する',default=True)],
    [sg.Submit(button_text='実行する')]
]

内側の鍵カッコ[]で囲われた部分は同じ行に表示するアイテムです。

例えば一つ目の[sg.Text('ID',size=(15,1)),sg.InputText(''),sg.Checkbox('保存',default=True)]は、以下のアイテムを同じ行に設置します。

・「ID」という文字(宇余白を含め15文字分を1行生成)
・入力テキスト(InputTextのところ)
・「保存」と文字が横に書かれたチェックボックス

ちょうど図の赤枠で囲んだ部分になります。

このように行単位で生成していくので、簡単なGUIであればコードを見やすく書くことができます。

最後に

今回はプログラムを使う際のGUIについて作ってみました。

基本的なもので作れるもんだなあという感想です。

これからどんどん使いやすいように進化させていくので、この記事で書いたものと最終的なものは大きく変わってしまうかもしれません。

それではまた次回。


PySimpleGUIの公式ドキュメントは以下のURLからご覧ください。

pysimplegui.readthedocs.io