Panda Noir

JavaScript の限界を究めるブログです。

PyQt5を使って手探りでツイッタークライアントを作る vol.1

PyQtの資料がただでさえ少なく、ましてやPyQt5の資料なんて雀の涙なのでこれは書くしかないな、と。

インストールまわり

PyQt5とtweepyを使用します。インストールはがんばってください。正直やり方忘れました。

Windowを表示

まずwindowを出しましょう。以下のコードをコピペして適当な名前で保存後、コマンドプロンプトpython (保存した名前).py で実行します。するとウィンドウが出ます!

import sys
from PyQt5 import QtCore
from PyQt5.QtWidgets import *

if __name__ == '__main__':
    app = QApplication(sys.argv)

    window = QWidget()

    window.show()
    sys.exit(app.exec_())

f:id:panda_noir:20160604233059p:plain

できましたか?

ツイートボタンを作る

ボタンはQPushButtonというクラスで作ります。

    window = QWidget()
    button = QPushButton(window)
    button.setText('tweet')

    window.show()

QPushButton(somewindow)という形で、コンストラクタの引数に渡されたウィンドウにボタンを設置できます。

ただし、これはかなり原始的なやり方なので後々この方法をやめます。

f:id:panda_noir:20160605082416p:plain

テキストボックスを作る

ボタン、テキストボックスが揃えば、とりあえずツイートする画面は完成します。

    window = QWidget()
    textbox = QPlainTextEdit(window)
    button = QPushButton(window)
    button.setText('tweet')

ただ、実行するとわかりますが、これではテキストボックスが後ろへと行ってしまい、ボタンと重なってしまます。これを解決するにはLayoutを使います。

f:id:panda_noir:20160605083008p:plain

Layoutで整える

これまではコンストラクタに直接設置先のウィンドウを渡していました。しかし、Layoutを使えばこの原始的な方法を回避できます。

    window = QWidget()

    textbox = QPlainTextEdit()
    button = QPushButton()
    button.setText('tweet')

    layout = QVBoxLayout()
    layout.addWidget(textbox)
    layout.addWidget(button)

    window.setLayout(layout)

f:id:panda_noir:20160605083351p:plain

今までのコードをまとめるとこんな感じ

import sys
from PyQt5 import QtCore
from PyQt5.QtWidgets import *

if __name__ == '__main__':
    app = QApplication(sys.argv)

    window = QWidget()

    textbox = QPlainTextEdit()
    button = QPushButton()
    button.setText('tweet')

    layout = QVBoxLayout()
    layout.addWidget(textbox)
    layout.addWidget(button)

    window.setLayout(layout)
    
    window.show()
    sys.exit(app.exec_())

次回予告

とりあえず今回はGUI部分を作ってみました。結構それらしくなりましたよね?実際にツイートするロジック部分は次の次の回で作ります。

次回はコードのリファクタリングをします。