AS3.0 への移植 Hopper(2)
2007/07/14 23:53 - tweener
Tweener を使ったモーションタイポの作成、Hopper 編の続きです。
非線形トゥイーンへのアプローチ。まずは一つめ。
トゥイーンの過程を二つに分解する
まずは Tweener 開発者 Zeh さんのブログの、以下のエントリーに掲載されている、1番目のサンプルを見てください。
各アイテムは、動いている間はブラーがかかりますが、止まるとブラーが解除されます。
どうすればこうなるのかというと、ソースをダウンロードして fla ファイルに記述されているコードを見れば分かりますね。
トゥイーンの開始から終了までの時間を二分して、二つの addTween を登録しているわけです。
- 前半：ブラー無→ブラー有
- 後半：ブラー有→ブラー無
このように二つの addTween を連続で実行することにより、トゥイーンしている間だけブラーがかかるという、非線形的なブラーのトゥイーンを実現しているのです。
で、その手法を利用した Hopper のテストサンプルが以下のものです。
- MotionEngine.as（ 2.51 KB ）
MotionEngine.as 以外のファイルは、前回アップしたソースのものがそのまま使えます。
んー。何かこう面白みに欠ける動きですね。 ダイナミックさが足りないというか……
実はこのサンプル、二分割した最初の addTween の到達座標は、下記模式図のような感じで、始点と終点の中間地点に設定されています。
つまり座標移動は線形になっているわけで、これがイケてないモーションになっちゃってる理由かも知れません。
んなわけで、座標について別な試みをおこなってみたサンプルが次のものです。
- 002_01.zip（ 2.18 KB ）
この圧縮ファイルには Main.as と MotionEngine.as が含まれています。それ以外のファイルは、前回アップしたソースのものがそのまま使えます。
このサンプルでは、最初の addTween の座標到達値をステージ上のランダムな位置にしています。
ビリヤードの球みたいな動きで、これはこれで面白いんですが、Hopper からは何か離れていってしまった感じがします。
次回はもう一つのアプローチ。_beizer プロパティの使用についてです。
