PONOS Advent Calendar 2019の18日目の記事です。
昨日は @nisei275さんのRustとWebSocketで実現したリアルタイム通信環境にUnityで通信してみるでした。
はじめに
DOTweenとは
DOTweenとはUnityで使用できる線形補間ライブラリ 自分が神アセットだと思うアセットの１つです。
読み方は「ドットゥイーン」
無料版と有料版のProがあります。
公式：http://dotween.demigiant.com/
AssetStore：https://assetstore.unity.com/packages/tools/animation/dotween-hotween-v2-27676
DOTweenを触るようになったきっかけ
かなり前の話ですが、cocos2d-xをメインにゲームを作っていました。
そんなcocos2d-xですが、標準でCocosActionという線形補間ライブラリが内蔵されています。
こんな感じのやつです。
autoenemySprite=Sprite::create("enemySprite.png");automoveTo=MoveTo::create(2,Vec2(50,0));enemySprite->runAction(moveTo);cocos2d-xからUnityをメインに触るようになってから iTween -> DOTween を使用してきました。
前置きが長くなりましたが今回はそんな神アセット「DOTween」の使用法をご紹介をしたいと思います。
導入 -> 初期設定
・AssetStoreでDOTweenを入手 -> インポート
https://assetstore.unity.com/packages/tools/animation/dotween-hotween-v2-27676
・Setupタブ
こちらでセットアップができます。
・Preferenceタブ
こちらで初期設定が変更できます。
AutoPlayと初期EaseをLinearに変えておくと自分はやりやすかったです。
実装
Tweenの再生
Tweenの単発再生です。
usingUnityEngine;usingDG.Tweening;publicclassTestTween:MonoBehaviour{// 現在再生中のTweenTweencurrentPlayTween;// 開始時voidStart(){PlayMoveTween();}// Tweenの再生voidPlayMoveTween(){// 移動時間floatduration=2f;// 移動値Vector3endValue=newVector3(10,10,0);// Tweenの作成currentPlayTween=transform.DOMove(endValue,duration);// 相対に切り替えcurrentPlayTween.SetRelative();// イーズタイプの指定currentPlayTween.SetEase(Ease.Linear);// 再生currentPlayTween.Play();}}結果
上記のコードでは２秒間で現在位置から(10, 10, 0) の距離を移動します。
SetRelative()をつけると絶対位置から相対位置になります
Sequence ~ Tweenの連結 ~
Tweenを連結し、より複雑なことができます
usingUnityEngine;usingDG.Tweening;publicclassTestSequence:MonoBehaviour{// 現在再生中のSequenceSequencecurrentPlaySequence;SpriteRendererspriteRenderer;// 開始時voidStart(){spriteRenderer=GetComponent<SpriteRenderer>();PlaySequence();}// Sequenceの再生voidPlaySequence(){// 移動時間floatmoveDuration=1f;// 移動の最終値Vector3moveEndValue=newVector3(10,10,0);// 待機時間floatwaitDuration=1f;// 透過時間floatfadeDuration=1f;// 透過最終値floatfadeEndValue=0f;// 移動Tweenの作成TweenmoveTween=transform.DOMove(moveEndValue,moveDuration).SetRelative().SetEase(Ease.Linear);// 透過Tweenの作成TweenfadeTween=spriteRenderer.DOFade(fadeEndValue,fadeDuration);// Sequenceを生成currentPlaySequence=DOTween.Sequence();// Sequenceの構築currentPlaySequence.Append(moveTween).AppendInterval(waitDuration).AppendCallback(()=>Debug.Log("AppendCallback()")).Append(moveTween).Join(fadeTween);// 再生currentPlaySequence.Play();}}Append(tween) ... Tweenの連結再生Join(tween) ... Tweenの同時再生AppendInterval(float) ... Tween終了時に空白の時間を設けるAppendCallback(action) ... Tween再生時にコールバックを追加します
結果
１秒かけて(10, 10, 0)移動し、１秒間待機し、ログを出し、１秒かけて(10, 10, 0)移動しながらアルファを０にします。
任意の数値を線形補間する
// 時間floatduration=1f;// 最終値intendValue=100;// 現在の値intcurrentValue=0;// Tweenの生成currentPlayTween=DOTween.To(()=>currentValue,value=>currentValue=value,endValue,duration);currentPlayTween.OnUpdate(()=>Debug.Log(currentValue));// 再生currentPlayTween.Play();結果
１秒かけて任意の変数の値が 0 から 100 になります
時間のカウントダウンなどに便利です
コールバック
特定のタイミングで処理を挟むこともできます
// 移動時間floatduration=1f;// 移動の最終値Vector3endValue=newVector3(10,10,0);// Tweenの生成currentPlayTween=transform.DOMove(endValue,duration).SetRelative().SetEase(Ease.Linear);// ループの指定currentPlayTween.SetLoops(-1,LoopType.Incremental);// コールバック群currentPlayTween.OnPlay(()=>Debug.Log("OnPlay()"));currentPlayTween.OnUpdate(()=>Debug.Log("OnUpdate()"));currentPlayTween.OnKill(()=>Debug.Log("OnKill()"));currentPlayTween.OnPause(()=>Debug.Log("OnPause()"));currentPlayTween.OnComplete(()=>Debug.Log("OnComplete()"));currentPlayTween.OnStepComplete(()=>Debug.Log("OnStepComplete()"));// 再生currentPlayTween.Play();OnPlay() ... 再生した時OnUpdate()... 数値が変わった時OnKill() ... 破棄した時OnPause() ... 一時停止した時OnComplete() ... 完了した時OnStepComplete() ... ループなど一節が完了した時
Tweenの破棄
if(currentPlayTween!=null){// Tweenの破棄currentPlayTween.Kill();currentPlayTween=null;}Tweenに対してKill()を呼んでやることでTweenを破棄できます
おわりに
基本の使い方は以上です
そして今回ご紹介したTweenはほんの一部です
もしDOTweenに興味が出たらいろいろ調べて触ってみてください('ω')
明日は @FW14Bさんです！