【unity】Teleport Fade Shader ワープフェードシェーダー【アセット】

f:id:rgamebox:20180524172017j:plain

3Dモデルを粒子状にシュワッとフェードイン/アウトさせる事のできるアセットの紹介です。

Teleport Fade Shader ワープフェードシェーダー 

 

付属していたReadmeの転載。 

<<使用法>>
1. ‘TeleportFade’または ‘TeleportFade(Normal Map)’シェーダで素材を作成します。
2.その材料をメッシュに設定します。
3.パラメータを変更します。
4.お楽しみください! 

  なるほどわからん。

 使用法の記述がテキトーすぎる。

 

使い方

そういう訳で一から説明するよ。

f:id:rgamebox:20180525144105g:plain

 

◆メニュー > Gameobject > Sphere
で、スフィアを作成します。

※キューブはポリゴン数が少なすぎるのか上手くいかなかったです

このシェーダーは座標も関係するので x,y,zを0に配置しましょう

 

◆マテリアルを新規作成して「TeleportFade」シェーダーにします
そのマテリアルはスフィアに適用しておきます

f:id:rgamebox:20180525144223p:plain

 

◆シェーダーの設定をインスペクター上でします
・アセットに付属していた「TeleportFadeNoise2」をFadeTextureにD&D
・パラメーターはとりあえず下図の様にしてください

f:id:rgamebox:20180525144244p:plain

 

◆シェーダー設定のスライドバーをFade Rateを1.0にするとスフィアがシュワッとフェードアウトします

しかしスライドバーで動かすだけでは実際のゲームで使い辛いので、スクリプトでフェードアウトさせます

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class SphereFade : MonoBehaviour {
enum State //フェードステータス
{
None,
FadeOut,
FadeIn,
}
public GameObject fadeObject;
public MeshRenderer[] fadeMeshes;
public SkinnedMeshRenderer[] fadeSkinnedMeshes;
List<Material> fadeMaterials = new List<Material>();
State state;
float fadeTime;
float fadeSpeed = 1.0f;  //フェードスピード
// Use this for initialization
void Start () {
//メッシュからマテリアルを取得
foreach (var mesh in fadeMeshes)
{
foreach (var material in mesh.materials)
{
fadeMaterials.Add(material);
}
}
//スキニングメッシュからマテリアルを取得
foreach (var mesh in fadeSkinnedMeshes)
{
foreach (var material in mesh.materials)
{
fadeMaterials.Add(material);
}
}
}
// Update is called once per frame
void Update () {
fadeTime += Time.deltaTime; //フェード時間取得
float fadeDuration = 3.0f / fadeSpeed; //フェード期間
float fadeStartDelay = 0.0f / fadeSpeed; //フェード開始までのディレイ
float fadeRate = 0.0f;
switch (state)
{
case State.FadeOut:
fadeRate = Mathf.Clamp((fadeTime - fadeStartDelay) / fadeDuration, 0.0f, 1.0f);
break;
case State.FadeIn:
fadeRate = 1.0f - Mathf.Clamp((fadeTime - fadeStartDelay) / fadeDuration, 0.0f, 1.0f);
break;
}
var basePos = new Vector4();
basePos.x = fadeObject.transform.position.x;
basePos.y = fadeObject.transform.position.y - 1f;
basePos.z = fadeObject.transform.position.z;
foreach (var material in fadeMaterials)
{
material.SetVector("_ObjectBasePos", basePos);
material.SetFloat("_FadeRate", fadeRate);
}
}
//FadeOutボタンが押された時に呼ばれる関数
public void StartFadeOut()
{
fadeTime = 0.0f;
state = State.FadeOut;
}
//FadeInボタンが押された時に呼ばれる関数
public void StartFadeIn()
{
fadeTime = 0.0f;
state = State.FadeIn;
}
}

 

◆確認しやすい様にフェードイン/アウトのボタンを追加しています

f:id:rgamebox:20180525144347p:plain

 

これでシュワッとフェードイン/アウトが思いのままです。

 

わからない事あったらコメントくださいな

 

それではフェードアウトでお別れしましょう

f:id:rgamebox:20180525144502g:plain

 

 

<<パラメータ>>
*Fade Texture… TeleportFadeNoise1、TeleportFadeNoise2、または作成したノイズテクスチャを設定します。
*Rise power…フェーディングの比率を上げます。
*Twist power…ツイストパワー。フェーディングのツイスト比。
*Spread power …広げるパワー。フェージングでXZ比率を広げます。
*Particle color…フェーディングの発光色。 ゼロアルファなら、発光色は変化しません。
*Fade rate…フェージングレート。 このパラメータはスクリプトで制御します。
*Object height …フェードオブジェクトの高さを設定します。
*Object fade height …フェードの高さを設定します。
*Object base position…オブジェクトの位置を設定します。 オブジェクトが動いている場合は、このパラメータをリセットする必要があります。

 

 << Usage >>
1. Create a material with ‘TeleportFade’ or ‘TeleportFade (Normal Map)’ shader.
2. Set that material to meshes.
3. Change parameters.
4. Enjoy!

 

<< Parameters >>
* Fade Texture … Set TeleportFadeNoise1, TeleportFadeNoise2 or your created noise texture.
* Rise power … Rise up ratio in fading.
* Twist power … twist ratio in fading.
* Spread power … Spread XZ ratio in fading.
* Particle color … Emissive color in fading. If zero alpha, no emissive color change.
* Fade rate … Fading rate. You control this parameter in scripts.
* Object height … Set the fade object height.
* Object fade height … Set the fading height.
* Object base position … Set the object position. If the object moving, you have to reset this parameter.

 

<< Package >>
TeleportFadeShader/
Documents/
License.txt
Readme.txt
Samples/
Shaders/
TeleportFade.shader
TeleportFade_NormalMap.shader
Textures/
TeleportFadeNoise1.png
TeleportFadeNoise2.png

コメント

タイトルとURLをコピーしました