PR

カスタムクラスの作成とMouseEvent

2008年6月16日(月)
加茂 雄亮

変更されたイベント処理とカスタムクラスの作成

 前回までは、主に表示に関することを解説しました。今回は、ActionScript 3.0におけるイベント処理について、2回にわたって解説していきたいと思います。イベントとは、Flash内でなんらかの出来事を発生した時に行う処理のことで、インタラクティブ性を高める上で不可欠な要素です。ActionScript 2.0までは、オブジェクトアクションと呼ばれる、on()やonClipEvent()などといったイベント処理が見られましたが、3.0ではそれが廃止され、addEventListener()を使用することとなりました。

 では、今回もサンプルを見ていきましょう。まずはこちらからサンプルをダウンロード(http://www.thinkit.co.jp/images/article/78/3/7831.zip)してください(7831.zip/16.3 KB)。今回からは、カスタムクラスを使ったスクリプティングを行っていきます。

 ソースを解説する前に、パッケージについて解説します。パッケージとは、クラス定義のグループ化のことで、ほかのクラスやスクリプトから読み込むことができるようにするための概念です。packageキーワードを用い、所属パッケージを指定します。パッケージ化しない場合は指定する必要はありませんが、クラス全体を無指定のpackageでくくる必要があります。なにかしらのパッケージに所属するとして指定したクラスはパッケージと同名のフォルダ内に保存します。この構造は、フォルダのツリー構造と一致します。

 保存する際、気をつけなければならいのは、クラス名と同じファイル名にしなければならないことです。以上を踏まえると、例えばサンプルならば、classesパッケージに所属するButtonActionクラスはswfの同階層のclassesフォルダ内にButtonAction.asとして保存されています。

リンケージ(関連付け)と継承

 ライブラリ(シンボルを格納する場所)内のMovieClipのフレームにスクリプトを書き込んでいくのではなく、外部ASファイルとしてスクリプトをSWF外に持ち、動作させるためにはリンケージ(関連付け)を行う必要があります。

 リンケージをするには、ライブラリパネルを開き、任意のムービークリップを右クリックして、コンテキストメニューからリンケージを選びます(図1)。

 リンケージプロパティが開いたら、クラス欄に任意のクラスまでのパッケージパスをいれます。サンプルの場合だと、classes.ButtonAction となります。無所属のパッケージで、FLAファイルと同階層にASファイルを保存している場合は、ButtonActionで指定できます。

 サンプルソースに戻ります。MovieClipをリンケージした場合、クラスにMovieClipを継承する必要があります。継承については前回解説しましたが、継承するための方法については解説しませんでした。スーパークラスからサブクラスに継承させるためにはextends キーワードを使います。このキーワードはクラス名の後ろの付与し、継承するスーパークラスを指定します。

public class ButtonAction extends MovieClip

 しかし、このままではエラーが発生してしまいます。理由は、カスタムクラスで必要なスーパークラスが読み込まれていないためです。ActionScript 3.0では、自身に持っていないメソッドやプロパティを参照する場合や継承する場合、対象のクラス自体を読み込ませなければなりません。この読み込みを importといい、一般的にpackage{}内の直後に記述します。

package classes{
import flash.display.MovieClip;
import flash.events.MouseEvent;

 それでは、続きのソースを見ていきましょう。

株式会社ロクナナ
ActionScriptを伴うFlashコンテンツやXHTML+CSS+JavaScriptによるAjaxコンテンツなどのRIA開発に従事。Flash/ActionScript 3.0やXHTML+CSSに関する講義・執筆活動にも取り組んでいる。http://www.rokunana.com/

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています