PyQtをAnaconda3同梱のQtDesignerで作ってみる
2017/12/30
前回、PyQtでGUIプログラミングを紹介しましたが、AnacondaにはQtDesignerというデザイナーが同梱されています。但し、スタートメニューには現れず、以下のフォルダ内に実行ファイルがあるので、そこまで行かなければなりません。
C:...\Anaconda3\Library\bin\designer.exe
かなり使いやすいです。デザインしたフォームを実行するところまで紹介したいと思います。
[ad#top-1]
QtDesignerでフォームをデザイン
QtDesignerを起動すると以下の画面が現れます。左がコントロールのリスト、中央がデザイナーです。
新規作成ボタンを押すと以下の画面が現れます。いろいろなフォームが用意されていますが、今回はWedgetを選びました。
デザイナーにフォームが現れます。左のコントロールリストからドラッグ・アンド・ドロップでコントロールを配置します。とりあえず、LabelとPushButtonを配置しました。
任意の場所に保存します。拡張子は.uiです。
Pythonから呼び出して実行する
なんと、QtDesignerで作ったフォーム(.uiファイル)では実行できません。.uiファイルを.pyファイルに変換させる必要があります。
変換プログラムはAnacondaに同梱されています。
コマンドプロンプト上で以下のコマンドを打つと、.uiファイルが.pyファイルに変換されます。以下の例ではsample.pyというファイル名で変換されます。
C:\...\Anaconda3\Library\bin\pyuic5 -o sample.py test.ui
以下のコードで呼び出して実行します。
import sys from PyQt5 import QtWidgets from sample import Ui_Form class Test(QtWidgets.QDialog): def __init__(self,parent=None): super(Test, self).__init__(parent) self.ui = Ui_Form() self.ui.setupUi(self) if __name__ == '__main__': app = QtWidgets.QApplication(sys.argv) window = Test() window.show() sys.exit(app.exec_())
実行すると以下の通りQtDesingerで作ったフォームが現れます。
イベント処理
ボタンを押すとラベルの文字が変わるようなイベント処理を作ってみたいと思います。
QtDesignerで「編集」−「シグナル/スロットを編集」を選択します。
ボタンをマウスでドラッグしながらボタンエリア外に移動してマウスを離します。以下のような赤いマークが付きます。
以下の画面が現れます。左のリストから「clicked()」を選択し、右側の「編集」ボタンを押します。
以下の画面が現れるので、左中央付近の「+」ボタンを押します。
すると、上のリストの「slot1()」という文字が現れます。これがボタンクリック時に呼び出される関数名となります。関数名は変えられますが今回はそのまま使います。「OK」ボタンを押して閉じましょう。
先ほどの画面に戻りますが、右のリストに先ほどの「slot1()」が現れます。「OK」を押して閉じます。QtDesigner側の設定はこれで終わりです。先ほど説明したとおりコマンドプロンプトで.pyファイルに変換しましょう。
以下のコードで呼び出して実行します。先ほどのソースコードとほとんど一緒ですが、def slot1(self);
以下の2行が追加されています。先ほど設定したslot1()関数の部分です。ボタンを押すとラベルに「Hello World!」と表示するようにします。
import sys from PyQt5 import QtWidgets from sample import Ui_Form class Test(QtWidgets.QDialog): def __init__(self,parent=None): super(Test, self).__init__(parent) self.ui = Ui_Form() self.ui.setupUi(self) def slot1(self): #イベント処理の関数 self.ui.label.setText('Hello World!') if __name__ == '__main__': app = QtWidgets.QApplication(sys.argv) window = Test() window.show() sys.exit(app.exec_())
これを実行すると以下の通り、ボタン押下でラベルのテキストが変わります。
[ad#ad-1]
スポンサーリンク