2006.08.26

Report
2006 >> [11.11] [08.26] [05.13] [02.25]　
2005 >> [11.26] [08.27] [05.14] [02.05]
2004 >> [11.13] [08.07] [05.15] [02.07]
2003 >> [11.08] [08.24] [05.31] [02.01]
2002 >> [12.08] [09.07]

2006.08.26
　demo1「はじめてのFlash Lite」　講師：梅原宗士氏
　demo2「さて、どう組もう?Flash Lite」　講師：田中正吾氏
　demo3「AS3.0で行こう！」　講師：野中文雄氏

ページ1 ページ2 ページ3

AS3.0で行こう!

講師：野中文雄氏
いつも分かり易く説明していただいている野中氏。
今回はActionScript 1.0～ActionScript 3.0までの5つの書き方を完全保存版としてお話ししていただきました。

ActionScript 新旧5つの書き方

野中氏おなじみのペンギンが回転する作例を、ActionScript 1.0～ActionScript 3.0の5通りの書き方で再現していきます。

>> ペンギンが回転するSWFの作例を開く

5通りの書き方の種類は以下のようになります。

ActionScript 1.0のMovieClipアクション－ Flash 5スタイル
ActionScript 1.0のフレームアクション－ Flash MXスタイル
ActionScript 3.0のフレームアクション
ActionScript 2.0クラス定義
ActionScript 3.0のクラス定義

まず、1のアクションを記述し、次に2・3・4のアクションへと変更していき、最後に5の「ActionScript 3.0のクラス定義」による記述方法へ変更していきます。

※ここでは、ActionScript 1.0スタイルのスクリプトについても、ActionScript 2.0の厳密な型指定を用います。
※ActionScript 3.0でのパブリッシュは、Flash9 Public Alpha版を使用しています。

[1]　ActionScript 1.0のMovieClipアクション－ Flash 5スタイル

始めに、ペンギンをMoviClip「Pen」としてシンボル化し、「メインタイムライン」に配置します。

【001】
「Pen」のインスタンスのMovieClipアクション

onClipEvent (load) {

 var nDeceleration:Number = 0.2;

}

onClipEvent (enterFrame) {

 _rotation += _root.getAngle(_xmouse, _ymouse)*nDeceleration;

}

ここに使われている「getAngle()」は、座標値から角度を計算する関数で、メインタイムラインに定義してます。

また、係数nDecelerationを「getAngle()」から返されてくる値「nDegree」に乗じていますので、ペンギンは減速しながらアニメーションします。

【002】
メインタイムラインの第1フレームアクション

var RADIAN_TO_DEGREE:Number = 180/Math.PI;

function getAngle(nX:Number, nY:Number):Number {

 var nRadian:Number = Math.atan2(nY, nX);

 var nDegree:Number = nRadian*RADIAN_TO_DEGREE;

 return nDegree;

}

【001】のようなインスタンスにスクリプトを直接記述する方法は、現在公開されているActionScript 3.0の仕様では、使うことができません。

[2]　ActionScript 1.0のフレームアクション－ Flash MXスタイル

先ほどの「Pen」のインスタンスのMovieClipアクションとして書かれていたものを、「Pen」シンボルの第1フレームアクションに書き換えます。

【003】
「Pen」シンボルの第1フレームアクション

var nDeceleration:Number = 0.2;

function onEnterFrame():Void {

 _rotation += _root.getAngle(_xmouse, _ymouse)*nDeceleration;

}

先ほどの「getAngle()」の記述はメインタイムラインの第１フレームアクションなので、すべてのアクションをフレームに書いたことになります。
これで ActionScript 3.0への書替えが可能になります。

[3]　ActionScript 3.0のフレームアクション

まず、メインタイムラインの第1フレームアクション【002】は、ActionScript 3.0でそのまま動作します。
「Pen」シンボルの第1フレームアクション【003】では、大きく２つの観点からの修正が必要になります。

イベントハンドラメソッドは、イベントリスナーに変更する。
プロパティ名を変更する。

変更方法	ActionScript 1.0/2.0	ActionScript 3.0
「_」削除	_root、_rotation	root、rotation
名称変更	_xmouse、_ymouse	mouseX、mouseY

【004】
「Pen」シンボルの第1フレームアクション：【003】を書き換え

var nDeceleration:Number = 0.2;

addEventListener("enterFrame", enterFrame);

