「Krita」と「Python」でUIパーツを構築してみよう
clicked以外でも処理する
UIパーツを構築する
ここまでは、ボタンなどがクリックされたときに、主に「clicked」フックで処理するサンプルを解説しました。「フック」とはプログラムの実行プロセスに割り込み、元の動作を捕えたり監視したり改変したりする技術のことです。以降では「textChanged」「currentIndexChanged」「valueChanged」「stateChanged」フックで変化があったときに処理するサンプルを解説します。
ここでも、レイアウトにUIパーツを追加してダイアログにレイアウトをセットするだけです。もちろん前回の他のダイアログUIにもUIパーツを貼れるのですが、それはクラスの「継承」を理解しないと今までのやり方ではできないので、今回は解説しません。
テキストエディットを構築
「テキストエディット(QTextEdit)」は複数行の文字を入力できるエリアのことです(図6)。Kritaは絵を描くツールですが、UIを使って文字を入力することもあるでしょう。
・サンプルスクリプト「dlg_textedit.py」# モジュール from PyQt5.QtWidgets import QDialog, QVBoxLayout, QTextEdit # テキストエディットが変更されたら呼ばれる def change_text(): print(text.toPlainText()) # テキストエディットUIの作成 layout = QVBoxLayout() text = QTextEdit() layout.addWidget(text) # テキストエディットが変更されたら「change_text」関数を呼び出す text.textChanged.connect(change_text) # ダイアログの作成と実行 dlg = QDialog() dlg.setLayout(layout) dlg.exec_()
【サンプルスクリプトの解説】
「PyQt5」内のモジュールを読み込みます。
「change_text」関数でテキストエディットに書かれた文字列をコンソールに表示します。
「QTextEdit」クラスでテキストエディットUIを作成してレイアウトに追加し、ダイアログにセットします。
テキストが変更されたら(textChanged)、「change_text」関数を呼び出します。
コンボックスを構築
「コンボボックス(QComboBox)」は、機能的にはラジオボタンに似ており複数の選択肢の中から1つだけを選ぶことができますが、ラジオボタンと違って選択肢は最初1つしか見えておらず、コンボボックスをクリックしたら選択肢が現れます(図7)。つまりダイアログにおいて省スペースで選択肢を選べます。
・サンプルスクリプト「dlg_combobox.py」# モジュール from PyQt5.QtWidgets import QDialog, QHBoxLayout, QComboBox # タプル vehicle_tuple = ("自動車","飛行機","電車") # コンボボックスが変更されたら呼ばれる def change_combo(index): print(vehicle_tuple[index]) # コンボボックスUIの作成 layout = QHBoxLayout() combo = QComboBox() for t in vehicle_tuple: combo.addItem(t) layout.addWidget(combo) # コンボボックスが変更されたら「change_combo」関数を呼び出す combo.currentIndexChanged.connect(change_combo) # ダイアログの作成と実行 dlg = QDialog() dlg.setLayout(layout) dlg.exec_()
【サンプルスクリプトの解説】
「PyQt5」内のモジュールを読み込みます。
「change_combo」関数でコンボボックスで選択した文字列をコンソールに表示します。
「QComboBox」クラスでコンボボックスUIを作成して「addItem」メソッドで項目を追加します。
コンボボックスをレイアウトに追加し、ダイアログにセットします。
コンボボックスが変更されたら(currentIndexChanged)、「change_combo」関数を呼び出します。
スピンボックスを構築
「スピンボックス(QSpinBox)」は▲と▼をクリックすることで数値を増やしたり減らしたりできるUIパーツです(図8)。直接数値を文字で入力しなくてもマウス操作だけで数値を選べます。
・サンプルスクリプト「dlg_spinbox.py」# モジュール from PyQt5.QtWidgets import QDialog, QHBoxLayout, QSpinBox # スピンボックスが押されたら呼ばれる def change_spin(): print(str(spin.value())) # スピンボックスUIの作成 spin = QSpinBox() spin.setMinimum(0) spin.setMaximum(1000) spin.setSingleStep(50) layout = QHBoxLayout() layout.addWidget(spin) # スピンボックスが押されたら「spin_change」関数が呼ばれる spin.valueChanged.connect(change_spin) # ダイアログの作成と実行 dlg = QDialog() dlg.setLayout(layout) dlg.exec_()
【サンプルスクリプトの解説】
「PyQt5」内のモジュールを読み込みます。
「change_spin」関数でスピンボックスの現在の数値をコンソールに表示します。
「QSpinBox」クラスでスピンボックスUIを作成し、数値の最小と最大とステップ数をセットします。
スピンボックスをレイアウトに追加し、ダイアログにセットします。
数値が変更されたら(valueChanged)、「change_spin」関数を呼び出します。
ラインエディットとスライダーを構築
「ラインエディット(QLineEdit)」は1行だけ入力できる「テキストエディット」のようなUIパーツです。「スライダー(QSlider)」は、よく音量スライダーがあるように滑らせて数値を変更します(図9)。
ここではスライダーとラインエディットを連携して、スライダーを動かしたらラインエディットにスライダーの値を表示します。
・サンプルスクリプト「dlg_slider.py」# モジュール from PyQt5.QtCore import Qt from PyQt5.QtWidgets import QDialog,QGridLayout,QLineEdit,QSlider # スライダーが動いたら呼ばれる def change_slider(value): edit.setText(str(value)) # レイアウト layout = QGridLayout() # エディットボックスUI edit = QLineEdit() layout.addWidget(edit) # スライダーUIを構築 slider = QSlider(Qt.Horizontal) layout.addWidget(slider) # スライダーが動いたら「change_slider」関数を呼び出す slider.valueChanged.connect(change_slider) # ダイアログの作成と実行 dlg = QDialog() dlg.setLayout(layout) dlg.exec_()
【サンプルスクリプトの解説】
「PyQt5」内のモジュールを読み込みます。
「change_slider」関数でスライダーの数値をラインエディットに表示します。
「QLineEdit」クラスでラインエディットUIを作成して「QSlider」クラスでスライダーUIを作成し、レイアウトに追加してダイアログにセットします。
スライダーが変更されたら(valueChanged)、「change_slider」関数を呼び出します。
チェックボックスを構築
「チェックボックス(QCheckBox)」は項目をチェックしたりチェックを外したりするUIパーツで、それぞれTrueとFalseになります。ラジオボタンやコンボボックスと違って複数の項目を同時に選べます(図10)。
・サンプルスクリプト「dlg_checkbox.py」# モジュール from PyQt5 import QtCore from PyQt5.QtWidgets import QDialog,QVBoxLayout,QCheckBox # チェックボックスが押されたら呼ばれる def change_state(value): print("チェックボックス1:",checkbox1.checkState() == QtCore.Qt.Checked) print("チェックボックス2:",checkbox2.checkState() == QtCore.Qt.Checked) print("チェックボックス3:",checkbox3.checkState() == QtCore.Qt.Checked) # チェックボックスUIの作成 layout = QVBoxLayout() checkbox1 = QCheckBox("チェックボックス1") layout.addWidget(checkbox1) checkbox2 = QCheckBox("チェックボックス2") layout.addWidget(checkbox2) checkbox3 = QCheckBox("チェックボックス3") layout.addWidget(checkbox3) # チェックボックスが押されたら「change_state」関数を呼び出す checkbox1.stateChanged.connect(change_state) checkbox2.stateChanged.connect(change_state) checkbox3.stateChanged.connect(change_state) # ダイアログの作成と実行 dlg = QDialog() dlg.setLayout(layout) dlg.exec_()
【サンプルスクリプトの解説】
「PyQt5」内のモジュールを読み込みます。
「change_state」関数でチェックボックス1、2、3がチェックされているかをコンソールに表示します。
「QCheckBox」クラスでチェックボックスUIを3つ作成してレイアウトに追加し、ダイアログにセットします。
チェックボックスが変更されたら(stateChanged)、「change_state」関数を呼び出します。
おわりに
今回は、各サンプルで数個だけUIパーツを貼り付けましたが、ダイアログには何個でも色々な種類のUIパーツを貼り付けることができます。例えば、画像を移動する位置(X,Y)を数値で指定してボタンを押せば確定、するなどです。ぜひ、皆さんもオリジナルのダイアログを作ってみてください。