ActionScriptの実例

コードスニペットを利用してアニメーション用のスクリプトのテンプレートを準備し、スライダー等のコンポーネントを追加する。

準備

ステージに円を描き、シンボルに変換する。シンボル名は適当。
円のプロパティのインスタンス名を半角英数字で設定する。例えば、"ball"（これはプログラムで識別名として利用される）
コンポーネントからボタンを選択してドラッグ・アンド・ドロップし、インスタンス名として "button_clear" と設定。軌跡の消去に使用。
コンポーネントからスライダーを選択してドラッグ・アンド・ドロップし、インスタンス名を "slx" とし、コンポーネントパラメータ各種を設定。x方向の周期の調整に使用。
同様にスライダー "sly" を追加。y方向の周期の調整に使用。

アクションスクリプト

ステージの円を選択し、コードスニペットからアニメーション＞水平方向にアニメーション化を選択して挿入。フレームの更新の度に呼び出される関数の中に、図形の座標値を設定する。
アクション・ウィンドウで下記のソースコード（前半部分）のように修正。時間変数を定義し、図形の座標値を時間の周期関数として計算する。軌跡は Graphics クラスを利用して描画。
ステージのボタンを選択して、コードスニペットからイベント・ハンドラー＞マウスクリックイベントを選択して挿入。
アクション・ウィンドウで下記のソースコード（後半部分）のように修正。

Actionscriptのソースコード

（青字がプログラム、薄黒字はコメント）

/* 水平方向にアニメーション化
ENTER_FRAME イベントが発生するたびに、x プロパティを増減して、ステージの左または右方向に
シンボルインスタンスを移動させます。 

手順 :
1. アニメーションの方向は、デフォルトでは右になっています。
2. アニメーションの方向を左に変更するには、以下の数値 10 を負の値に変更します。
3. シンボルインスタンスの移動速度を変更するには、以下の数値 10 を、フレームごとに
　シンボルインスタンスを移動させるピクセル数に変更します。
4. アニメーションでは、ENTER_FRAME イベントが使用されているので、再生ヘッドが
　新しいフレームに移動するときにアニメーションが進行します。アニメーションの速度は、
　キュメントのフレームレートの影響も受けます。
*/
/* 
movieClip_1.addEventListener(Event.ENTER_FRAME, fl_AnimateHorizontally);

function fl_AnimateHorizontally(event:Event)
{
	movieClip_1.x += 10;
}
このコードスニペットの定型文をコメントアウトして、下記のように修正します。
*/

// ball インスタンスの x, y 座標の軌跡を描く準備をします。
var g:Graphics = this.graphics; // 図形描画オブジェクトを設定
g.lineStyle(2, 0xFF0000, 0.7); // 軌跡の直線形状、色を設定
g.moveTo(ball.x, ball.y); // 軌跡の始点を ball の初期座標に設定

// 時間を表す変数を定義します。
var t=0;

// function の名前を実行内容に相応しい名前に変更します。
// （変更しなくても動作します。他の function と区別できれば OK です。）
ball.addEventListener(Event.ENTER_FRAME, fl_Animation);

function fl_Animation(event:Event)
{
	// ball の座標を時間の関数として計算します。
	// 時間の係数をユーザがスライダー slx, sly の値 value で変更できるようにします。
	t += 0.1; // 単位時間当たり、10フレームを描画すると仮定。秒の単位とは無関係。
	ball.x = 275 + 100 * Math.sin(t * slx.value * 0.02); // slx.value はスライダー入力
	ball.y = 200 + 100 * Math.sin(t * sly.value * 0.02); // sly.value はスライダー入力
	g.lineTo(ball.x, ball.y); //前回の位置から今回更新された位置まで直線を描く
}



/* マウスクリックイベント
特定のシンボルインスタンス上でクリックすると、独自のカスタムコードを追加できる関数が実行されます。

手順 :
1. 以下の「// カスタムコードを開始」と記述された行の後ろに新しい行を挿入して、カスタムコードを追加します。
シンボルインスタンスをクリックすると、コードが実行されます。
*/

button_clear.addEventListener(MouseEvent.CLICK, fl_MouseClickHandler);

function fl_MouseClickHandler(event:MouseEvent):void
{
	// カスタムコードを開始
	// このコード例では、出力パネルに "マウスクリック" という用語が表示されます。
	//trace("マウスクリック");　この文の実行は不要なので、コメントアウト。削除してよい。
	g.clear();
	g.moveTo(ball.x, ball.y);
	g.lineStyle(2, 0xFF0000, 0.7);
	// カスタムコードを終了
}


// スライダーの値を表示する場合は、コンポーネントの Label を追加し、
// そのプロパティ text にスライダーのプロパティ value を文字列に変換して代入。

label_slx.text = String(slx.value); // 
label_sly.text = String(sly.value);

// 代入文は function fl_AnimateHorizontally(event:Event) の中で実行することも可能だが、
// 全フレームで実行を繰り返すのは無駄なので、スライダーイベントの発生時に行うのが適切。
// ただし、コードスニペットは用意されていないので、ActionScript API リファレンスガイドを参照して、
// 下記のように記述することが必要。

import fl.events.SliderEvent; 

slx.addEventListener(SliderEvent.CHANGE, fl_x_MouseOutHandler);

function fl_x_MouseOutHandler(event:SliderEvent):void
{
	label_slx.text = String(slx.value);
}

sly.addEventListener(SliderEvent.CHANGE, fl_y_MouseOutHandler);

function fl_y_MouseOutHandler(event:SliderEvent):void
{
	label_sly.text = String(sly.value);
}

Actionscript の実例

リサージュ模様

準備

アクションスクリプト

Actionscriptのソースコード