GUI ビルダーによるユーザーインターフェイス作成 (2/6)

では、実際に簡単なGUIを作って利用してみることにしましょう。GUI ビルダーを起動し、まずは＜名前を変更...＞メニューで、「MyGui」という名前で保存をしておいてください。それから、左側のリストから以下の２つの部品を探して配置してください。

Label
Labelは、テキストを表示するための部品です。配置後、右側のプロパティの設定から「テキスト」内にある「テキスト」を選択し、表示するテキストを設定しておきましょう。

Button
いわゆるプッシュボタンの部品です。これも配置後、プロパティの「テキスト」内の「テキスト」から、ボタンに表示するテキストを修正しておきましょう。

作成したら、次にスクリプトを用意しておくことにします。スクリプトエディタに、以下のような関数（の入れ物部分）を用意しておいてください。

function onClickButton(e){

}

中身は、まだ書きません。とりえあず関数の入れ物だけ用意して保存しておきましょう。――続いて、Gui ビルダーに再び戻ります。そして、配置したButtonを選択してください。

右側のプロパティの一覧を見ていくと、下の方に「イベント」というのがあります。この中の「マウスのクリック」という項目にあるポップアップメニューの右側の▼をクリックすると、スクリプトエディタに用意してある関数のリストがポップアップして現れます。ここから「onClickButton」を選びます。

これで、このボタンをクリックすると、onClickButton関数が呼び出されるようになります。Gui ビルダーの部品類は、このようにしてGUIのイベントと、スクリプトエディタに用意した関数を結びつけ、必要に応じてイベントから関数を呼び出して動きます。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。