UnityShader(四)

这次要只用顶点着色器和片元着色器实现水面效果,思路很简单,就是先把顶点坐标从模型空间转变到齐次裁剪空间,再左乘unity_ObjectToWorld矩阵转变到世界坐标,将世界坐标的y按照正弦规律变化即可得到水面的波涛汹涌的效果,然后我们设置两个颜色,波峰我们设置为深色,波谷我们设置为浅色,只需要根据我们得到的y坐标偏移值lerp插值一下即可得到一个简单的水面效果,没有用到任何贴图

Shader "Custom/MyWater3" {
    Properties {
        _MainTex ("Texture", 2D) = "white" {}
        _Speed ("Speed", Range(0, 10)) = 1
        _Height ("Height", Range(0, 100)) = 0.1
        _W("W",Range(0,1)) = 0.5
        _LowColor("LowColor",Color) = (1,1,1,1)
        _HighColor("HighColor",Color) = (0,0,1,1)
    }
 
    SubShader {
        Tags {"Queue"="Transparent" "RenderType"="Opaque"}
        LOD 100
 
        Pass {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"
 
            struct appdata {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };
 
            struct v2f {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
                float4 worldPos : TEXCOORD1;
                float offset:TEXCOORD2;
            };
 
            sampler2D _MainTex;
            float _Speed;
            float _Height;
            float _W;
            fixed4 _LowColor;
            fixed4 _HighColor;
 
            v2f vert (appdata v) {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
                o.worldPos = mul(unity_ObjectToWorld, v.vertex);


                o.offset = _Height * sin(_Speed * _Time.y + _W * (abs(o.worldPos.x) + abs(o.worldPos.z)));
                o.vertex.y += o.offset;

                return o;
            }
 
            fixed4 frag (v2f i) : SV_Target {
                fixed4 waterColor = lerp(_LowColor,_HighColor,1 - i.offset/_Height);
                return waterColor;
            }
            ENDCG
        }
    }
    FallBack "Diffuse"
}

实现的效果图如下:

​​​​​​​

参数调节如下:

相关推荐
羊羊20351 个月前
C for Graphic:径向模糊
unity·shader
优雅永不过时·1 个月前
three.js 实现一个心形的着色器
前端·javascript·3d·shader·three·着色器
羊羊20352 个月前
C for Graphic:DNF手游残影效果
unity·shader·dnf
xiangshangdemayi2 个月前
WebGL系列教程八(GLSL着色器基础语法)
webgl·基础·shader·着色器·语法·glsl
阿赵3D2 个月前
Unity制作角色溶解变成光点消失
java·unity·游戏引擎·shader·溶解·消失
Jedi Hongbin3 个月前
THREE.JS像素风格渲染
javascript·three.js·shader·后处理
17岁的勇气4 个月前
Unity Shader unity文档学习笔记(十八):unity雾效原理
图形渲染·shader·雾效
SlowFeather5 个月前
UnityShader SDF有向距离场简单实现
unity·shader·ase
ggtc5 个月前
WPF网格类型像素着色器
wpf·shader
ggtc5 个月前
在WPF中使用着色器
wpf·shader·hlsl