ENTER FRAME イベント その1

ActionScriptにはフレーム(Frame)という概念がある。フレームとはパラパラ漫画での1枚の絵に相当する。FrameRateというパラメータで、１秒間に何フレーム再生するかを指定できる。設定可能な範囲は、0.01から1000だそうだ。但し、この値は、正確に実施されるものではなく、プログラムが実行されている環境に左右される。

この1フレームが再生される度に、ENTER_FRAMEというイベントが発生する。FrameRateが24ならば、1秒間に最大24回発生すると期待できる。フレームごとに何か処理したいとき、このイベントのイベントリスナーを実装すればよい。コードによって何かアニメーションをさせたいときに、多用されるイベントの１つだ。

次は、Shapeオブジェクトで作成された矩形を右へ動かすだけの単純なサンプルである。右端に到着したら、左端に戻るようになっている。

package {
  import flash.display.Shape;
  import flash.display.Sprite;
  import flash.events.Event;

  [SWF(width="240",height="180",frameRate="24",backgroundColor="0x336699")]
  public class EnterFrame extends Sprite {
    private var _shape:Shape;
    public function EnterFrame() {
      _shape = new Shape();
      _shape.graphics.beginFill(0x339900);
      _shape.graphics.drawRoundRect(0,0,10,10,5);
      _shape.graphics.endFill();
      _shape.y = 100;
      addChild(_shape);

      addEventListener(Event.ENTER_FRAME, enterFrameHandler);
    }

    private function enterFrameHandler(event:Event):void {
      _shape.x += 5;
      if (_shape.x > 240) {
        _shape.x = 0;
      }
    }
  }
}

次回は、このENTER_FRAMEをもう少し、一般化してみたい。

シングルトン

Singletonはデザインパターンの中でも、最もよく知られたパターンではないだろうか。直感的に理解しやすく、また、実装もシンプルだからだろう。ところで、ActionScriptでは、このシングルトンの実装には一工夫が必要になる。なぜなら、publicなコンストラクタしか許されないからだ。

様々な人が、それぞれの工夫を凝らしているようだが、大きくタイプは二つに分かれるようだ。1つは、internalクラスを用いる方法。実装例はこのようになる。

package {
  public class MySingletonA {
    private static var _instance:MySingletonA;

    public function MySingletonA(a:Blocker) {
    }

    public static function getInstance():MySingletonA {
      if (_instance == null) {
        _instance = new MySingletonA(new Blocker());
      }
      return _instance;
    }
  }
}

internal class Blocker { }

もう1つは、フラグを用いる方法だ。実装例はこのようになる。

package {
  import flash.errors.IllegalOperationError;

  public class MySingletonB {
    private static var _lock:Boolean = true;
    private static var _instance:MySingletonB;

    public function MySingletonB() {
      if(_lock) {
        throw new IllegalOperationError("シングルトンです。");
      }
    }

    public static function getInstance():MySingletonB {
      if (_instance == null) {
        _lock = false;
        _instance = new MySingletonB();
        _lock = true;
      }
      return _instance;
    }
  }
}

個人的には、前者の方法の方がいいように思える。なぜなら、勝手にインスタンスを作ろうとすると、コンパイル時にエラーになるからだ。一方、後者では、そのコードが実行されるまで、エラーは気づかれない。実装は素直にみえるが、この点が問題になる。

SWFメタデータタグ

ActionScript Projectで作られたアプリケーションの属性を指定するのに、SWFメタデータタグを記述する方法がある。記述できる属性は次のとおりらしいが、下の4つは動作未確認。

• width...幅(単位:ドット)


• height...高さ(単位:ドット)


• backgroundColor...背景色


• pageTitle...ページのタイトルになる。


• frameRate...フレームレート


• widthPercent...幅(単位:不明)


• heightPercent...高さ(単位:不明)


• scriptRecursionLimit...再起呼び出しの最大可能回数。デフォルト値は1000らしい。


• scriptTimeLimit...停止したと判断されるまでの時間(単位:秒)。デフォルト値は60で、それが設定可能な最大値らしい。

