WEBmoraオフィシャルサイト
Flash: 2008年8月アーカイブ
ある雑誌を参考に、ActionScript3.0で便利な『Tweener』をちょこっと使ってみました。これがあるとFLASHで細かい動きをいろいろと設定するのにだいぶラクになりそうです①新規フォルダ「testProject」を作り、その中に「test.fla」を作成。②「test.fla」を保存した同じ階層に「src」という空フォルダ作成。③http://code.google.com/p/tweener/からTweenerをダウンロード。④解凍して「caurina」フォルダを②の「src」フォルダに入れる。⑤「test.fla」を開いて好きな画像を描く。⑥画像をシンボル化「mc1」とインスタンス名をつける。⑦タイムライン上のフレームスクリプトに下の2行のコードを記述。
import caurina.transitions.Tweener;Tweener.addTween(mc1,{x:300});
赤いラインを引いた2行目が実際の動きになります。この2行目だけ下のものと書き換えていろいろ試してみました。Tweener.addTween(mc1,{x:300,time:1}); ←x=300の位置に1秒かけてスライド移動Tweener.addTween(mc1,{x:300,y:250,width:200,time:1}); ←横幅を変化させつつ斜めに移動。Tweener.addTween(mc1,{x:300,time:1,transition:"easeOutBounce"}); ←終点で跳ねるような動き。Tweener.addTween(mc1,{x:300,time:1,transition:"easeOutback"}); ←終点で戻るような動き。
などなど。30FPSですごく滑らかな動きが実現します。使いこなせれば頭でイメージした動きを確実に表現できるかも詳しくはWEBDesigning8月号を参考にしてください。
Tweener
ある雑誌を参考に、ActionScript3.0で便利な『Tweener』をちょこっと使ってみました。
これがあるとFLASHで細かい動きをいろいろと設定するのにだいぶラクになりそうです
①新規フォルダ「testProject」を作り、その中に「test.fla」を作成。
②「test.fla」を保存した同じ階層に「src」という空フォルダ作成。
③http://code.google.com/p/tweener/からTweenerをダウンロード。
④解凍して「caurina」フォルダを②の「src」フォルダに入れる。
⑤「test.fla」を開いて好きな画像を描く。
⑥画像をシンボル化「mc1」とインスタンス名をつける。
⑦タイムライン上のフレームスクリプトに下の2行のコードを記述。
import caurina.transitions.Tweener;
Tweener.addTween(mc1,{x:300});
赤いラインを引いた2行目が実際の動きになります。
この2行目だけ下のものと書き換えていろいろ試してみました。
Tweener.addTween(mc1,{x:300,time:1}); ←x=300の位置に1秒かけてスライド移動
Tweener.addTween(mc1,{x:300,y:250,width:200,time:1}); ←横幅を変化させつつ斜めに移動。
Tweener.addTween(mc1,{x:300,time:1,transition:"easeOutBounce"}); ←終点で跳ねるような動き。
Tweener.addTween(mc1,{x:300,time:1,transition:"easeOutback"}); ←終点で戻るような動き。
などなど。
30FPSですごく滑らかな動きが実現します。使いこなせれば頭でイメージした動きを確実に表現できるかも
詳しくはWEBDesigning8月号を参考にしてください。