Laya水波shader

先上主要代码: WaterMaterial.ts

import Shader3D = Laya.Shader3D;
import SubShader = Laya.SubShader;
import BaseTexture = Laya.BaseTexture;
export default class WaterMaterial extends Laya.Material {
    public readonly MAIN_TEX: number = Shader3D.propertyNameToID("u_MainTex");
    public readonly NOISE_TEX: number = Shader3D.propertyNameToID("u_NoiseTex");

    constructor() {
        super();
        this.setShaderName("Water");
    }

    public static initShader() {
        var vs: string = `
        #include "Lighting.glsl";
        
        attribute vec4 a_Position;
        attribute vec2 a_Textcoord;
        uniform mat4 u_WorldMat;
        uniform mat4 u_MvpMatrix;
        
        varying vec2 v_textcoord;
        
        void main()
        {
            v_textcoord = a_Textcoord;
            gl_Position = u_MvpMatrix * a_Position;
            gl_Position = remapGLPositionZ(gl_Position);
        }`;

        var ps: string = `
        #ifdef HIGHPRECISION
        precision highp float;
        #else
        precision mediump float;
        #endif

        #include "Lighting.glsl";
        
        uniform sampler2D u_MainTex;
        uniform sampler2D u_NoiseTex;
        uniform float u_Time;

        varying vec2 v_textcoord;
        void main()
        {
            float _NoiseSpeedX = 0.02;
            float _NoiseSpeedY = 0.02;
            float _NoiseScaleX = 0.2;
            float _NoiseScaleY = 0.2;
            float _NoiseBrightOffset = 0.25;

            vec2 tuv1 = v_textcoord + vec2(u_Time * _NoiseSpeedX,0);
            vec2 tuv2 = v_textcoord + vec2(0,u_Time * _NoiseSpeedY);
            vec2 ouvxy = vec2(texture2D(u_NoiseTex,tuv1).r,texture2D(u_NoiseTex,tuv2).r);
            ouvxy -= _NoiseBrightOffset;
            ouvxy *= vec2(_NoiseScaleX, _NoiseScaleY);

            vec4 col = texture2D(u_MainTex,v_textcoord + ouvxy);
            gl_FragColor = col;
        }
        `;

        var attributeMap: object =
        {
            "a_Position": Laya.VertexMesh.MESH_POSITION0,
            "a_Normal": Laya.VertexMesh.MESH_NORMAL0,
            "a_Textcoord": Laya.VertexMesh.MESH_TEXTURECOORDINATE0
        };

        var uniformMap: object =
        {
            "u_WorldMat": Shader3D.PERIOD_SPRITE,
            'u_MvpMatrix': Shader3D.PERIOD_SPRITE,
            'u_MainTex': Shader3D.PERIOD_MATERIAL,
            'u_NoiseTex': Shader3D.PERIOD_MATERIAL,
            'u_Time': Shader3D.PERIOD_SCENE,

        }

        var shader: Shader3D = Shader3D.add("Water", null, null, true);
        var subShader: SubShader = new SubShader(attributeMap, uniformMap);
        shader.addSubShader(subShader);
        subShader.addShaderPass(vs, ps);
    }

    set mainTex(value: BaseTexture) {
        this._shaderValues.setTexture(this.MAIN_TEX, value);
    }

    set noiseTex(value: BaseTexture) {
        this._shaderValues.setTexture(this.NOISE_TEX, value);
    }
}


可以直接在laya2.4版本上使用,在使用前先调用 

WaterMaterial.initShader();

 let mat = new WaterMaterial();
 mat.mainTex = "xxx"
 mat.noiseTex = Laya.loader.getRes("res/noise.jpg");
ddd.meshRenderer.material = mat;


噪点图:

noise.jpg

暂无评论

发布评论

分享:

支付宝

微信