 |
| ラーメンタイマー |
ラーメンタイマーとは、お湯を入れてラーメンが出来るまでの3分を計るものです。
動画がジャスト3分の物もそう言いますが、今回はきっちり3分計るものです。
参考にさせていただいたのは、こちらです。
PyQtではじめるGUIプログラミング
というか、ほぼおんぶに抱っこ。人の褌で相撲を取るってやつです。感謝いたします。どうもありがとう！
このままやるだけだとちょっとつまらないので、PyQtにせっかく入っている初級者用と見せかけて実は上級者用らしいQt Designerを使ってやってみたいと思います(◉◞౪◟◉｀)ﾆｺｯ
 |
| Qt Desinerを起動 |
 |
| フォーム選択ダイアログ |
 |
| メニューバーとステータスバーを削除 |
右クリックで、コンテキストメニューが出ますので、それぞれを削除です。
 |
| UIの配置 |
一番上に、LCD Numberを配置。
二番目に、Grid Layoutを配置してから
三番目に、Push Buttonを、Grid Layoutの中に4つ放り込みます。
放り込み方が難しいかもしれませんが、1つボタンを放り込んだあと、さらに新しいボタンをLayoutの右端に置くと、青い縦ラインが出るので、そのままドロップすると、横並びになります。
下のほうに入れ込むと、下部分に青い横ラインが出るので、その場所にドロップです。
 |
| 縦に整列 |
MainWindowをクリックして、選択をMainWindowにします。
ボタンなどのUIが無いところで、何も選択されていない状態で右クリックして、コンテキストメニューを開きます。
ちょっとここポイントです！
右クリック → レイアウト → 垂直に並べる
を選択します。
 |
| 整列しました |
失敗しても根性です。
ウィンドウの右下端をドラッグしても、レイアウトがキープされているのが分かります。
 |
| ボタン名とオブジェクト名を変更 |
右側のオブジェクトインスペクタにあるpushButtonを選ぶと、対応して選択されるので、見ながら変更していってください。
オブジェクト名は、後々スクリプト編集するときに使うので、覚えておいてください。
 |
| シグナル/スロットの設定 |
右図の手順で、STARTボタンにシグナル/スロットの設定をします。
 |
| シグナル/スロットの設定その2 |
ダブルクリックで、プルダウンが出るので、選んでください。
全てのボタンに対して行ってください。
ここまでくれば、UIは完成。
ramen_timer.ui
で保存します。
ここまでは、簡単に誰でも作れますね(☉౪ ⊙)ﾌﾟｷﾞｬｰ!!!!
後は、タイマーの設定、ボタンを押したときの挙動をスクリプト編集で、実装していきます。
（Qt Designerって、スロットのコード編集って出来ないですよね？知ってる方いらっしゃいましたら教えてください。）
 |