最もオフィシャルに近い情報源は、これ(英語)。下の方にあるコメント欄の最初の投稿が、SWFメタデータタグに関するもので、ドキュメントチームのメンバーらしき人からのようだ。

記述例は次のとおり。Flex Builderにおいて、アプリケーションに設定されているクラスのimport文の直後に記述する。

[SWF(width="640",frameRate="24",pageTitle="僕のflashアプリ",backgroundColor="#6699CC")]

ActionScriptでHello World!

Flex Builderを使って、flashのHello Worldアプリケーションを作ってみたい。Flex Builderを使っていても、Flexフレームワークを使わないピュアなActionScpriだけのアプリケーションが作れる。また、Flex Builderはデザイナーよりもデベロッパー向きなので、コードを書く場合、Flash CS3やCS4を使うよりも便利である。

雛形の作成

まずは、雛形の作成から。

1. File/New/ActionScript Projectを実行する。


2. Project Nameを入力する。以降、プロジェクト名にHelloWorldを入力したものとして説明を続ける。


3. Nextを押して、Main source folderにsrcを入力。（必ずしもこれをする必要はない）


4. Finishを押す。

HelloWorldプロジェクトが作成され、srcフォルダの下(上記3を実行していなければ、プロジェクトの直下)に、HelloWorld.asが作成されているはずである。この時点で、実行可能であるが、残念ながら、まだ"Hello World"は表示されない。

コンソールにHello World

コンソールに"Hello World"を出力してみる。

1. HelloWorld.asを開き、コンストラクタ(7行目と8行目の間)に次の一行を入力する。
   

   trace("Hello World");

   
   


2. HelloWorld.asの変更を保存する。

デバッガーを起動してみる。残念ながらまだ、ブラウザ内に"Hello World"は表示されない。Flex Builderに戻って、コンソールを確認すると、そこに"Hello World"が表示されているはずだ。ブラウザ内（flashアプリケーション内）に表示するまでには、もう一手間かかる。

ブラウザ内にHello World

いよいよブラウザ内に"Hello World"を表示してみよう。

1. HelloWorld.asを開き、次の1行を3行目に追加する。
   

   import flash.text.TextField;

   
   これは、次のステップを上手くやれば自動的に挿入されるので、スキップしてもよい。
   


2. 次にコンストラクタに、trace文の代わりに、次の3行を追加する。
   

   var text:TextField = new TextField();
   text.text = "Hello World";
   addChild(text);

   
   


3. HelloWorld.asの変更を保存する。

ここで、デバッガーを起動すると、"Hello World"がflashアプリケーション内に表示されたのが確認できるはずだ。ブラウザの大きさを変えると、字の大きさも変わることが確認できる。これは、flashアプリケーションのサイズがブラウザにあわせて自動的変わっているためである。

アプリケーションの幅と高さ

アプリケーションの幅と高さを調整してみる。

1. HelloWorld.asを開き、クラスの宣言の直前(4行目と5行目の間)に、次の1行を追加する。
   

   [SWF(width="100",height="100")]



2. HelloWorld.asの変更を保存する。

ここで、デバッガーを起動すると、先ほどとは違う大きさで表示されたことが確認できるはずだ。追加したのは、SWF(スウィフ)メタデータタグと呼ばれるもので、flashアプリケーションの属性などを定義できるものだ。しかし、どういうわけかこれに関するオフィシャルな情報を見つけることはできなかった。SWFメタデータタグに関しては、改めて記事を投稿する予定である。今度は、ブラウザのサイズを変えても字の大きさは変わらない。これが本来（スケール１倍）の大きさである。

HelloWorld.asは最終的に、以下のようになったはず。

package {
  import flash.display.Sprite;
  import flash.text.TextField;

  [SWF(width="100",height="100")]
  public class HelloWorld extends Sprite {
    public function HelloWorld() {
      var text:TextField = new TextField();
      text.text = "Hello World";
      addChild(text);
    }
  }
}