【Unity】UGUIでDOTweenを使ってアニメーション

Unityの新しいUIシステムであるUGUIについて勉強をしてみました。 今回は「アニメーション」についてです。 UnityのAssetStoreにある「DOTween」を使ってみました。 Unity5.01を利用しています。

DOTween

DOTween (HOTween v2) 簡単ですが、DOTweenを利用するためにアニメーションスクリプトをまとめてみました。

初期化

[c] //ネームスペース using DG.Tweening;

DOTween.Init(false, true, LogBehaviour.ErrorsOnly); [/c]

動かす - Move

[c] RectTransform image1;

//グローバルの場合 image1.DOMove(new Vector3(100,200,0),1.0f);

//ローカルの場合 image1.DOLocalMove(new Vector3(100,200,0),1.0f); [/c]

グローバル・ローカル isRelative()

上記で上げたローカル・グローバルがややこしく感じられる場合[isRelative()]を利用すれば「相対的」に動かすことができます。 [c] //見た目の位置から移動する image1.DOMove(new Vector3(100,200,0),1.0f).isRelative(); [/c]

繰り返し - SetLoops()

[c] image1.DOMove(new Vector3(100,200,0),1.0f).SetLoops(3,LoopType.Yoyo); [/c]

  • LoopType.Yoyo : 逆方向
  • LoopType.Restart : スタート位置同じ

コールバック - callback

[c] image1.DOLocalMoveX(200,2).OnComplete(hogeCallback);

void hogeCallback(){

Debug.Log("callback");

}

[/c]

連続したアニメーション - Sequence

[c] Sequence myseq = DOTween.Sequence(); myseq.Append(image1.DOLocalMoveY(100,2)); _myseq.Append(image1.DOLocalMoveY(0,2)); [/c]

同時 - Join

[c] myseq.Append(image1.DOLocalMoveY(100,2)); myseq.Join(image1.DOLocalRotate(new Vector3(0, 0, 360), 2)); [/c]

最初に実行 - Prepend

[c] //Prependで挿入したアニメーションが最初に実行される _myseq.Prepend(image1.DOLocalMoveX(200, 2.0f)); [/c]

アニメーションの追加 - Insert

指定した秒数後にアニメーションを追加することができます。 [c] _myseq.Insert(0, image1.DOLocalMove(new Vector3(200,0,0),2)); [/c]

コールバック - callback

[c] _myseq.AppendCallback(hogeCallback); [/c]

インターバル - Interval

[c] _myseq.AppendInterval(1.0f); [/c]

アニメーション時間を取得

Sequenceの時間を取得する際には、以下のような記述をします。 [c] float time = _myseq.Duration(); [/c]

最後に

cocos2dxのActionクラスのように利用できることがわかりました。 ドキュメントにはその他色々と便利なメソッド等が記載されているので、実際に利用する場合はこちらを参考にしていただければと思います。

【DOTweenドキュメント】

UnityゲームUI実践ガイド 開発者が知っておきたいGUI構築の新スタンダードUnityゲームUI実践ガイド 開発者が知っておきたいGUI構築の新スタンダード
池和田有輔,時村良平

エムディエヌコーポレーション
売り上げランキング : 7352

Amazonで詳しく見る