3D優化之ShadowGun系列二：濃煙，使用面片模擬粒子效果

先看效果：

看一下網格模型：

這就是個面片模型，越靠近邊緣的地方，alpha值越低。所以煙有變淡的感覺。

如圖：

注意箭頭指的地方，面片這裏故意做了個折角，這樣讓煙看起來更有在某個位置受風改變方向的感覺。

看shader參數：

兩張貼圖，一張做base，一張做2nd。

分別控制：

上面12個參數，控制的是兩張貼圖的使用方式，

修改的都是uv，speed是x，y方向的滾動速度，amplitude是x，y方向上sin的偏移幅度。freq是x,y方向上uv的頻率。

最後兩個：

color控制整體顏色變化，Multiplier控制的是顏色再提升的次數。

整體shader的註釋：

Shader "MADFINGER/Environment/Scroll 2 Layers Sine AlphaBlended" {
Properties {
    _MainTex ("Base layer (RGB)", 2D) = "white" {}
    _DetailTex ("2nd layer (RGB)", 2D) = "white" {}
    _ScrollX ("Base layer Scroll speed X", Float) = 1.0
    _ScrollY ("Base layer Scroll speed Y", Float) = 0.0
    _Scroll2X ("2nd layer Scroll speed X", Float) = 1.0
    _Scroll2Y ("2nd layer Scroll speed Y", Float) = 0.0
    _SineAmplX ("Base layer sine amplitude X",Float) = 0.5 
    _SineAmplY ("Base layer sine amplitude Y",Float) = 0.5
    _SineFreqX ("Base layer sine freq X",Float) = 10 
    _SineFreqY ("Base layer sine freq Y",Float) = 10
    _SineAmplX2 ("2nd layer sine amplitude X",Float) = 0.5 
    _SineAmplY2 ("2nd layer sine amplitude Y",Float) = 0.5
    _SineFreqX2 ("2nd layer sine freq X",Float) = 10 
    _SineFreqY2 ("2nd layer sine freq Y",Float) = 10
    _Color("Color", Color) = (1,1,1,1)
    
    _MMultiplier ("Layer Multiplier", Float) = 2.0
}

    
SubShader {
    Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" }
    
    Blend SrcAlpha OneMinusSrcAlpha
    Cull Off Lighting Off 
    ZWrite On Fog { Color (0,0,0,0) }
    
    LOD 100
    
    
    
    CGINCLUDE
    #pragma multi_compile LIGHTMAP_OFF LIGHTMAP_ON
    #pragma exclude_renderers molehill    
    #include "UnityCG.cginc"
    sampler2D _MainTex;
    sampler2D _DetailTex;

    float4 _MainTex_ST;
    float4 _DetailTex_ST;
    
    float _ScrollX;
    float _ScrollY;
    float _Scroll2X;
    float _Scroll2Y;
    float _MMultiplier;
    
    float _SineAmplX;
    float _SineAmplY;
    float _SineFreqX;
    float _SineFreqY;

    float _SineAmplX2;
    float _SineAmplY2;
    float _SineFreqX2;
    float _SineFreqY2;
    float4 _Color;

    struct v2f {
        float4 pos : SV_POSITION;
        float4 uv : TEXCOORD0;
        fixed4 color : TEXCOORD1;
    };

    
    v2f vert (appdata_full v)
    {
        v2f o;
        o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
        o.uv.xy = TRANSFORM_TEX(v.texcoord.xy,_MainTex) + frac(float2(_ScrollX, _ScrollY) * _Time);   //先給底圖根據時間做uv滾動
        o.uv.zw = TRANSFORM_TEX(v.texcoord.xy,_DetailTex) + frac(float2(_Scroll2X, _Scroll2Y) * _Time); //uv 滾動
        
        o.uv.x += sin(_Time * _SineFreqX) * _SineAmplX;    //給底圖x方向上做sin週期擾動
        o.uv.y += sin(_Time * _SineFreqY) * _SineAmplY; //底圖y方向上做sin週期擾動
        
        o.uv.z += sin(_Time * _SineFreqX2) * _SineAmplX2;//2nd圖的uv存在texcoord的zw中
        o.uv.w += sin(_Time * _SineFreqY2) * _SineAmplY2;
        
        o.color = _MMultiplier * _Color * v.color; //給最終的顏色乘以外面賦進來的color和Multiplier。
        return o;
    }
    ENDCG

    Pass {
        CGPROGRAM
        #pragma vertex vert
        #pragma fragment frag
//        #pragma fragmentoption ARB_precision_hint_fastest        
        fixed4 frag (v2f i) : COLOR
        {
            fixed4 o;
            fixed4 tex = tex2D (_MainTex, i.uv.xy); //底圖取xy
            fixed4 tex2 = tex2D (_DetailTex, i.uv.zw);//2nd圖取zw
            
            //o = tex * tex2 * i.color;
            o=tex2*tex*i.color;
                        
            return o;
        }
        ENDCG 
    }    
}
}

效果圖中箭頭指的地方，有點泛紅，這個也是在面片裏控制的。

面片中，越靠近火源的點，color的值越偏紅。如圖：