3. ActionScriptのシンタックス／3.2 スクリプトの種類とイベント処理
3.2 スクリプトの種類とイベント処理
スクリプトの種類
ActionScriptは大きく分けて、1.フレームアクション、2.オブジェクトアクション、3.ActionScriptファイル（ASファイル）の3種類があります。オブジェクトアクションはムービークリップのインスタンスとボタンのインスタンスに設定でき、それぞれムービークリップアクション、ボタンアクションと区別して呼ぶこともあります。
図3-2-1 スクリプトを書き込むことができる場所。
図3-2-2 フレームアクション、ムービークリップアクション、ボタンアクション
フレームアクション
フレームアクションはムービークリップのインスタンスを配置する場合と同じように、キーフレームに設定します。レイヤーはどのレイヤーを使っても構いません。すでにムービークリップなどが入っているレイヤーにフレームアクションを設定することもできますが、フレームアクション専用のレイヤーを追加して使うのがわかりやすく一般的な方法です。フレームアクションが設定されているキーフレームにはaの文字が表示されます。
フレームアクションには、単独のステートメント、イベントハンドラ、ActionScript1.0のクラス定義、メソッド定義、関数定義のスクリプトを書くことができます。後述するようにムービークリップやボタンの個々のインスタンスにオブジェクトアクションを設定することができますが、それらの設定はタイムラインのフレームアクションで使ってまとめて使って書くほう書式が統一されて間違いもなく合理的です。
note:
ActionScript2.0のクラス定義はActionScriptファイルに書きます。
図3-2-3 フレームアクションに設定できる要素。
■フレームアクションが実行されるタイミング
フレームアクションは、キーフレームが再生されたときに1度だけ実行されます。たとえば、フレーム5がキーフレームになっているフレーム5～10の区間が再生される場合は、フレーム4からフレーム5に移ったとき、あるいはほかのフレームからこの区間にジャンプしてきたときに1度だけ実行されます。もしフレーム11にフレーム8に戻るスクリプトが書いてあったとすると、フレーム8～11のループ再生を行い、フレーム8を再生するたびにキーフレームのフレームアクションが実行されることになります。
■スクリプトの実行順と有効範囲
フレームアクションは1行目から順に実行されます。フレームアクションではfunctionを使ってメソッドや関数を定義できますが、同じフレームアクションに書いてあるスクリプトはすべて読み込まれてから実行されるので、1行目のスクリプトで2行目以降に定義してあるメソッドや関数を呼び出すことができます。
ただし、まだ再生していないフレームで定義してあるメソッドや関数を呼び出すことはできません。既に再生したフレームのフレームアクションならば呼び出せます。（ActionScript1.0のメソッドと関数→p.??）
また、タイムラインが1フレームしかない場合やthis.gotoAndStop(1);やthis.stop();というように、フレームアクションが設定されているフレームに留まる場合にも最初に1回しか実行されません。したがって、１フレームしかない場合などには、変数の初期化などが繰り返し行われることはありません。
■イベントハンドラ
Flash MX（Flash Player 6）から、フレームアクションにおいてインスタンスにイベントハンドラを設定できます。これにはいくつかのメリットがあります。
１つは、ムービークリップのアクションをonClipEventイベントハンドラに頼らなくてもよくなったことで、シンボル内にイベントハンドラを書き込むことができるようになりました。これにより、同じシンボルから作られるムービークリップのインスタンスにおいて共通のイベントハンドラを使えるようになります。
ただし、先にも書いたようにフレームアクションをムービークリップシンボル自身のタイムラインに書き込んだほうが効率がよいケースと、メインのタイムラインのフレームアクションからすべてのインスタンスを制御するほうがよいケースがあります。
2つは、ボタンのイベントハンドラでしか利用できなかったonPressやonRollOverなどのイベントアクションがムービークリップのイベントアクションでも利用できるようになりました。これも大変便利な部分です。たとえば、イベントハンドラを設定するインスタンスの名前がmy_mcだったとき、次のようにイベントハンドラを書きます。
my_mc.onPress = function(){
//インスタンスmy_mcがクリックされた時に実行するステートメント
};
3つは、ムービークリップ（MovieClipクラス）、ボタン（Buttonクラス）、テキストフィールド（TextFieldクラス）だけではなく、Soundクラス、Stageクラス、MovieClipLoaderクラスなどのコアクラスと呼ばれる標準のクラスがイベントをイベントハンドラで処理する仕様になっているからです。これによりスクリプトの様式が統一されて見通しも良くなります。
■MovieClipオブジェクトが受け取るイベント
ムービークリップのインスタンスは、MovieClipクラスから作られたインスタンス（MovieClipオブジェクト）です。MovieClipオブジェクトには次のイベントハンドラを設定できます。
ただし、onKeyDownやonKeyUpのイベントは、イベントが発生してもそのままではMovieClipオブジェクトに対してはイベントメッセージが送信されません。イベントを受け取るには、focusEnabledプロパティでフォーカスが当てるか、あるいはaddListener()メソッドを使ってKeyオブジェクトのリスナーに登録する必要があります。（リスナー→p.??）
イベントハンドラ タイミング
MovieClip.onData ムービークリップを読み込みが終わった。
MovieClip.onDragOut このムービークリップの上でマウスダウンしたままカーソルが外へ出て再び戻った。
MovieClip.onDragOver このムービークリップの上でマウスダウンしたままカーソルが外へ出た。
MovieClip.onEnterFrame フレームが進んだ。
MovieClip.onKeyDown キーが押された。（フォーカスがあるとき）
MovieClip.onKeyUp 押されたキーが上がった。（フォーカスがあるとき）
MovieClip.onKillFocus このムービークリップからフォーカスが移動した。
MovieClip.onLoad ムービークリップが読み込まれて表示された。
MovieClip.onMouseDown マウスボタンが押された。
MovieClip.onMouseMove マウスカーソルが動いた。
MovieClip.onMouseUp マウスボタンが上がった。
MovieClip.onPress このムービークリップがクリックされた。（マウスダウン時）
MovieClip.onRelease このムービークリップがクリックされた。（マウスアップ時）
MovieClip.onReleaseOutside このムービークリップがプレスされたままカーソルが外へ出てマウスアップした。
MovieClip.onRollOut このムービークリップの外へカーソルが出た。
MovieClip.onRollOver このムービークリップの中にカーソルが入った。
MovieClip.onSetFocus このムービークリップにフォーカスが移った。
MovieClip.onUnload ムービークリップがタイムラインから消えた。
図3-2-4 MovieClipクラスのイベントハンドラ。
これをスクリプトで使用するには、「MovieClip」の部分を実際のインスタンス参照にします。たとえば、次のようになります。
this.onEnterFrame
my_mc.onPress
_root.my_mc.cat_mc.onRollOver
具体的なサンプルを示すと次のような使い方があります。このサンプルでは、ステージにcat_mcインスタンスを置き、メインのタイムラインのフレーム１に次のフレームアクションを書いています。ムービーをパブリッシュするとインスタンスが回転し、クリックすると逆回転になります。
sample→cat1.fla
フレームアクション:
//初期値の設定
cat_mc.k = 1;
//回転
cat_mc.onEnterFrame = function() {
this._rotation += this.k * 10;
};
//クリックで逆回転
cat_mc.onPress = function() {
this.k *= -1;
};
同様の動作を行うスクリプトをムービークリップシンボル自身のタイムラインに書き込む場合にはcat_mcというインスタンス名をthisに置き換えるだけです。このシンボルから作られたインスタンスはすべて回転するようになります。
sample→cat2.fla
フレームアクション（シンボル自身のタイムラインに記述する場合）
this.k = 1;
//回転
this.onEnterFrame = function() {
this._rotation += this.k * 10;
};
//クリックで逆回転
this.onPress = function() {
this.k *= -1;
};
■Buttonオブジェクトが受け取るイベント
ボタンのインスタンスには後述するようにボタンアクションにおいてon (press)といったイベントハンドラを設定できますが、フレームアクションでイベントハンドラを設定することもできます。ボタンのインスタンスは、Buttonクラスから作られたインスタンス（Buttonオブジェクト）です。Buttonオブジェクトには次のイベントハンドラを設定できます。
ただし、onKeyDownやonKeyUpのイベントは、イベントが発生してもそのままではButtonオブジェクトに対してはイベントメッセージが送信されません。イベントを受け取るには、focusEnabledプロパティでフォーカスが当てるか、あるいはaddListener()メソッドを使ってKeyオブジェクトのイベントリスナーに登録する必要があります。（イベントリスナー→p.??）
イベントハンドラ タイミング
Button.onDragOut このボタンの上でマウスダウンしたままカーソルが外へ出て再び戻った。
Button.onDragOver このボタンの上でマウスダウンしたままカーソルが外へ出た。
Button.onKeyDown キーが押された。（フォーカスがあるとき）
Button.onKeyUp 押されたキーが上がった。（フォーカスがあるとき）
Button.onKillFocus このボタンからフォーカスが移動した。
Button.onPress このボタンがクリックされた。（マウスダウン時）
Button.onRelease このボタンがクリックされた。（マウスアップ時）
Button.onReleaseOutside このボタンがプレスされたままカーソルが外へ出てマウスアップした。
Button.onRollOut このボタンの外へカーソルが出た。
Button.onRollOver このボタンの中にカーソルが入った。
Button.onSetFocus このボタンにフォーカスが移った。
図3-2-5 Buttonクラスのイベントハンドラ。
■TextFiledオブジェクトが受け取るイベント
テキストフィールドのインスタンスは、TextFieldクラスから作られたインスタンス（TextFieldオブジェクト）です。TextFieldオブジェクトには次のイベントハンドラを設定できます。
イベントハンドラ タイミング
TextField.onChanged このテキストフィールドの内容が更新された。（フォーカスがあるとき）
TextField.onKillFocus このテキストフィールドからフォーカスが移動した。
TextField.onScroller このテキストフィールドのスクロールの状態が変化した。（フォーカスがあるとき）
TextField.onSetFocus このテキストフィールドにフォーカスが移った。
図3-2-6 TextFieldクラスのイベントハンドラ。
■その他のオブジェクトが受け取るイベント
このほかにも、Soundオブジェクト、LoadVarsオブジェクト、XMLオブジェクト、XMLSocketオブジェクトなどが、それぞれに関連したイベントハンドラをもつことができます。
イベントハンドラ タイミング
Sound.onLoad サウンドデータが読み込まれた
Sound.onSoundComplete サウンドの再生が終わった
LoadVars.onLoad loadまたはsendAndLoadの実行が完了した
LoadVars.onData loadまたはsendAndLoadでデータを読み込んだ
XML.onLoad loadまたはsendAndLoadの実行が完了した
XML.onData loadまたはsendAndLoadでXMLデータを読み込んだ
XMLSocket.onClose XMLSocketの接続が閉じた
XMLSocket.onConnect XMLSocketの接続が確立した
XMLSocket.onData XML形式のストリングデータを受信した
XMLSocket.onXML XMLオブジェクトをサーバーから受信した
図3-2-7 その他のクラスのイベントハンドラ。
ムービークリップアクション
ムービークリップアクションは、個々のムービークリップのインスタンスに設定するスクリプトです。ムービークリップアクションを設定したいインスタンスをステージで選択し、アクションウインドウを開いてスクリプトを書きます。
ムービークリップアクションは、インスタンスが表示されたら1行目から実行されるというものではなく、何かのイベントを受けて実行されるイベントハンドラの形式になっています。ムービークリップアクションに設定できるイベントハンドラには、onClipEventイベントハンドラとonイベントハンドラの2種類があります。
note:
ムービークリップアクションにonイベントハンドラを設定できるのはFlash MX（Flash Player 6）以降です。
■onClipEventイベントハンドラ
onClipEventイベントハンドラでは、()の中に応答するイベントの種類を書きます。
onClipEvent(イベント){
//実行するステートメントをここに書きます。
}
指定できるイベントには次の9種類があります。それぞれ別々のタイミングで実行されるので、1つのムービークリップアクションに複数のonClipEventイベントハンドラを書き込むことができますが、後述のonハンドラと違って１つのonClipEventイベントハンドラで複数のイベントを指定することはできません。
イベント タイミング
load インスタンスが登場した直後
unload インスタンスが消えた直後
enterFrame 再生フレームが進んだ
mouseDown マウスボタンが押された
mouseUp マウスボタンが上がった
mouseMove マウスカーソルが動いた
keyDown キーが押された
keyUp 押されたキーが上がった
data 外部データを読み込み終わった
たとえば、onClipEvent(load)イベントハンドラは、そのインスタンスが登場した時に実行されます。変数の初期化やプロパティの初期設定、ムービークリップで使うメソッドや関数をfunction定義する場所として使います。
onClipEvent(enterFrame)イベントハンドラは、ムービークリップの再生フレームが進む度に実行されます。このとき、インスタンス自身が再生中であるかどうかが問題です。インスタンスが置いてある_root（入れ子の場合は１つ上の階層のムービークリップ）がstop()で停止中でも関係ありません。
onClipEvent(mouseDown)、onClipEvent(mouseUp)のイベントハンドラは、（左の）マウスボタンが下がったとき、上がったときのタイミングでそれぞれ実行されます。このとき、インスタンスがクリックされていなくても実行されるので注意が必要です。どのインスタンスがクリックされたかを知りたい場合には、マウス座標とインスタンスの領域をhitTest()を使って比較します。次のムービークリップアクションでは、インスタンス以外の場所をクリックしてもインスタンスのサイズが1.2倍に拡大します。
ムービークリップアクション：
//クリックイベントがあるとインスタンスを拡大する
onClipEvent (mouseDown) {
this._xscale *= 1.2;
this._yscale *= 1.2;
}
一方、次のスクリプトではクリックされた座標とインスタンスの領域のヒットテストを行っています。こうすればアクションが設定されているインスタンスをクリックしたときにそのインスタンスが拡大します。
ムービークリップアクション：
//クリックされたインスタンスだけを拡大する
onClipEvent (mouseDown) {
if (this.hitTest(_root._xmouse, _root._ymouse, false)) {
this._xscale *= 1.2;
this._yscale *= 1.2;
}
}
onClipEvent(keyDown)、onClipEvent(keyUp)のベントハンドラは、キーボードのキーが押されて下がったとき、上がったときのタイミングでそれぞれ実行されます。どのキーが押されたかはKey.isDown()やtheKeyCodeで調べることができます。
note:
onClipEventイベントハンドラの場合には、Keyオブジェクトのリスナーにしなくてもイベントを受け取ることができます。（リスナー→p.??）
■onイベントハンドラ
onイベントハンドラでも()の中に応答するイベントの種類を書きますが、onClipEventイベントハンドラと違って１つのハンドラで同時に複数のイベントを指定できます。
on(イベント1, イベント2, ...){
//実行するステートメントをここに書きます。
}
指定できるイベントには次の8種類のイベントがあります。イベントごとに個別のイベントハンドラを作ることができますが、内容が同じ場合には1つのハンドラに複数のイベントを同時に割り当てることもできます。
イベント タイミング
dragOut このインスタンスの上でマウスダウンしたままカーソルが外へ出て再び戻った。
dragOver このインスタンスの上でマウスダウンしたままカーソルが外へ出た。
keyPress キーが押された。
press このインスタンスがクリックされた。（マウスダウン時）
release このインスタンスがクリックされた。（マウスアップ時）
releaseOutside このインスタンスがプレスされたままカーソルが外へ出てマウスアップした。
rollOver このインスタンスの外へカーソルが出た。
rollOut このインスタンスの中にカーソルが入った。
たとえば、on (press)、on(release)のイベントハンドラは、インスタンスが（左）クリックされた時、（左の）マウスボタンが下がったとき、上がったときのタイミングでそれぞれ実行されます。onClipEvent(mouseDown)イベントハンドラと違って、クリックされたインスタンスだけがイベントを受け取ります。on (releaseOutside)イベントハンドラは、次のようにon (release)イベントハンドラと組み合わせて使うと効果的です。
on (release, releaseOutside){
// クリックされた場合にマウスアップ時に実行したいスクリプトを書きます。
}
on (keyPress "キー")イベントハンドラは、指定したキーが押された時に実行されます。キーは"a"、"b"、"c"のように英数文字で指定します。returnキー、enterキーは"
on (keyPress "キー"){
//指定のキーが押された時に実行したいスクリプトを書きます。
}
ボタンアクション
ボタンアクションは、個々のボタンシンボルのインスタンスに設定するスクリプトです。ステージでボタンのインスタンスを選択し、アクションウインドウにスクリプトを書きます。
ムービークリップアクションと同様にボタンアクションは、インスタンスが表示されたら1行目から実行されるというものではなく、何かのイベントを受けて実行されるイベントハンドラの形式になっています。
ボタンアクションに設定できるイベントハンドラは、onイベントハンドラのみです。onイベントハンドラはムービークリップの場合と同じように動作します。イベントの種類とイベントが発生するタイミングについてはムービークリップアクションでの説明を参照してください。
ボタンアクション：
//ボタンが置いてあるタイムラインをgreenフレームラベルへ進める
on (release, releaseOutside) {
gotoAndPlay("green");
trace("test"); // 動作テスト。出力→ test
}