Assetアドベントカレンダー参加記事!
本日9日目!
8日目の,揺れものアセット 未開拓編,を書かれた汗人柱さんからバトンを受け取った,
www.asset-sale.net
Assetアドベントカレンダー参加記事!
assetstore.info
明日9日目は,たぬさんの MeshEffectsを使って、Vroidモデルに武器を持たせて動かし撮影しよう！,です!
twitter.com
この記事はなに?
ShapesとDOTweenを使ってお手軽モーショングラフィックス.
お手軽にShapesをアニメーションするためのテンプレスクリプトも,簡単ですが掲載しています.
モーショングラフィックスがしたい!
ご本人の許可を得て,低レベルですが頑張ってできる範囲の真似をしました
ヤバさがやばい……無限の鍛錬の故だなって思いました
公開してくださっているので一部答え合わせだ……!(Fadeは特に許して……) https://t.co/Ca5DLhs5uG pic.twitter.com/9oFcOC7S4o— vail(kako)🎶⛅ (@kako_vail) 2021年7月4日
したいよね!
でも,既存のImageやSpriteだと,Pivot調整や,自分の中の｢UIは動かすと重いぞ｣おじさんがささやいたり,なにかと面倒なことが起こる……そんなあなたにおすすめのAssetと,かの有名なDOTweenの組み合わせの紹介です!
今回使うAsset
Shapes
DOTween
無料
assetstore.unity.com
有料(おすすめですが,今回は無料のDOTweenで動くことしかしません!)
assetstore.unity.com
紹介
Shapes
独自のComponentで,軽量に図形を描画できます.
UIではないので注意,かつおすすめです.
文字で書くより見たほうが早いと思うので…….
まずHierarchyに,例えばRingを追加してみましょうか……そうしたら
お手軽にこんなことができます.もう恐ろしいですね.
通常のImageのFillAmount等だと,Transformを回転させつつAmountを変えて……など,ちょっと難しい,○度から△度,みたいな挙動がかんたんにできます.
これとDOTweenを組み合わせると,標準だとちょっと大変なこんな挙動が手軽にできます.
DiscとLine
DiscをDashedに設定
DOTween
こちらは,言わずもがなというか,多くの人が紹介されているので,今回は詳しく書きませんが,こちらと組み合わせることで本当に無限のことができます.
上記Gifでは,DOVirtual.Float(),もしくはDOTween.To()等を使って実現できます.
こういった用途以外にも｢○秒かけて■を△する｣ときには大万能のAssetです!有料版だと,スクリプトなしでEditorで設定できたり,TextMeshProの文字送り等に対応しています!
(余談ですが,かつては｢○秒かけて■を△する｣に文字送りまで含まれるとは夢にも思っていませんでした.DOTween強い)
実例
最近はほぼほぼこのAssetのみで見た目が構成されている,こんなのを作り始めました.
以前作った,Shapes+DOTweenの補助スクリプトのおかげでもあるのですが,実作業としては8時間以内にこんな感じになりました.すごいかどうかはわからないですが……
演出の実装はほぼ0です.数値を決めるだけ.
昨晩から作り始めた一人開発のほうの進捗です pic.twitter.com/b6VxCCpGC9
— vail(kako)🎶⛅ (@kako_vail) 2021年7月31日
お手軽モーション作成テンプレ
スクリプト
先述した,自作の補助スクリプト群のコア部分一つだけ抜き出してみました.そのままだと,一般的に全く使いやすくないので…….
ShapesとDOTweenが入っているプロジェクトで使ってあげてください.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<span class="synStatement">using</span> DG.Tweening; <span class="synStatement">using</span> Shapes; <span class="synStatement">using</span> UnityEngine; <span class="synType">namespace</span> Motions.Scripts { <span class="synType">public</span> <span class="synType">class</span> ShapesWithDOTween : MonoBehaviour { <span class="synComment">// ここの対象をDisc→Lineにしたり,floatをVector3にしたりすれば他でも使える</span> [SerializeField] <span class="synType">private</span> Disc _disc; [SerializeField] <span class="synType">private</span> <span class="synType">float</span> _destinationFloat; [SerializeField] <span class="synType">private</span> <span class="synType">float</span> _duration; [SerializeField] <span class="synType">private</span> Ease _easeType; <span class="synComment">// publicにして,Manager等を作って一括で呼んだり?自由に!</span> <span class="synType">public</span> <span class="synType">void</span> Move() { DOTween.To( () => _disc.AngRadiansStart, (x) => _disc.AngRadiansStart = x, _destinationFloat, _duration) .SetEase(_easeType); } } } |
使い方
画像内の通りにパラメータを設定して,Move()を呼び出してあげるとこうなります.Discは上で使ったものに,そのまま上のスクリプトをくっつけています.
最後に
結構手軽に,玄人が苦労してる実装がスキップできちゃう!!!!!!
(玄人がこれを使ったら更に神になってしまうのは内緒です)
神Assetです.値段自体はしますが,実際に使ってみたところ全然高く思いません.最高.
是非使ってみてください.