トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

Modern UI Packよかった【Unity】

Modern UI Pack

かっこいいUIパーツが入ったパック

定価20ドルだけど、なぜか90%オフで2ドルで買えた。

購入後に見ても20ドルなので、なんで90%オフになってたかよくわからない・・・

と思ったら、昔無料版を持ってた人は2ドルで買えるらしい。

trsasasusu.com

仕事で使ったけど、とてもよかったよ.

一覧

アセットページ見ろよって感じだけど、一応スクショ全部とった。

デモシーンに入ってる。

f:id:bibinbaleo:20210321212219p:plain

ウィンドウ

f:id:bibinbaleo:20210321212014p:plain

トグル。丸いトグルって独特。これの真ん中をチェックマークを●にしてラジオボタンみたいにも使った。

f:id:bibinbaleo:20210321212018p:plain

ToggleSwitch

f:id:bibinbaleo:20210321212021p:plain

スライダー

f:id:bibinbaleo:20210321212025p:plain

ローディング!

f:id:bibinbaleo:20210321212028p:plain

通知。いろんな出方がある

f:id:bibinbaleo:20210321212032p:plain

動かせるウィンドウ

f:id:bibinbaleo:20210321212035p:plain

タブ

f:id:bibinbaleo:20210321212038p:plain

ポップアップみたいな感じ

f:id:bibinbaleo:20210321212041p:plain

f:id:bibinbaleo:20210321212043p:plain

アイコン!ありがたいけど欲しいのにないのもあった。退出とか

f:id:bibinbaleo:20210321212046p:plain

InputField。これも使った。PlaceFieldが上にギュンって移動する

f:id:bibinbaleo:20210321212050p:plainページ移動みたいなやつ

f:id:bibinbaleo:20210321212053p:plain

ドロップダウン。これはスクリプトから使いにくくて使わなかった

f:id:bibinbaleo:20210321212056p:plain

アニメーションアイコン。

f:id:bibinbaleo:20210321212059p:plain

ボタン。クリックした時その部分が丸く光るのでおしゃれ

f:id:bibinbaleo:20210321212102p:plain

使い方

入れる

f:id:bibinbaleo:20210321211527p:plain

TextMeshProも入れる

f:id:bibinbaleo:20210321211524p:plain

ヒエラルキーで右クリックから追加できる。でもどれがどんな動きかよくわからなくて、よくでもシーン見に行った

f:id:bibinbaleo:20210321211521p:plain

注意点

TextMeshPro

テキスト部分は全部TextMeshProなのでそのままだと日本語使えない

f:id:bibinbaleo:20210321211518p:plain

日本語フォントを変換しないといけない

f:id:bibinbaleo:20210321212819p:plain

 初めて日本語フォントをTextMeshProで使ったけど大変だった。

bibinbaleo.hatenablog.com

黒背景用

基本的に黒い背景用に作ってあるので、明るい背景の時はUIの色を変えないといけない・・・

一気に色などを変える

ModeruUIPackの設定ウィンドウから、パーツの色合いを一気に変えられる。

Tools>ShowUIManagerから開く

f:id:bibinbaleo:20210321213219p:plain

ここで色を変えたら、その種類のUIに全部反映される

f:id:bibinbaleo:20210321213223p:plain

f:id:bibinbaleo:20210321213656p:plain

ほら

f:id:bibinbaleo:20210321213659p:plain

 

反映は各パーツについているこのMUIP Managerで行われる

f:id:bibinbaleo:20210321212825p:plain

個別に変える

反映してほしくない時、個別に色を設定したい時はこのコンポーネントを消去したらいい。

逆にこれがついていると、子の色などを個別に変えても反映されない

f:id:bibinbaleo:20210321213830p:plain

スクリプトから反映

スクリプトからの反映がしやすいかは、どうなんだろう・・・

ProgressBar

たとえばプログレスバーに、今のパーセンテージを入れる時

f:id:bibinbaleo:20210321214033p:plain

デフォルトだとSpeedが5になってて勝手にパーセンテージが進むので0にする。

f:id:bibinbaleo:20210321214038p:plain

あとはこのProgressBarを参照して、CurrentPercentに数字を入れたら動いた気がする。

ドロップダウンは独自の形式;;

f:id:bibinbaleo:20210321215520p:plain

動的にアイテムを追加するのよくわからなくてやめた気がする。

まあできるんだろうけど

f:id:bibinbaleo:20210321215517p:plain

普通のuGUIのを使ってくれたら、検索も楽なのに〜

f:id:bibinbaleo:20210321215714p:plain

Toggleは普通のuGUIのToggleだった

f:id:bibinbaleo:20210321214320p:plain

 

全部は触ってないのでどんな感じかわからない〜

AnimationIconも使おうとしたけど、勝手にアニメーションされて結局使わなかったりした