アクセシビリティ

Flash記事

 

ActionScript 3.0書き方教室


目次

  1. はじめに
  2. ActionScript 1.0のMovieClipアクション
  3. ActionScript 1.0のフレームアクション
  4. ActionScript 3.0の最小限のフレームアクション
  5. ActionScript 3.0の標準的なフレームアクション
  6. ActionScript 2.0クラス定義
  7. ActionScript 3.0クラス定義

ActionScript 1.0のMovieClipアクション

まず、MovieClipアクションにスクリプトを記述するActionScript 1.0のFlash 5スタイルで、基本のサンプルを作成します。スクリプトを設定したMovieClipインスタンスが、マウスポインタの方向に追随して回転します。


図01-001: マウスポインタを追いかけてインスタンスが回転する

Flash 5スタイルでのアニメーションの処理は、onClipEvent(enterFrame)イベントハンドラアクションに書くのが定石です。MovieClipインスタンスの角度は、MovieClip._rotaionプロパティに度数で設定します。インスタンスから見たマウス座標は、MoiveClip._xmouse/MovieClip._ymouseプロパティで調べることができます。

座標から角度を取得するには、Mathクラスの関数を使って簡単な計算をする必要があります。この処理は使い回しをする想定で、関数(function)getAngle()としてメインタイムラインに定義することにします。このfunction定義は後で行います。すると、マウスポインタを追いかけて回転するインスタンスには、つぎのようなMovieClipアクションを設定すればよいでしょう*2 *3。

スクリプト01-001 マウスポインタに追随してインスタンスを回転するMovieClipアクション

// MovieClip: マウスを追いかけて回転するインスタンス
// MovieClipアクション
onClipEvent (load) {
  var nDeceleration:Number = 0.2;
}

onClipEvent (enterFrame) {
  var nDegree:Number = _root.getAngle(_xmouse, _ymouse);
  _rotation += nDegree*nDeceleration;
}

メインタイムラインには、つぎのようなフレームアクションで関数getAngle()を定義します。関数getAngle()は、引数に渡されたxy座標から角度を計算して、度数の値を返します。

座標から角度を取得するには、Math.atan2()メソッドを用います。このメソッドには、注意点がふたつあります。第1に、引 数の順序が、y座標、x座標となることです。第2に、返される角度はラジアン値です。ラジアン値に掛合わせて度数に変換するための比率は、定数(変数) RADIAN_TO_DEGREEとして設定しておくことにします*4。

スクリプト01-002 xy座標から度数値を返す関数getAngle()の定義

// タイムライン: _level0
// 第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;
}

これで、サンプルスクリプトは完成です。[制御] > [ムーピープレビュー]で、MovieClipアクション(スクリプト01-001)を設定したインスタンスが、マウスポインタを追いかけて回転します。 なお、スクリプト01-001にはイーズアウトのための係数nDecelerationを回転角nDegreeに乗じていますので、減速しながらアニメー ションすることになります(注釈[*3]に引用のドキュメント参照)。

ただ、残念ながら現在公開されているActionScript 3.0の仕様では、インスタンスにスクリプトを記述することができません。したがって、この処理をフレームアクションに移行する必要があります。

*2 本稿ではActionScript 1.0スタイルのスクリプトについても、ActionScript 2.0の厳密な型指定を用いることにします。変数に対しては、その宣言時にデータ型を指定します。

var 変数名:データ型;

また、関数(function)の引数や戻り値についても、データ型を指定することができます。

function 関数名(引数:データ型):戻り値のデータ型 {
   ステートメント;
}
なお、厳密な型指定について詳しくは、Flash 8オンラインヘルプ[ActionScript 2.0の学習] > [データおよびデータ型] > [データ型について] > [データ型の割り当てと厳密な型指定について]およびFlash ActionScript入門ノート「厳密な型指定」をご参照ください。

*3 マウスポインタに追随してインスタンスを回転するスクリプトについて詳しくは、F-siteセミナー「MovieClipのターゲットパスとプロパティ」をご参照ください。

*4 Math.atan2()メソッドやラジアン、三角関数などの意義と考え方については、Flash TechNote「角度と座標の計算 － Flash の三角関数を使う」をご参照ください。

ページ 2 / 7
前のページ
次のページ