| Shift+右クリックからコマンドウィンドウを起動 |
これをpyファイルに変換します。
先ほど作成したuiファイルのフォルダで、Shift+右クリックからコマンドウィンドウを起動します。
コマンドプロンプトで、次のコマンドを実行して、uiからpyに変換します。
pyuic4 -i 0 -x ramen_timer.ui -o ramen_timer.py
オプションの -i は、インデントのスペースの数を表しています。0にするとインデントがタブになるので、これが嫌な方は、無くてもOKです。
SoftimageのScript Editorは、インデントがタブになってしまうので、そっちで編集する方はつけたほうがいいでしょう。
出来上がったコードは、こんな感じ。
次に、__init__メソッドを追加します。
Ui_MainWindowクラスに、countというアトリビュートを加えます。
このcountの値を減らしてカウントダウンさせます。
そのあと、QTimerオブジェクトを入れ込みます。
setupUiの一番上に追加します。
後述しますが、時間が来たらLCDNumberの値を減らすメソッドを実行させるためです。
今回は、180.00で表示させようと思うので、10msで0.0１カウント減らします。
ですので、setIntervalに10を入れ、インターバルが経過したら、カウントを0.01減らすといった内容です。
次に、LCDNumberの値を初期値180.00を表示されるメソッドを書き込みます。
このメソッドは、後述します。
書く場所は、setupUiメソッドの一番下です。
準備が出来たので、シグナル/スロットのメソッドを書き加えます。
全部で5つあります。
update_display
LCDNumberにカウント表示させます。
countの値に100を割って、その値をアップデートです。
do_countdown
countの値を1減らして、update_displayします。
countの値が0以下なったら、stop_countdownを呼びます。
start_countdown
countが0より大きかったら、QTimerをスタートさせます。
stop_countdown
QTimerをストップします。
これによって、カウントが減らなくなります。
reset_countdown
QTimerをストップすると共に、countの値を18000にします。
あとで、100割るためです。
その後、update_displayで、表示を元に戻します。
ここまで来ればほぼ完璧です。pyファイルを単体でつつけば、ラーメンタイマーの完成！
しかし、Softimageで動かすことを考えると、もう少し編集が必要です。
まず、1行目の
# -*- coding: utf-8 -*-
を削除します。
その後、一番下のほうにある
if __name__ == "__main__":
を削除して、そこから下のインデントを揃えます。
最後に一番下の
sys.exit(app.exec_())
を
app.exec_()
に変更です！
これで、全ての機能が入りました！！！！
編集したコードは、こんな感じです。
おめでとうございます！
これで、PyQtラーメンタイマーチュートリアルは終了となります。
長々とありがとうございました。
このコードをScript Editorや、Script Libraryから実行して、完璧にうまいラーメン作ってみてくださいね～（´☣౪☣)ﾊﾌｰ
コマンドプロンプトで、次のコマンドを実行して、uiからpyに変換します。
pyuic4 -i 0 -x ramen_timer.ui -o ramen_timer.py
オプションの -i は、インデントのスペースの数を表しています。0にするとインデントがタブになるので、これが嫌な方は、無くてもOKです。
SoftimageのScript Editorは、インデントがタブになってしまうので、そっちで編集する方はつけたほうがいいでしょう。
出来上がったコードは、こんな感じ。
次に、__init__メソッドを追加します。
Ui_MainWindowクラスに、countというアトリビュートを加えます。
このcountの値を減らしてカウントダウンさせます。
そのあと、QTimerオブジェクトを入れ込みます。
setupUiの一番上に追加します。
後述しますが、時間が来たらLCDNumberの値を減らすメソッドを実行させるためです。
今回は、180.00で表示させようと思うので、10msで0.0１カウント減らします。
ですので、setIntervalに10を入れ、インターバルが経過したら、カウントを0.01減らすといった内容です。
次に、LCDNumberの値を初期値180.00を表示されるメソッドを書き込みます。
このメソッドは、後述します。
書く場所は、setupUiメソッドの一番下です。
準備が出来たので、シグナル/スロットのメソッドを書き加えます。
全部で5つあります。
update_display
LCDNumberにカウント表示させます。
countの値に100を割って、その値をアップデートです。
do_countdown
countの値を1減らして、update_displayします。
countの値が0以下なったら、stop_countdownを呼びます。
start_countdown
countが0より大きかったら、QTimerをスタートさせます。
stop_countdown
QTimerをストップします。
これによって、カウントが減らなくなります。
reset_countdown
QTimerをストップすると共に、countの値を18000にします。
あとで、100割るためです。
その後、update_displayで、表示を元に戻します。
ここまで来ればほぼ完璧です。pyファイルを単体でつつけば、ラーメンタイマーの完成！
しかし、Softimageで動かすことを考えると、もう少し編集が必要です。
まず、1行目の
# -*- coding: utf-8 -*-
を削除します。
その後、一番下のほうにある
if __name__ == "__main__":
を削除して、そこから下のインデントを揃えます。
最後に一番下の
sys.exit(app.exec_())
を
app.exec_()
に変更です！
これで、全ての機能が入りました！！！！
編集したコードは、こんな感じです。
おめでとうございます！
これで、PyQtラーメンタイマーチュートリアルは終了となります。
長々とありがとうございました。
このコードをScript Editorや、Script Libraryから実行して、完璧にうまいラーメン作ってみてくださいね～（´☣౪☣)ﾊﾌｰ
コメント