Python tkinter GUIエディタ PAGEの使い方[初めてのpythonGUI作成ツール]

Python
この記事は約6分で読めます。

今回は以前に紹介したPythonのGUIエディタPAGEの簡単な使い方を紹介します。
※前回からだいぶ期間が空いてしまっています。すいません。。
PAGEのインストールなどがまだの方は以下を参考にしてみてください

今回は、以下の記事で作成したGUIアプリをPAGEを使用して作成してみます。

PAGEの起動

では本題のPAGEを起動していきましょう。

前回の記事に従ってインストールしてみらえれば以下のフォルダにインストールされているはずです。

C:\page

そのフォルダの中のpage.batをダブルクリックして実行してみてください。

※起動できない場合は、 page.bat をテキストエディタで開いて、python3という部分をpythonに書き換えてみてください。

すると以下のように5つのフォームが表示されます。

それぞれ以下の画面となります。

①Widet Toolbar ・・・ 配置できるWidget一覧
②Widget Tree ・・・ 配置した Widgetのツリー
③PAGE ・・・ メイン画面
④New TopLebel ・・・ 作成する画面
⑤Attribute Editor ・・・ Widgetのプロパティ一覧

上記の③に設置したいウィジェットを選んで配置してくことになります。
具体的には以下の通りです。

画面の生成(ウィジェットの配置)

ウィンドウサイズ調整

まず初めに、 ウィンドウサイズ の調整をします。
この調整することで、起動時に表示されるツールの ウィンドウサイズ が調整できます。
実際のやり方は、Windowsツール等の画面のサイズ調整と同様のやり方で、 ④New TopLebel 画面の右下の端をマウスでつまんで、内側に引き寄せます。

今回は小さくしましたが、逆に画面を大きくしたい場合は、端っこをつまんで外に広げてください。
これで画面のサイズ調整は終わりです。

ラベルの配置と各種設定

続いて、ラベルを設置します。

ラベルの配置

① Widet Toolbar 内のLabelをクリックしてください。

続いて、 他に触れずに、④New TopLebel の配置したい場所で再度クリックします。
すると以下のように■で囲まれたLabelというのが表示されます。

ここで、四隅の■をクリックし引き延ばすと表示領域を変えることができます。

文字サイズ調整

続いて、文字が少し小さいので文字サイズの調整します。
上の■で囲われている状態で、 ⑤Attribute Editor の画面内のfontの項目の右横のボタンをクリックします。

すると以下の画面が表示されますので、その中のSizeというところ好みのFontサイズで指定して、OKをクリックしてください。

すると以下のようにフォントサイズが大きくなります。

文字内容変更

では、続いて、文字の内容を変更します。

■で囲われている状態で右クリックを押下して、Widgetの部分にマウスカーソルを合わせます。
すると以下のように、Set Textというのが表示されますのそちらをクリックします。

すると以下の画面が表示されますので、表示したい内容を入力して、チェックボタンをクリックします。

今回は、数字をインクリメントしていきたいので、”0”を入力しました。
結果は↓のようになります。

ボタンの配置と各種設定

では続いて、ボタンの配置です。

ボタンの配置

ラベルのときと同様に、 ① Widet Toolbar 内のButtonをクリックしてください。

こちらもラベルの時と同様に ④New TopLebel の配置したい場所でクリックし、配置します。

上記のようになります。続いて、先ほどのサイズ調整と同様に右下の■をマウスで広げます。

ボタン内テキストの変更

こちらも先ほどのラベルと同様に、■で囲われている状態で、右クリックし、Widgetにマウスカーソルを合わせて表示されたSetTextを選択します。

テキストの内容変更も、先ほどのラベルのテキスト変更と同様です。

入力し完了すると以下の通りになります。

ボタンのコールバック関数設定

ボタンがクリックされた際のコールバック関数を設定します。
こちらもボタンが■で囲われている状態で右クリックし、Widgetにマウスカーソルを合わせて、今度は、Set Commandを選択します。

テキスト内容変更と同じような画面が出てきますので、テキストを入力したところに生成したいコールバック関数名を入力し、完了します。

これで、画面の配置作業は終了です。

GUIコードの生成

続いて、コードの生成をしていきます。

GUIコードの生成

③PAGE画面のGen_Pythonをクリックして表示されたGenerate Python GUIをクリックします。

これをクリックするとまず、PAGEのプロジェクトファイル(tclファイル)の保存先を選択させられますので、任意の場所に保存してください。

今回はデスクトップにtestというフォルダを生成し、test.tclという名前でファイルを保存します。

すると、以下の画面が表示されます。

これは生成する予定のコードが表示されています。

今回は特に変更することはないので、そのままSaveをクリックして保存します。

すると、プロジェクト名で設定した名前と同じ名前のpythonファイルが生成されます。

サポートコードの生成

上記で、GUIのメインコードの生成ができました。
ですが、このままでは使用できません。
PAGEでは、次にサポートモジュールというもの生成する必要があります。
このサポートモジュールがユーザが手を加えるコードになりますので、生成は必須となります。

先ほどのGUIの生成と同じような手順で生成していきます。

③PAGE画面のGen_Pythonをクリックして表示されたGenerate Support Moduleをクリックします。

すると先ほどと同じような画面が表示され、こちらも生成予定のコードが表示されます。
今回も編集の必要はありませんのでそのままSaveをクリックします。

すると、support用のパイソンファイルが生成されます。

プロジェクト名+”_support”というパイソンファイルが生成されます。

これで一連の生成作業は終了です。

ここからはプログラミングになりますが、プログラミングについては次ページにて記載します。

コメント

タイトルとURLをコピーしました