週刊SleepNel新聞

SleepNel所属のぽうひろが日々の個人開発で気になったことを綴ります。

DoozyUIでUnityUIを時短de簡単に作っちゃおう!!

この記事は「Unity アセット真夏のアドベントカレンダー 2017」 4日目の記事です。

昨日は、ShowGamesさんの「Unityの素晴らしいパーティクルアセットたち(ゲーム)」でした。
showgames.blog.so-net.ne.jp

無料のパーティクルアセットがいっぱい紹介されていましたね!
パーティクルは自分も探すのに一苦労するので、とてもありがたい記事でした。(*´ω`*)

さて、私ですが、DoozyUIというUIを簡単に作れるアセットを紹介したいと思います。

こちらのアセットを使うにはDOTweenが必要です。
以下のリストからDLしてください(無料版でも動作します) 

UIを作るとき、テキストやボタンを出したり、隠したりするのって結構一から作るのは結構めんどくさかったりしますよね。
DoozyUIはその辺を簡単に作ることができます。

先日unity1weekで作った ユニティちゃんのビーチフラッグのUIで説明します。

uGUIの配置
f:id:pouhiroshi:20170803135030p:plain

結果をTweetボタンにUIElementコンポーネントをつけます。
f:id:pouhiroshi:20170803135121p:plain

最初の hide@start のチェックボックスは、初期表示時にこの部品を隠しておくかどうかの設定になります。
「結果をTweetボタン」はゲームが終わって結果が出た時に表示したいので、これにチェックをいれています。

また、ElementNameに「ResultTitle」が選んでありますが、こちらの名前をキーにして、UI部品をコントロールできます。
プログラムでは、最初にusing DoozyUI;宣言してから、
```
//UIを隠すとき
UIManager.HideUiElement("ResultTitle");
//UIを表示する時
UIManager.ShowUiElement("ResultTitle");
```
のように制御できます。

そして、表示(ShowUiElement)・非表示(HideUiElement)する時のアニメーション(IN ANIMATIONS、OUT ANIMATIONS)も
tween形式(EaseInとか)や、速さ(duration)、ディレイ(start delay)、移動元(先)を簡単に設定することができます。
f:id:pouhiroshi:20170803140820p:plain

上記では、Move(移動)しか設定していませんが、ROTATE(回転)、SCALE(拡大拡小)、FADE(透過)などもアニメーション設定することができます。

また、Unityでの起動時にはUIElementコンポーネントに「Show」「Hide」ボタンが表示され、
手軽に動作を確認することができます。
f:id:pouhiroshi:20170803141224p:plain

動作時のイメージです。
f:id:pouhiroshi:20170803143800g:plain

UI部品の制御は地味に時間がかかる面倒な作業です。
DoozyUIならサクッと作れるので、とてもオススメなアセットです!
お値段は少々張りますが(50$程度)、いろんなプロジェクトで使えますので、ご検討されてはいかがでしょう!

今回はUI部品の簡単な制御しかご紹介しませんが、DoozyUIはこのほかにも、色々な機能があります。
(以下、アセット紹介から抜粋)
・ネイティブuGUIを使用する
・エディタ統合、WYSIWYG
・学びやすい。直感的なデザイン
・UIアニメーターシステム
オリエンテーションマネージャー
・UIナビゲーションシステム
・UIエフェクト。パーティクルシステムはUI内にあります。
・UI通知システム
・UIトリガ。コード不要
・シーンローダー
・すべてのプラットフォームをサポート
・広範囲に最適化
・解像度に依存しない
・モバイルフレンドリー
・全C#ソースコードが付属
・専用サポート
YouTubeチャンネルのチュートリアル

クイックセットアップ!


それでは、今回の記事はここまでにしたいと思います。

「Unity アセット真夏のアドベントカレンダー 2017」次の担当は、
baba_sさんの「Inspector の表示をリッチにする!「Odin - Inspector and Serializer」紹介」
だそうです。
こちらも開発環境がいい感じになりそうな予感がしますね!ぜひチェックして見てください!

それでは、良い開発ライフをー!!