【Unity NGUI】フェードインとフェードアウトの実装

  • |
【Unity NGUI】フェードインとフェードアウトの実装
   

第7回目は、NGUIで「フェード(Fade)」についてです。
主に、SceneやLayerを切り変える時に利用できるのではないかと考えています。
前回:【Unity NGUI】文字を表示する | albatrus.com

NGUI:フェードイン、フェードアウト

これができるまでに色々と調べたのですが、[Tween Alpha]を利用すれば簡単に実装ができました。
2014-9-2-fdsasa

黒のテクスチャを用意

まずは、黒いテクスチャを用意します。
これを[UITexture]を利用して画面に配置をします。
2014-9-2-fdsada


フェードイン

[Tween Alpha]の設定です。
フィードインは、From[1],From[0]に設定すれば実現できます。
2014-9-2-fdsasa

フェードアウト

フィードアウトは、From[0],From[1]に設定すれば実現できます。
2014-9-2-fdsas


フェードのスピード

フェードの速度は[Animation Curve]で調整をします。
2014-9-2-fdsasda

画面の遷移

これは、通常のTweenと同じように[On Finished]で、画面遷移のメソッドを指定して上げればOKです。

【参考】
[Unity2D] Unity2DのSpriteをフェードイン・フェードアウトさせる : West Hill 開発メモ



NGUIを使わない方法

先ほどはNGUIを利用した方法でしたが、何も利用をしない場合は[GUI Texture]を利用すれば実装が可能です。
2014-9-2-fdsasdaoo


同じように、黒いテクスチャを利用します。
[Tween]のようなスクリプトが利用できないので、独自に実装します。
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;
		
	}
}


startFadeInstartFadeOutを必要な時に呼び出してあげます。

最後に

これで簡単ながら「フェード」を実装することができました。
私は、画面が遷移する際に良く「フェード」を利用しているので勉強のやりがいがありました。
以前にこんな記事も書いていましたので、こちらも参考にしてみてください。

Related Posts Plugin for WordPress, Blogger...