function enterFrame(eventObject:Event):void {

 rotation += root.getAngle(mouseX, mouseY)*nDeceleration;

}

これで、ActionScript 3.0のフレームアクションを記述することができるようになります。
ActionScript 3.0で「パブリッシュ」できる環境をお持ちの方は、「パブリッシュ設定」、Flashの設定の「ActionScript のバージョン」を変更して「パブリッシュ」してみましょう。

[4]　ActionScript 2.0クラス定義

[2]　ActionScript 1.0のフレームアクション【003】のスクリプトを、外部ActionScriptファイルとしてActionScript 2.0のクラス定義に書替えてみます。

「MyClass.as」と言う名前の「新規アクションスクリプトファイル」、又はテキストエディタなどで「MyClass.as」というテキストファイルを作成し、【003】のアクションを以下の【005】ように書き換えて保存します。
保存場所は、「fla」ファイルがある場所と同じディレクトリに保存します。

【005】
ActionScript 2.0クラス定義ファイル
ファイル名: MyClass.as

class MyClass extends MovieClip {

 var nDeceleration:Number = 0.2;

 function MyClass() {}   // 空のコンストラクタ関数

 function onEnterFrame():Void {

  _rotation += _root.getAngle(_xmouse, _ymouse)*nDeceleration;

 }

}

このクラス「MyClass」は、MovieClipシンボルに設定します。
[ライブラリ]パネルでMovieClipシンボルをクリックし、パネルのオプションポップアップメニューから[プロパティ]を選択します。
[シンボルプロパティ]ダイアログボックスで、[リンケージ]の[アクションスクリプトに書き出し]にチェックをつけ、[識別子]に半角英数字で任意の名前(たとえば「Pen」)をタイプしたら、[AS 2.0クラス]に、設定するクラス名「MyClass」を入力します。

リンケージのAS 2.0クラスを設定すると、このシンボルのインスタンスは、MovieClipでなくカスタムクラス「MyClass」のインスタンスになります。
そうなると、MyClassのプロパティやメソッドが利用できる反面、MovieClipのメソッドやプロパティは使えなくなってしまいます。
そこで、「extends」ステートメントにより「MovieClip」クラスを継承します。

class MyClass extends MovieClip {

すると、MovieClipクラスをベースとしたうえで、MyClassのプロパティ・メソッドを拡張(extend)するかたちになります。つまり、MovieClipクラスのプロパティ・メソッドも、MyClass自身のものと同じようにアクセスできます。

次に、【005】の

_rotation += _root.getAngle(_xmouse, _ymouse)*nDeceleration;

のメインタイムラインの第1フレームに書かれている「getAngle（）」関数を外部のクラスファイルから直接読み込むようにするため、【002】を【005】のように外部ActionScriptファイルへ変更します。

【006】
ActionScript 2.0クラス定義ファイル
ファイル名: MyMath.as

class MyMath {

 static var RADIAN_TO_DEGREE:Number = 180/Math.PI;

 static function getAngle(nX:Number, nY:Number):Number {

  var nRadian:Number = Math.atan2(nY, nX);

  var nDegree:Number = nRadian*RADIAN_TO_DEGREE;

  return nDegree;

 }

}

変更点は2カ所、変数と関数にそれぞれ「static」ステートメントを加えます。
static宣言したメソッドは、クラスのインスタンスをつくることなく、クラスを直接参照して呼出すことができます。
また、static宣言した関数から呼び出される変数「RADIAN_TO_DEGREE」も「static」ステートメントを必要とします。
これで「getAngle()」の参照先が変わりますので、【005】を再度修正します。

【007】
ActionScript 2.0クラス定義ファイル：【005】を書き換え
ファイル名: MyClass.as

class MyClass extends MovieClip {

 var nDeceleration:Number = 0.2;

 function MyClass() {}   // 空のコンストラクタ関数

