第7回目は、NGUIで「フェード(Fade)」についてです。 主に、SceneやLayerを切り変える時に利用できるのではないかと考えています。 前回:【Unity NGUI】文字を表示する | albatrus.com
NGUI:フェードイン、フェードアウト
これができるまでに色々と調べたのですが、[Tween Alpha]を利用すれば簡単に実装ができました。
黒のテクスチャを用意
まずは、黒いテクスチャを用意します。 これを[UITexture]を利用して画面に配置をします。
フェードイン
[Tween Alpha]の設定です。 フィードインは、From[1],From[0]に設定すれば実現できます。
フェードアウト
フィードアウトは、From[0],From[1]に設定すれば実現できます。
フェードのスピード
フェードの速度は[Animation Curve]で調整をします。
画面の遷移
これは、通常のTweenと同じように[On Finished]で、画面遷移のメソッドを指定して上げればOKです。
【参考】 [Unity2D] Unity2DのSpriteをフェードイン・フェードアウトさせる : West Hill 開発メモ
NGUIを使わない方法
先ほどはNGUIを利用した方法でしたが、何も利用をしない場合は[GUI Texture]を利用すれば実装が可能です。
同じように、黒いテクスチャを利用します。 [Tween]のようなスクリプトが利用できないので、独自に実装します。 [c] public class Fade : MonoBehaviour {
private bool _play;
private bool _fadeIn;
private float time;
// Use this for initialization
void Start () {
_play = false;
_fadeIn = false;
time = 0;
}
// Update is called once per frame
void Update () {
if(_play){
time += Time.deltaTime;
if(_fadeIn){
guiTexture.color =new Color(1,1,1,Mathf.Lerp(1,0,time) );
}else{
guiTexture.color = new Color(1,1,1,Mathf.Lerp(0,1,time));
}
if(time >= 1){
_play = false;
}
}
}
public void startFadeIn(){
_play = true;
_fadeIn = true;
time = 0;
}
public void startFadeOut(){
_play = true;
_fadeIn = false;
time = 0;
}
}
[/c]
startFadeInとstartFadeOutを必要な時に呼び出してあげます。
最後に
これで簡単ながら「フェード」を実装することができました。 私は、画面が遷移する際に良く「フェード」を利用しているので勉強のやりがいがありました。 以前にこんな記事も書いていましたので、こちらも参考にしてみてください。