[ AS3 ] TweenMax.sequenceかわいいよ - 08/08/12 14:46
AS2だとFuseにpushしていけば、このトゥイーンが終わったら次はこれ、というように自然に流していけたけど、AS3でトゥイーン系のクラスはFuseに比べると使い勝手がイマイチ悪い、
そんな風に思ってた時期が私にもありました。
TweenMax.sequence を使えば割と（あくまで割と、なんだけど）解決。勉強不足っぷりを発揮してしまったよ。
まずAS2でFuseを使ったサンプルを以下に。
var fuse = new Fuse();
fuse.push({target:mc, _x:100, time:1, ease:"easeInOutCubic"});
fuse.push({target:mc, _y:100, time:1, ease:"easeInOutCubic"});
fuse.push({target:mc, _alpha:0, time:1, ease:"linear"});
fuse.start();
x座標を100まで1秒、その後y座標を100まで1秒。最後にアルファを1秒かけて0にして終了という、3動作のごく普通のトゥイーン。
これをAS3、TweenMaxで書くと
TweenMax.to(mc1, 1, {x:100, ease:Cubic.easeInOut});
TweenMax.to(mc1, 1, {y:100, delay:1, overwrite:false, ease:Cubic.easeInOut});
TweenMax.to(mc1, 1, {alpha:0, delay:2, overwrite:false, ease:Linear});
と、こんな具合。AS2でのZigoEngine.doTweenを並べるのと同じ。
前の動作のtimeとdelayを計算して、それを新しいトゥイーンのdelayに設定しないといけないので、調整する時に面倒。
overwriteはFuseのautoStopみたいなもんで、そのトゥイーンで前までのトゥイーンを上書き(中止)するかの設定で、デフォルトがtrue。なので、上の例でoverwriteをfalseにしないと最後のアルファのトゥイーンしか動かなくなる。
これを簡単に設定できるTweenMax.sequenceを使った例が以下。
TweenMax.sequence(
mc1,
[
{time:1, x:100, ease:Cubic.easeInOut},
{time:1, y:100, ease:Cubic.easeInOut},
{time:1, alpha:0, ease:Linear}
] );
まずターゲットを指定して、動作の部分は後に続く配列に突っ込んである。
Fuseのpushとなんとなく似てる、ってかそのものか。
delayの計算をしない分、調整が楽になる。改行をちゃんとすればきっと見やすくもなるはず。
欠点があるとすれば、あるターゲットについてしか設定できないことだろうか。上の例だとmc1についてしか設定できない。
んで、それも解決できていたりする。複数ターゲットのシーケンス設定がTweenMax.multiSequence
TweenMax.multiSequence(
[
{target:mc1, time:1, x:100, ease:Cubic.easeInOut},
{target:mc1, time:1, y:100, ease:Cubic.easeInOut},
{target:mc1, time:1, alpha:0, ease:Linear}
] );
ZigoEngine.doTweenに配列を突っ込む様なものね。
マルチなシーケンスなので、もともとは複数のターゲットにシーケンス設定をするもの（asファイルにもそう書いてあった）だけど、例の様にターゲットを全部同じにすることも勿論できる（あまり意味は無さげだけど）。
と、こんな感じで出来たので今の所はTweenMaxで不自由なし。
ただ、FuseはObjectのみならず、Objectの配列をpushできていたので、そういう事をしたいときにどうすんべ、と思ったりする。sequenceの引数配列は1次元限定のようだし。
この辺は必要になったときに色々考えるとするよ。でもきっと力技で強引に行くんだと思う。
だからその前にバージョンアップされることを期待するよ。
« [ AS3 ] removeEventListenerと無名関数 | ブログトップ | [ コミケ74夏 ] コミケ74、2日目雨なのか? »
トラックバックURL :