［Flash］イベントハンドラメソッド - くろひょうのwebデザインのお勉強帳

ボタンを押すと何かが動く、のようなイベントをつくります。

1．その前段階として、星が横に動くようにしてみます。

動きはタイムラインに直書き、ではなく、アクション用のレイヤーに書き込みます

使用するメソッドは　onEnterFrame です

f:id:pleasure10501:20150413223326p:plain

星はイラストレーターで作成して保存しておく（IllustratorとFlashのバージョンが同じ場合は、イラストレーターでコピー＆ペーストが可能）。
ファイル＞読み込み＞ステージに読み込み　をします
星をシンボルに変換します　修正＞シンボルに変換＞種類：ムービークリップ
シンボルに「星」、インスタンスに「star_mc」（mcはムービークリップ）と命名します
レイヤーを新規作成し、星のレイヤーと動き（Action）のレイヤーを分けます。
Actionレイヤーに以下のスクリプトを記述します
var star_mc:MovieClip;　・・星のインスタンスがムービークリップであると宣言
var speed:Number =10;　・・動くスピードの設定

star_mc.onEnterFrame = function() {
star_mc._x += speed;
}　　　　　　　・・星のインスタンスの動きについての関数の定義。
　　　　　　　　　　「x軸方向に１０のスピードで動く」
_x += speed　となっているので、タイムラインの１コマ目を読込む　⇒　x軸方向に10動く　⇒　タイムラインの１コマ目を読込む　⇒　x軸方向に10動く
の繰り返しで、連続的な動きとなります。

［メモ］進行方向の制御
-x軸方向（左）：　vstar_mc._x -= speed　向きが反対になるのでマイナスになる
y軸方向（下）：　star_mc._x += speed; のxをyにする
y軸方向（上）：　star_mc._y -= speed;

２．星が回る　　

今度は星が回るようにしてみます。

１と違う点：

・変数宣言　var angle : Number =10;

・star_mc._rotation : += angle;　
　_rotationはムービークリップの配置角度。つまり、angleで設定した数値分角度で傾くということ。

　　var star_mc:MovieClip;
　　var angle:Number =10;

　　star_mc.onEnterFrame = function() {
　　　star_mc._rotation += angle;
　　}　

３．ボタンを押すと星が回る

新たにボタンを付けます。ボタンを押して離した時に回るようにします（ストップはしない）

f:id:pleasure10501:20150414180452p:plain

・ボタンを追加

イラストレーターでボタン画像をつくります
ボタン用の新規レイヤーを追加
Flashで開き、シンボルに変換　＞ボタンに変換。インスタンス名を「play_btn」とする

・アクションスクリプトの書き方

①　変数宣言で、ボタンを宣言

②　インスタンスがタイムラインに読み込まれると、｛｝内の処理が呼び出される、
　　という内容の関数。この場合は「動く角度が10度」

③　ボタンがクリックされて離れた時に処理される内容を｛｝内に書いている。
　　再生タイムラインの１コマ目のstar_mcが10度動く　⇒　１コマ目を読み込む　
　　⇒10度動く　⇒　１コマ目を読み込む　・・・を繰り返す

＊　onReleaseは、厳密には「マウスをクリックして離した瞬間」の動きを指す。

var star_mc:MovieClip;
var play_btn:Button;　・・・①
var angle:Number;

this.onLoad = function() {　・・・②
angle = 10;
}

this.play_btn.onRelease = function(){　・・・③
　star_mc.onEnterFrame = function() {
　star_mc._rotation += angle;
　}
}