Flash入門
第7回　イベント処理には三つの方法がある

図1●フォームにボタンを一つ配置して，イベント・ハンドラを記述しているところ

[画像のクリックで拡大表示]

リスト1●ボタンに記述するイベント処理コード（イベント・ハンドラ方式）

[画像のクリックで拡大表示]

図2●ボタンを押すとtraceアクションにより，[出力]パネルにメッセージを表示する

[画像のクリックで拡大表示]

リスト2●各フォームに記述するイベント処理のコード（イベント・ハンドラ方式）

[画像のクリックで拡大表示]

　前回までの記事で，Flash MX Professional 2004（以降，Flashと呼びます）が備えるスクリプト言語であるActionScript 2.0の開発環境の特徴や，基本的なプログラミングの手順を紹介してきました。Flashでも，Visual Studio .NETやJBuilderと同じように，フォームにコンポーネントを貼り付けてGUI画面を作り，そこにコードを記述してアプリケーションとしての機能を作成する，という手順で開発ができるのを確認していただけたと思います。

　今回はさらに一歩踏み込んで，イベント駆動型＊1のアプリケーションをFlashで作成する3通りの方法を紹介しましょう。イベント駆動型アプリケーションは，フォームを読み込んだり，ユーザーがボタンをクリックしたといったイベントが発生したときに，イベントの種類に応じた処理を起動するアプリケーションです。GUI画面を備えたアプリケーションの仕組みとして非常に一般的ですから，本誌読者の皆さんであれば，一度は開発した経験があるのではないかと思います。

イベント処理の記述には3通りの方法がある

　最初にちょっと復習をしておきましょう。FlashのアプリケーションでボタンやフォームといったGUI部品を使うときには，開発画面の[コンポーネント]パネルに並んだコンポーネントを，中央のステージ上のフォームにドラッグ・アンド・ドロップで貼り付けていきますね（図1[拡大表示]）。こうした操作でコンポーネントから作成したGUI部品を「インスタンス」と呼びます＊2。インスタンスはコンポーネントが備える性質をすべて引き継いでいます。以降では，アプリケーションが実際に装備しているGUI部品をインスタンスと呼び，インスタンスを生成する元になったコンポーネントと区別しますので注意してください。

　Flashは，インスタンスで発生したイベントを処理する方法として以下の三つを用意しています。

(1)コンポーネント・イベント・ハンドラ
(2)コンポーネント・イベント・リスナー
(3)イベント・ハンドラ・メソッド＊3

　(1)は，イベントを発生するインスタンスに直接，イベントの種類に応じたコードを記述する方法です。本連載の第1回，第2回でも使いました。非常に直感的で理解しやすい半面，コードを記述する場所が散らばってしまうので，プログラム変更時に対応しにくいというデメリットがあります。

　(2)は，イベントが発生したことを通知する先を作成して，イベントを発生するインスタンスにそれらを登録する方法です。通知する先を「イベント・リスナー」，イベントを発生するインスタンスを「ブロードキャスター」と呼びます。(1)に比べるとコードの記述にちょっと手間がかかりますが，ブロードキャスターとイベント・リスナーの対応関係をまとめて明示的に記述できますのでコードが読みやすくなります。

　(3)は，イベントが発生したときにあらかじめ呼び出されるようになっている処理を上書きする方法です。具体的には，コンポーネントであらかじめ定義されているイベントに対応する処理を，インスタンスで再定義します＊4。

イベント・ハンドラは直感的で理解しやすい

　三つの方法について順に，具体的な例を挙げて説明していきましょう。まず，コンポーネント・イベント・ハンドラ（以降，「onハンドラ」と呼びます）を使用する場合です。

　フォーム，スライド，ボタンといったコンポーネントは，あらかじめ複数のイベントを用意しています＊5。したがってイベントに対応した処理を記述する際には，「どのインスタンスで，どんなイベントが発生したときに起動するのか」を指定する必要があります。onハンドラでは，該当するインスタンスにプログラマが直接コードを記述することで，これらを指定します。

