【Unity】uGUIでカラーやグラデなどの加工を付ける方法

ugui-color-gradient

素材は白黒でも頂点カラーやアルファを付けることで差分の素材を作成してみます。

スポンサーリンク

素材

f:id:min0124:20171220000528p:plain

ボタン用の素材を用意

スポンサーリンク

色つけ

f:id:min0124:20171220001304p:plain

白いボタン

先程の素材を9スライスで引き伸ばしたもの。

ピンクのボタン

Button(Script)のNomal Colorの色をつけたもの

青のボタン

uGUI-Effect-ToolのGradient ColorのColor Bottomに色をつけたもの

緑のボタン

ベースのボタンはそのままで

一回りちいさい、Imageを作成

Imageに透明度の違う格子のテクスチャ(Repeat/Point)を貼付したMaterial(Multiply)を付ける

さらにuGUI-Effect-ToolのGradient ColorのColor Bottomに色をつけ

uGUI-Effect-ToolのGradient ColorのAlpha Topのアルファを0にしたものを加えたもの

スポンサーリンク

まとめ

描画負荷は多少かかってくるものの、凝ろうと思えばUnityでもある程度は加工できると思います。

コメント