Help us understand the problem. What is going on with this article?

[Unity]イベントとかでよく見るWipeをShaderで書いてみる

初めまして、demです。
最近UnityでShaderを勉強しているのですが、学びの中でできたものを不定期に載せていこうと思います。
タイトルにもあるようにイベントでよく見るWipeを作っていこうかと思います。
今回はShaderとそれを描画するスクリプトを書いていきます。
早速コードの方を・・・まずはShaderの方から。

EventWipe.shader
Shader"SmyCustom/EventWipe"{
    Properties{
        _MainTex("None",2D)="white"{}
        _Length("Length",Range(0,0.5))=0.5
    }
    SubShader{
        Pass{
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"

            struct appdata {
                float4 vertex:POSITION;
                float2 uv:TEXCOORD0;
            };

            struct v2f {
                float4 vertex:SV_POSITION;
                float2 uv:TEXCOORD0;
            };

            sampler2D _MainTex;
            float _Length;

            v2f vert(appdata v) {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
                return o;
            }

            fixed4 frag(v2f i) :COLOR{
                //ここでカメラに写っている色情報を取得する
                fixed4 c = tex2D(_MainTex,i.uv);
                //uv座標のyから0.5を引いた値の絶対値(ここでは画面の真ん中を(0.5,0.5)としている)
                fixed l = abs(i.uv.y - 0.5);
                //lの値が_Length以下ならそのまま描画する。違うのなら黒く描画
                fixed4 color = (l < _Length) ? c : fixed4(0, 0, 0, 1);

                return color;
            }
            ENDCG
        }
    }
}

次に実際に描画するためのスクリプトを書きます。

EffectDisplay.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class EffectDisplay: MonoBehaviour
{
    [SerializeField]
    private Material mat = null;

    private void OnRenderImage(RenderTexture source, RenderTexture destination)
    {
        Graphics.Blit(source, destination, mat);
    }
}

そのあとはこのスクリプトをカメラにアタッチしてマテリアルの部分に先ほど書いたShaderを適応したマテリアルを入れてあげればOKです!数値はマテリアルにあるスライダーを動かすとワイプが上下から出てきます!

Wipe1.PNG

スライダーの数値を0に近づけると黒い部分が多くなるのでフェードとかでも使えそうですね。
Wipe2.PNG

Shaderというよりポストエフェクト的な何か・・・?
以上になります。まだまだ初心者なのでコードに関しては変なことをしているかもしれませんが温かい目で見守っていただけると幸いです。

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away