バージョンアップで新しくなった Tween24.serial() / parallel() を試してみた

2012.10.11

バージョン2.0 から Tween24.serial() と parallel() の仕様を少し変更しました。
またちょっと便利になったと思うので紹介します。

引数にトゥイーンの配列を渡す

引数にトゥイーンの配列を渡すと、内部で展開するようになりました。
例えば、下記のように

var tweenList:Array = [
  Tween24.prop(target).xy(0, 0).fadeOut(),
  Tween24.tween(target, 1).fadeIn(),
  Tween24.tween(target, 1).xy(100, 100)
];
			
Tween24.serial(
  Tween24.addChild(this, target),
  tweenList,
  Tween24.removeChild(target)
);

と書くと内部的には、

Tween24.serial(
  Tween24.addChild(this, target),
  Tween24.prop(target).xy(0, 0).fadeOut(),
  Tween24.tween(target, 1).fadeIn(),
  Tween24.tween(target, 1).xy(100, 100).
  Tween24.removeChild(target)
);

という風に解釈するようになりました。

Tween24.parallel() の新しい使い方

内部的な細かい仕様の話になりますが、以前まで parallel() は
「一番 time の長いトゥイーンが完了したら complete する」
という仕様になっていましたが、
「全ての子のトゥイーンが完了したら complete する」
という仕様に変更しました。

これにより、例えば parallel() に複数の Tween24.waitEvent() や Tween24.funcAndWaitEvent() を入れることで、「複数のイベントの待機」といったようなことができるようになりました。

下のサンプルでは2枚の画像を読み込み、完了するのを待って表示のトゥイーンを再生するということを1つのserial トゥイーンで実現しています。

Tween24 v2.0 released – wonderfl build flash online

var logo01:Loader = new Loader();
var logo02:Loader = new Loader();
			
Tween24.serial(

  // Wait image load
  Tween24.parallel(
    Tween24.funcAndWaitEvent(logo01.contentLoaderInfo, Event.COMPLETE, logo01.load, url1),
    Tween24.funcAndWaitEvent(logo02.contentLoaderInfo, Event.COMPLETE, logo02.load, url2)
  ),

  // Init
  Tween24.prop(logo01).$y(-80).blurY(64).fadeOut(),
  Tween24.prop(logo02).$x(40).blurX(64).fadeOut(),
  Tween24.prop(text).fadeOut(),
  Tween24.addChild(this, logo01, logo02, text),

  // Tween
  Tween24.wait(0.5),
  Tween24.tween(logo01, 0.4, Ease24._BounceOut).$y(0).blurY(0).fadeIn(),
  Tween24.wait(0.2),
  Tween24.tween(logo02, 0.4, Ease24._6_ExpoOut).$x(0).blurX(0).fadeIn(),
  Tween24.wait(0.5),
  Tween24.tween(text, 0.6).fadeIn()
).play();

大きな変更ではないですが、またちょっと痒いところに手が届くようになったかなと思います。

There are 5 comments in this article:

10/22/2012tsa says:

はじめまして
http://wonderfl.net/c/39ov
上記スクリプトをTween24_2.0.1で再現しているのですが、Tweener.removeAllTweens();の変わりにTween24.stopAllTweens();を実行しても、再生中のTween24.tween(略).play();が止まりません。
Tween24.stopAllTweens();はどのような使い方をするのが正しいのでしょうか？
10/22/2012Atsushi Kaga says:

tsaさん、はじめまして。
Tween24.stopAllTweens() ですが、恐らく最後に play() で実行していないのではと思います。
「stop」を「play」するという、なんともややこしい感じなのですが、基本的に Tween24 のメソッドは play() を呼び出して実行するという形で統一しています。
fork して Tween24 版に書き換えてみましたので、よかったら参考にしてみてください。
http://wonderfl.net/c/ic6X
10/23/2012tsa says:

Kaga様返信ありがとうございます。
play()が必要だったんですね、あまり良く調べず質問していまい申し訳ありませんでした。
わざわざサンプルまで用意していただき助かりました。
Tween24を頑張って使っていきたいと思います（＾＾）
ありがとうございました。
12/19/2012yamadori says:

はじめまして。
ver2.0から加わったフレーム駆動のためのtweenCountファンクションですが、
時間駆動のtweenファンクションと対をなすように、こちらのファンクションにもターゲットを配列で渡せるという認識でよろしいでしょうか。
自分が検証したところ、tweenCountにターゲットを配列で渡すと、
1)　tweenが目標値まで達しない状態で終わる。
2)　serialが機能していない。(loop, parallelは未検証)
という現象を確認しました。
これらは仕様でしょうか？もしくはバグでしょうか？

http://wonderfl.net/c/aqq3
12/19/2012Atsushi Kaga says:

yamadoriさん、はじめまして。
こちらの現象ですが、恐らく何かしらのバグでserial内のtweenのcompleteが送信されず、途中で止まってしまっているのかと思われます。
詳しい原因はまだ調査できていませんが、修正したいと思います。
ご報告助かります、ありがとうございます。

package a24