Starlingでアニメーション のバックアップソース(No.3) :: NJF Wiki

• 差分^[1] を表示
• 現在との差分^[2] を表示
• バックアップ No.3 を復元して編集^[3]
• Starlingでアニメーション^[4] へ行く。

*基本 [#h695bb3d]

Starlingの基本機能だけで軽量で簡単にアニメーションがつくれるが、複数アニメーションを連結する簡単な機能などはない。（出来ないわけではない。）
たとえばフェードインして少し待って平行移動して縮小するとか、複数のアニメーションを連結したりするような、ある程度複雑なアニメーションは専用のライブラリ(Tween24など)を使った方が楽。

また、Tween関係の一般的なライブラリ全般に言えるが、基本的に時間指定で実行されるので、フレーム単位で動かすゲームと同期がずれる場合がある。(Tween24など自分でアップデート出来るライブラリもある)

よって、Starlingの機能のみのアニメーションの使いどころは、フェイドイン、フェイドアウトなど、UIのちょっとしたアニメーションとかになる。

たとえば、一番よく使うアニメーションの一つ、フェイドインは以下のようになる。


 var img:Image = new Image(assets.getTexture(IMG_NAME));
 img.alpha = 0;
 addChild(img);
 var tween:Tween = new Tween(img, 0.2);
 tween.fadeTo(1);
 Starling.current.juggler.add(tween);

フェイドインしながら同時に大きさを変えたい場合は
 tween.scaleTo(2);
を加える。

TweenのonCompleteプロパティに終了時の処理を入れることが出来る。これによって連続してアニメーションする事も出来るが、tween系ライブラリに比べると面倒。

 tween.onComplete = function():void {
 	//end
 };

Tweenの初期化で第三引数にイージングを指定することも出来る。

 var tween:Tween = new Tween(img, 0.2, Transitions.EASE_IN);

Tweenインスタンスを再利用することも出来る。

 tween.reset(img, 0.2, Transitions.EASE_IN);

他にもいろいろな機能があり手軽に使えるのと、比較的軽量なのは良いところだが、複雑な物を作りたいなら専用のライブラリ使った方が良いかも知れない。

参考：
http://cuaoar.jp/2011/12/tween-starling.html

http://wiki.starling-framework.org/manual/animation

*例 [#v0ca0ef2]

フェードイン・アウトの繰り返し

 var image:Image = new Image(yourTexture);
 var tween:Tween=new Tween(image,0.2);

 private function onComplete():void {
 	tween.reset(image, 0.2);
 	tween.fadeTo(1 - image.alpha);
 	tween.onComplete = onComplete;
 	Starling.current.juggler.add(tween);
 }

使うときは
 onComplete();

とすると、アニメーションが終わるたびにimageのアルファが0なら1に、1なら0へのtweenを定義し直す事になる。
止めるときは
 Starling.current.juggler.remove(tween);

• Starlingでアニメーション のバックアップ一覧^[7]
• Starlingでアニメーション のバックアップソース(No. All)
  • 1: 2015-05-25 (月) 06:25:31^[8] njf^[9]
  • 2: 2015-05-25 (月) 07:34:53^[10] njf^[9]
  • 3: 2015-05-31 (日) 16:35:15 njf^[9]
  • 4: 2015-06-03 (水) 09:12:47^[11] njf^[9]
  • 現: 2015-06-03 (水) 22:02:06^[12] njf^[9]