 function onEnterFrame():Void {

  _rotation += MyMath.getAngle(_xmouse, _ymouse)*nDeceleration;

 }

}

これで、参照先が「MyMathクラスのgetAngle関数」ということになり、すべてのスクリプトがActionScript 2.0クラスで定義されたことになります。

[5]　ActionScript 3.0のクラス定義

まず、ActionScript 3.0でMovieClipシンボルに記述したフレームアクション【004】を、クラス定義に修正します。
基本は、ActionScript 2.0のクラス定義と同じですが、3点追加することがあります。

packageキーワードを用いて、クラス定義全体をすっぽりと囲む必要があります。
「パッケージ」は、クラスをフォルダ/ディレクトリのようにグループ分けする機能で、packageキーワードの後に、パッケージ名を指定します。
パッケージ名は、指定しないことも可能です(今回のサンプルは無指定)。
importステートメントの記述
importステートメントは、ActionScript 2.0にも存在しましたが、ActionScript 3.0では、クラスがパッケージに再構成されました。
パッケージのクラスを使用するには、importステートメントで、パッケージも含めたクラスのフルパス名(完全修飾クラス名)を宣言するようになりました。
classキーワードの前に、属性キーワードpublicを指定する

【008】
ActionScript 3.0クラス定義ファイル
ファイル名: MyClass.as

package {

 import flash.display.MovieClip;

 import flash.events.Event;

 public class MyClass extends MovieClip {

  var nDeceleration:Number = 0.2;

  function MyClass() {

   addEventListener(Event.ENTER_FRAME, enterFrame);

  }

  function enterFrame(eventObject:Event):void {

   rotation += root.getAngle(mouseX, mouseY)*nDeceleration;

  }

 }

}

また、

addEventListener(Event.ENTER_FRAME, enterFrame);

と、"enterFrame"から「Event.ENTER_FRAME」に変更することで、動作結果は変わりませんが、スペルミスに対するシンタックスチェックが働くようになります。

「[4]　ActionScript 2.0クラス定義」と同様に、クラスMyClassはMovieClipシンボルに設定します。

次に、関数「getAngle」などが書かれている【002】を外部ActionScriptファイルへ変更します。

【009】
ActionScript 3.0クラス定義ファイル：【005】を書き換え
ファイル名: MyMath.as

package {

 class MyMath {

  static const RADIAN_TO_DEGREE:Number = 180/Math.PI;

  static function getAngle(nX:Number, nY:Number):Number {

   var nRadian:Number = Math.atan2(nY, nX);

   var nDegree:Number = nRadian*RADIAN_TO_DEGREE;

   return nDegree;

  }

 }

}

「const」となっている部分は、「var」でも構いませんが、「const」として定数(constant)宣言することで、設定した値を書き換えられないようにすることができます。
続いて、外部 ActionScriptファイルのクラス「MyMath」の関数「getAngle」を参照させるため、【008】を書き換えます。

【010】
ActionScript 3.0クラス定義ファイル：【008】を書き換え
ファイル名: MyClass.as

package {

 import flash.display.MovieClip;

 import flash.events.Event;

 public class MyClass extends MovieClip {

  var nDeceleration:Number = 0.2;

  function MyClass() {

   addEventListener(Event.ENTER_FRAME, enterFrame);

  }

  function enterFrame(eventObject:Event):void {

   rotation += MyMath.getAngle(mouseX, mouseY)*nDeceleration;

  }

 }

}

これで、すべてのスクリプトがActionScript 3.0クラスで定義されたことになります。

以上、野中氏による「AS3.0で行こう!」でした。
本セミナーをまとめた野中氏の詳しいレジュメは、下記でご覧いただけます。
http://www.fumiononaka.com/Sample/F-site/FF060826.html

恒例・じゃんけん大会!

さてさて、今回の「お楽しみじゃんけん大会」、配っても配っても終わらない、嬉しい楽しい超豪華ラインナップでした!
大重様、Adobe様、どうもありがとうございます!!

以下、目録です。

	■大重美幸さまより「FLASH ActionScript 2.0 　入門完全ガイド+実践サンプル集」(２名様) 「macromedia FLASH ActionScript 　スーパーサンプル集」(２名様)
	■Adobeさまより「Adobe ロゴ入りボールペン」(１名様) 「Adobe ロゴ入りモニターミラー」(１名様) 「Adobe ロゴ入り USB扇風機」(４名様) 「ActionScript 3 Debut Seminar ビーチボール」(４名様) 「Adobe Flex Developer's Night 扇子&巾着セット」(３名様) -INSPIRATION SCENE flash creators collaboration- 　「CD-ROM」(10名様) 　「Ｔシャツ」(４名様)

宴会!宴会!!

今回の二次会参加者は30名弱と、本編参加者数の割には、少なめでのんびりとお話ができました。
なんと!喫煙者がただ1名というとっても健康的な集いであることが判明。
そして、いつものように畳にごろごろ&車座で、Flashの熱い話が聞かれるのでした…。

Top

ページ1 ページ2 ページ3