ユーザーがコンポーネントをマウスでクリックするか、フォーカスを移動するなどの動作をするか、コンポーネントの状態が変更される際にイベントが発生します。イベント関数を指定しておけば、該当するイベントの発生時に目的の動作を処理することができます。
プロパティウィンドウでButtonコンポーネントのonclickイベント関数を生成
1
デザイン画面にButtonコンポーネントを配置します。配置されたButtonコンポーネントを選択して、プロパティウィンドウでイベントアイコンを選択します。プロパティウィンドウにコンポーネントのイベントリストが表示されます。
2
onclickイベント項目の右側に関数名を入力します。関数名を入力せずに空欄をダブルクリックすると、「コンポーネントid+_+イベント名」で関数名を自動的に生成します。
3
デザイン画面からスクリプト画面に移動すると、生成されたイベント関数を確認することができます。下記のようなコードが生成されます。
this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo) { };
4
イベント関数内の警告ダイアログボックスを表示するalertメソッドを追加します。Buttonコンポーネントをクリックするイベントが発生する際にButton00_onclickイベント関数が呼び出され、イベント関数内にalertメソッドが実行されます。
this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo) { this.alert("TEST"); };
5
変更された内容を保存して、ツールバーの「QuickView」項目を選択します。nexacroブラウザが実行されて、画面にButtonコンポーネントが表示されます。Buttonコンポーネントをクリックすると、警告ダイアログボックスが表示されます。
Editコンポーネントに入力されたテキストを確認
1
デザイン画面にEditコンポーネントを配置します。配置されたEditコンポーネントを選択して、プロパティウィンドウでイベントアイコンを選択します。イベント項目のonchangedイベントを選択して、イベント関数を生成します。
2
デザイン画面からスクリプト画面に移動すると、生成されたイベント関数を確認することができます。イベント関数のコード内に下記のようなコードを追加します。Editコンポーネントに値を入力してEnterキーを入力するか、他のコンポーネントにフォーカスを移動すると、入力されたテキストがOutputウィンドウに表示されます。
this.Edit00_onchanged = function(obj:nexacro.Edit,e:nexacro.ChangeEventInfo) { trace(e.posttext); };
イベント関数の実行時に2つのパラメータを渡します。最初のパラメータはイベントが発生したコンポーネントであり、第二パラメータはイベントに関連する情報を含んでいるEventInfoオブジェクトです。EventInfoオブジェクトのどのような情報が含まれているかは、ヘルプで確認することができます。ヘルプでonchangedイベント項目を検索していけば、ChangeEventInfoオブジェクトへのリンクを確認することができます。
ChangeEventInfoオブジェクトで使用できるプロパティ情報を確認することができます。
3
変更された内容を保存して、ツールバーから「QuickView」項目を選択します。nexacroブラウザが実行されて、画面にEditコンポーネントが表示されます。Editコンポーネントにテキストを入力し、Enterキーを入力します。nexacro studioのOutputウィンドウに入力されたテキストを確認することができます。
1つのイベント関数を複数のコンポーネントで使用
1
デザイン画面にButtonコンポーネントを2つ配置します。配置されたButtonコンポーネントのいずれかを選択して、プロパティウィンドウからイベントアイコンを選択します。イベント項目のonclickイベントを選択して、イベント関数を生成します。イベント関数名は自動的に生成せず、「Button_onclick」に指定します。
2
デザイン画面で、スクリプト画面に移動すると、生成されたイベント関数を確認することができます。イベント関数を下記のように作成します。
this.Button_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo) { this.alert(e.fromobject.id); };
Buttonコンポーネントをクリックすると、警告ダイアログボックスに該当コンポーネントのid値が表示されます。
3
以前に選択しなかったButtonコンポーネントを選択して、プロパティウィンドウのイベントの項目の中でonclickイベントを選択して、イベント関数を生成します。イベント関数名は自動的に生成せず、前の手順で作成した「Button_onclick」に指定します。
4
変更された内容を保存し、ツールバーの[QuickView]項目を選択します。nexacroブラウザが実行されて、画面に2つのButtonコンポーネントが表示されます。Buttonコンポーネントをクリックすると、警告ダイアログボックスに各Buttonコンポーネントのid値が表示されます。
サンプルにては、Buttonコンポーネントをクリックしてid値を表示する簡単な例を示しましたが、実際のコードではユーザーがクリックしたButtonコンポーネントのid値を確認して、他のタスクを実行するようにすることができます。