Unityで、2Dゲームでよく見かけるプレイヤーが建物に入ると屋根がディゾルブやフェード効果で非表示になる機能を備忘録的に投稿します。
屋根をディゾルブ効果で非表示
見下ろし型の2Dゲームでよく見かける、プレイヤーが建物に入ると屋根が非表示になる効果を作ってみます。
こんな感じで、プレイヤーが建物内に入るとフェードやディゾルブの効果を経て非表示になります。
フェーダーを使って非表示
新しくフェーダーを作成して屋根を非表示する際の効果を追加します。
具体的には次の手順でフェーダーを作成から始めます。
1.［プロジェクト］画面の空いている場所で右クリックして表示されたポップアップメニューで［Create｜Shader Graph｜URP｜Lit Shader Graph］を選択します。
2. 追加されたシェーダーの名前を［SG_RoofDissolve］などに変更してダブルクリックして［Shader Graph］を表示します。
3.［Graph Inspector］で［Material：Sprite Lit］［Blending Mode：Alpha］［Alpha Clipping］を有効（チェックを付ける）に編集します。
2. ［SG_RoofDissolve］の［+］をクリックして［Float 変数 DissolveAmount］と［Texture 2D 変数 MainTex］を追加してから、下のイメージのノードを追加して、それぞれのノードを接続します。
3. 保存した［SG_RoofDissolve］を選択してから右クリックして表示された［Create｜Material］メニュー新しくマテリアルを作成して名前を［m_RoofDissolve］に変更します。
4. 非表示にする屋根を［SpriteRenderer］で作成して配置します。
5. 新しくC#スクリプト［RoofVisibility］を作成して、次のコードに更新します。
using System.Collections;
using UnityEngine;
public class RoofVisibility : MonoBehaviour
{
[SerializeField] private SpriteRenderer roofRenderer;
[SerializeField] private float dissolveDuration = 0.5f;
private static readonly int DissolveAmount = Shader.PropertyToID("_DissolveAmount");
private Material roofMaterial;
private Coroutine dissolveCoroutine;
private void Awake()
{
// この屋根専用のマテリアルを取得
roofMaterial = roofRenderer.material;
}
private void OnTriggerEnter2D(Collider2D other)
{
// 屋根に入った
if (other.CompareTag("Player"))
{
StartDissolve(1f);
// roofRenderer.enabled = false;
}
}
private void OnTriggerExit2D(Collider2D other)
{
// 屋根を出た
if (other.CompareTag("Player"))
{
StartDissolve(0f);
// roofRenderer.enabled = true;
}
}
private void StartDissolve(float target)
{
if (dissolveCoroutine != null)
{
StopCoroutine(dissolveCoroutine);
}
if (target < 1f)
{
roofRenderer.enabled = true;
}
dissolveCoroutine = StartCoroutine(
DissolveRoutine(target));
}
private IEnumerator DissolveRoutine(float target)
{
float start = roofMaterial.GetFloat(DissolveAmount);
float elapsed = 0f;
while (elapsed < dissolveDuration)
{
elapsed += Time.deltaTime;
float t = Mathf.Clamp01(elapsed / dissolveDuration);
roofMaterial.SetFloat(
DissolveAmount,
Mathf.Lerp(start, target, t));
yield return null;
}
roofMaterial.SetFloat(DissolveAmount, target);
if (target >= 1f)
{
roofRenderer.enabled = false;
}
dissolveCoroutine = null;
}
}
6. 配置した［SpriteRenderer］に［Box Collider 2D］コンポーネントを追加して［Is Trigger］を有効（チェックを付ける）にします。
7. 同様に［RoofVisibility］スクリプトをコンポーネントに追加して、［Sprite Renderer］の［Material］に手順３で作成したマテリアルを設定し［Roof Renderer］には配置している屋根の［SpriteRenderer］を指定します。
ここまでの作業を保存して、実行すると、プレイヤーを屋根に近づけるとディゾルブ効果で非表示になり、屋根から離れると表示されるようになります。
まとめ
今回はUnityを使って、2Dゲームでよく見かけるプレイヤーが建物に入ると屋根がディゾルブやフェード効果で非表示になる表示について書きました。
ディゾルブ効果用のシェーダーを作成して専用のマテリアルを作成して、C#スクリプトから利用することで［SpriteRenderer］の表示（または非表示）にする際の効果として利用できます。
Unityでプレイヤーが建物に入ると屋根がディゾルブやフェード効果で非表示になる効果を作りたい人の参考になれば幸いです。
スポンサーリンク
最後までご覧いただき、ありがとうございます。