2009年10月10日土曜日

ロールオーバーで反転するFlash

初歩的なことですが備忘録として。

0

→サンプル

まず新規でムービークリップ(名前は任意)をひとつ作ります。

丸を描画して、そいつがくるっと反転しているような動きをタイムラインで作ります。
1.丸の描画(仮に直径200)
2.モーショントゥイーンの作成
3.5フレーム目にキーフレームの挿入
4.5フレーム目の丸を幅「0」に変形
5.10フレーム目にキーフレームの挿入
6.10フレーム目の丸の幅数値を元に戻して(200)、色を変更

ここまでで閉じてくるっと反転したようなうごきになります。

今回のサンプルはロールアウトしたら元の色に戻りようにしたいので
同様の方法で色を元にもどす動きを同じフレームで作る。下記のような感じ。

1

このままだとずっとクルクルまわるだけなので、actionscriptを記述。

as用のレイヤーを作って1フレーム目と10フレーム目に stop(); と記述。

続いてロールオーバー、ロールアウトで動くようにしたいので透明ボタンの追加。
ボタン用レイヤーを作って丸の大きさの透明ボタンの配置。
透明ボタンに対して以下のactionscriptを記述。

on (rollOver) {  //ロールオーバー時の動き
if (_currentframe > 10) {  //10フレーム以下の時にロールアウトしたら
gotoAndPlay(20-_currentframe);  //20-(ロールアウトしたフレーム数)に移動
} else {  //そのほかの場合は
gotoAndPlay(2);  //2フレーム目に移動
}
}
on (rollOut) {
if (_currentframe < 10) {
gotoAndPlay(20-_currentframe);
} else {
gotoAndPlay(10);
}
}

フレームはこんな感じ。

2

ひとつのパーツとして使って
全体的に面白そうなFlashが作れそうですね。

0 件のコメント:

コメントを投稿