　具体的な例を見てみましょう。メニューから，[ファイル]-[新規]-[フォームアプリケーション]として，新規のFlashドキュメントを作成します。開発画面の左側（[スクリーンアウトライン]ペインと呼びます）で「アプリケーション」のフォームを選んで，ステージ上のフォームに[コンポーネント]パネルからボタンを一つ配置してください。

　次に，フォームに配置したボタンをマウスでクリックして選択し，[アクション]パネルに＊6

on(

と入力します。すると，ボタンが備えるイベントが，後に続く入力の候補として表示されます（図1）＊7。今回はその中から先頭のclickを選択します。続いてリスト1[拡大表示]のようにコードを記述します。リストにあるtraceアクションは，Flashムービーをプレビュー画面で表示するときに[出力]パネルに引数の内容を表示させる命令です。traceアクションの結果はパブリッシュしたFlashムービーでは出力されません。処理の内容を確認するためのデバッグ用の命令です＊8。

　コードを入力したら，メニューで[制御]-[ムービープレビュー]と選択し（またはctrl＋enterキーを押して），プレビュー表示で動作を確認してみましょう。ボタンを押すと，[出力]ウィンドウにメッセージが表示されますね（図2[拡大表示]）。確認したら，プレビュー画面の右上の「×」ボタンを押して画面を閉じてください。

　このように，onハンドラを使用する場合は，イベントを処理したいインスタンスを直接画面上で選択し，そこに

on(イベント名){処理}

という形で処理を記述します。インスタンスが実際に画面上に見えており，それを選択したうえでコードを記述するわけですから直感的に理解しやすいですね。

　ほかのインスタンスのイベントについても試してみましょう。[スクリーンアウトライン]ペインで「アプリケーション」フォームを選択し，[アクション]パネルを開いて，リスト2[拡大表示]の(1)のloadイベントを処理するコードを記述してください。さらに，「フォーム1」を選択し，同じように[アクション]パネルにリスト2(2)のコードを記述します。

　この状態でプレビュー表示をすると，「[アプリケーション]が読み込まれました。」「[フォーム1]が読み込まれました。」と続けて表示されます。loadイベントは，個々のフォームの読み込みを終えたときに発生するイベントです＊9。各フォームの初期化処理を記述するには，このイベントを利用するとよいでしょう＊10。

Buttonを表すクラスは二つある 図A●Flashがサンプルとして用意している「通常のボタン」 [画像のクリックで拡大表示] 　今回の記事ではボタンとして，[コンポーネント]パネルのButtonコンポーネント（Buttonクラス）を使いました。実はFlashにはもう1種類Buttonクラスが存在します。それは，メニューから[ウィンドウ]-[他のパネル]-[サンプルライブラリ]-[ボタン]内のサンプルとして用意されているボタン（図A[拡大表示]）や，[挿入]-[新規シンボル]-[ボタン]と選択する操作などで作成するボタンです。ここではこれを便宜上「通常のボタン」と呼びます。 　通常のボタンは，Flash MX 2004より前のバージョンのFlashで使用されていたボタンの機能を受け継いだものです。ActionScriptで制御する場合には，今回使った「コンポーネントのボタン」とは別のクラスのインスタンスとして扱う必要があります。例えば，通常のボタンのイベント処理はon(click)ではなくon(press)やon(release)といったイベント・ハンドラで処理を行いますし，addEventListenerメソッドも実装していません＊A。コンポーネントのボタンは，Macromedia\Flash MX 2004\ja\First Run\Classesフォルダ内のmx\controls\Button.asのインスタンスであり，通常のボタンはClassesフォルダ直下のButton.asのインスタンスであるからです。 　通常のボタンは，自分でサイズ，色，デザインなどを決めて作成できるので，オリジナルのボタンを作成したい場合に向いています。ほかのコンポーネントと統一したデザインにしたい場合には，コンポーネントのボタンを使用するのが良いでしょう。VBA（Visual Basic for Applications）を使用したことのある方であれば，フォームのボタンとコントロールツールボックスのボタンの関係に似ている，と捉えられますね。