Unity++blog.

UnityやC#とかについて学習したことを書いてます

UIのImageにGlow効果(Emission)をつける&EmissionのInstensityを動的に変えるスクリプト

UIのImageにGlow効果をつける記事です。

 

Glow効果をつけるにはマテリアルのインスペクターでEmissionを設定してあげればいいのですが、デフォルトでついているUI/DefaultシェーダーにはEmissionの設定をする項目がありません。

f:id:nabesi777:20190515232550p:plain

 

Standardシェーダーでは設定することができますが、↓

f:id:nabesi777:20190515232526p:plain

 

これにシェーダーを変えてしまうとImageがうまく表示されません。

なのでお手軽にアセットを使用します。

 

MK Glow Free ↓

f:id:nabesi777:20190515232845p:plain

 

 

これをインポートして、効果をつけたいImageを準備します。

f:id:nabesi777:20190515233137p:plain

 

出来たら、新規でマテリアルを作成して

f:id:nabesi777:20190515233414p:plain

 

そのマテリアルのshaderを

MK>Glow>Selective>UI>Defaultに変えます。

f:id:nabesi777:20190515233632p:plain

 

f:id:nabesi777:20190515233603p:plain

 

 

そうするとEmissionをEmissionColorという項目で設定できるようになるので、好きな色を設定します。

f:id:nabesi777:20190515233753p:plain

 

 

Emissionの強さは色を設定するWindowの下のほうのInteisityで設定することができます。

f:id:nabesi777:20190515233902p:plain

 

できたら作成したものをImageのMaterialへイン!

f:id:nabesi777:20190515235711p:plain

 

なにもないシーンなので発光しているのがわかりづらいですが、黄色のエミッションをつけることができました。

f:id:nabesi777:20190515234244p:plain

 

下はこのEmissionを動的に操作したい場合のスクリプトです。

内容が適当であれですが、どうやって操作するのかは下のスクリプトでわかると思います。

 

 

スクリプトをImageにアタッチして、再生してみます。

f:id:nabesi777:20190515235920p:plain

 

 

f:id:nabesi777:20190516000046g:plain

 

Emisshonを動的に操作することができました!