ささきち流 Suzuka & ParaDraw 講座
Suzuka & ParaDraw
TOP
PROFILE
ActionScript Editor
LINK
BBS


フリーのFlash作成ソフト SuzukaParaDraw でFlashな生活を楽しもうというサイトです。
Suzuka 基礎・基本 イベントハンドラメソッド

 サンプルの作成などに使用した ParaDraw のバージョンは Ver.0.3a4, Suzuka のバージョンは Ver. 0.7.4.1 [RichEdit版] です。
 青っぽい鈴をマウスで色々さわってみてください。

 

 前にも見たようなパターンのサンプルだと思われる方もいらっしゃると思いますが,on ハンドラ とほとんど同じパターンのものです。

  イベントハンドラメソッド とは,簡単に言うと,「ボタンやスプライトに直接書く on ハンドラ や,onClipEvent ハンドラ のアクションフレームに書く版」のスクリプトです。
 厳密には,もっと違うものが増えていたり,onClipEvent (load) の フレーム版 MovieClip.onload = function() のように,「普通は使えなくて使えてもかなり場合が限られているか,元々使う必要はない。」ようなものも含まれるため,単純には,「ボタンやスプライトに直接書く on ハンドラ や,onClipEvent ハンドラ のアクションフレームに書く版」とは言いきれない部分もありますが,存在的にはそういうものととらえてもらうとわかりやすいと思います。

 例えば,on (release) {} をフレームに書く場合は普通,
  ボタンやスプライト.onRelease = function() { };
 のようになります。

 最初にボタンやスプライトなどのインスタンスが来て,その後にイベントハンドラメソッドが来て,イコール,そして無名のfunction(匿名関数)と続く場合が多いです。

 無名のfunction(匿名関数)の {} の後にはセミコロン「;」が必要です。Suzuka の場合,この無名のfunction後のセミコロンをうっかり書き忘れてエラーになる場合が多いですね。

 無名のfunctionを付けるのではなくて,名前の付いた function を先に定義しておいて,
  ボタンやスプライト.onRelease = function名;
 としても良いです。

 つまり,状況に応じて任意の場所に動的にスプライトを表示できるようになるということです。
 そのときに使うメソッドが MovieClipクラス の attachMovie() です。

 ボタンやスプライトに対して,イベントハンドラメソッドを使うメリットは,スクリプトを1箇所にまとめて書きやすくなることと,複数のイベントハンドラを for文 などで一気に定義することが可能になるということなどが挙げられます。

 上のサンプルのスクリプトは,メインのフレーム1のみです。
 その他の場所には一切スクリプトを書いていません。

 階層構造は次の通りです。

  _root
   ├ my_mc10(鈴のスプライト)
   ├ my_mc9(花のスプライト)
   ├ my_mc8(   〃   )
     〜略〜
   └ my_mc0(   〃   )

// my_mc10(鈴のスプライト)内のタイムラインを停止
_root.my_mc10.stop();
//
// 初期座標を各 my_mc0〜10 内に保存
for (i=0; i<=10; i++) {
	_root["my_mc"+i].o_x = _root["my_mc"+i]._x;
	_root["my_mc"+i].o_y = _root["my_mc"+i]._y;
}
//
// my_mc10を○○したとき
_root.my_mc10.onPress = function() {
	this.my_txt.text = "押す\nonPress";
	this.gotoAndStop(1);
};
_root.my_mc10.onRelease = function() {
	this.my_txt.text = "離す\nonRelease";
	this.gotoAndStop(2);
};
_root.my_mc10.onReleaseOutside = function() {
	this.my_txt.text = "外側で離す\nonReleaseOutside";
	this.gotoAndStop(1);
};
_root.my_mc10.onRollOver = function() {
	this.my_txt.text = "ロールオーバー\nonRollOver";
	this.gotoAndStop(2);
};
_root.my_mc10.onRollOut = function() {
	this.my_txt.text = "ロールアウト\nonRollOut";
	this.gotoAndStop(1);
};
_root.my_mc10.onDragOver = function() {
	this.my_txt.text = "ドラッグオーバー\nonDragOver";
	this.gotoAndStop(1);
};
_root.my_mc10.onDragOut = function() {
	this.my_txt.text = "ドラッグアウト\nonDragOut";
	this.gotoAndStop(2);
};
//
// 1フレーム進む時間毎に随時実行
_root.onEnterFrame = function() {
	// ステージ中央に対するマウス座標の変数化
	var m_x = Stage.width/2-this._xmouse;
	var m_y = Stage.height/2-this._ymouse;
	//
	// my_mc0〜10 に関して
	for (i=0; i<=10; i++) {
		// パスの変数化
		_mc = _root["my_mc"+i];
		// my_mc0〜10 を動かす
		_mc._x += (_mc.o_x+m_x*(i+2)/24-_mc._x)/15;
		_mc._y += (_mc.o_y+m_y*(i+2)/24-_mc._y)/15;
		//
		// iを2で割った余りが1のとき(つまりiが奇数のとき)
		if (i%2) {
			// my_mc奇数 を右回りに2度ずつ回転
			_mc._rotation += 2;
			// それ以外でiが10ではないとき
		} else if (i != 10) {
			// my_mc偶数(my_mc10以外) を左回りに2度ずつ回転
			_mc._rotation -= 2;
		}
	}
};

 _root も大きい意味でムービークリップ(スプライト)の一種です。
 ですから,_root.onEnterFrame = function() {}; のように,_root というインスタンスに対してもイベントハンドラメソッドは定義できます。

 1箇所に書けるということと,イメージ的に視点が高くなるので見通しが良くなるような気がします。

 

 

 

サンプルダウンロード
PDRファイル・CSFファイル在中
「kiso171.zip」 4.20 KB (4,301 バイト)