【Unity】Tween アニメーション（DOTween）の話

unity UnityAdventCalendar2016

はじめに

はじめまして。 カヤックのソーシャルゲーム事業部の Unity エンジニアの高です。
今回は Unity の DOTween ライブラリーについて紹介します。
この記事はカヤック Unity アドベントカレンダー 2016 の 16 日目の記事です。

DOTween について

Unity で UI のアニメーションを作る時に、Animator と Animation パネルで作るのが普通ですが、安定、高速が必要な場合はスクリプトでアニメーションを書く必要も出てくるのです。この時には DOTween を使ってみましょう。

インストール

DOTween は Unity の無料プラグインで、ホームページをご覧の上、ダウンロードして、プロジェクトに導入してみましょう。

使い方

DOTween は複雑なライブラリーではなく、とっても簡単に使えます。例えば GameObject を動かしたい場合：

gameObject.transform.DOMove(new Vector3(2,2,2), 1);

1行で完成。

なお、DOMove は DOTween のショートカットなので、実際に実行されるのがこれです：

DOTween.To(
    () => gameObject.transform.position, // getter
    x => transform.position = x, // setter
    new Vector3(2,2,2), // to
    1 // duration
);

DOMove 以外でもいろいろショートカットがあります。

// RectTransform をシェーク
rectTransform.DOShakeAnchorPos(1f);

// SpriteRenderer の色をアニメート
sprite.DOColor(new Color(1f, 0.5f, 0f), 1);

すべてのメソッドが、ここに記載されております。ページを開きながらアニメーションスクリプトを書くと便利なんです。

Sequence

複雑なアニメーションを作る時に、複数のプロパティーを並列または時間を見て操作する必要がよくあります。この場合 Sequence がよく使われています。詳しい使い方はドキュメントを見るといいでしょう。
DOTween - Creating a Sequence

AnchoredPosition

特に注意する必要があるのが、RectTransform を動かしたい場合です。
RectTransform は Anchor を元にゲームオブジェクトの位置を決定してるから、Transform で動かすと、予想外の結果になるので、動かす時は必ず RectTransform の DOAnchorPos を使うようにしてください。

実は、アニメーションで位置を変える時だけでなく、RectTransform の位置を変えたい場合は、基本 anchoredPosition をいじるのが安全です。

Easing

アニメーションの再生にリズムをつける場合は、SetEase を使ってみましょう。
どのイージングカーブを使うかわからないときに、このサイトを参考にしましょう：
Easing Functions Cheat Sheet

Callbacks

アニメーションの再生中、再生後にコールバックをバインドするのが普通です。でも、場合によってはコールバックが呼ばれないので、注意する必要があります。

OnComplete

OnComplete でバインドしたコールバックは、アニメーションが Kill で止まる場合に呼ばれないです。呼びたい場合には、Kill(true) を使う必要があります。

Sequence.AppendCallback

AppendCallback でバインドしたコールバックは、アニメーションが Kill または Complete で止まる場合に呼ばれないです。呼びたい場合には、Complete(true) を使う必要があります。

OnKill

OnKill はアニメーションが Kill される時に呼ばれますが、実は Kill されなくても、アニメーションが Complete の時にも呼ばれますので、注意する必要があります（順番は OnComplete → OnKill）。