laya描边shader

先上源码:

OutLineMaterial.js

export default class OutlineMaterial extends Laya.BaseMaterial {
    constructor() {
        super()

        var attributeMap = {
            'a_Position': Laya.VertexMesh.MESH_POSITION0,
            'a_Normal': Laya.VertexMesh.MESH_NORMAL0,
            'a_Texcoord': Laya.VertexMesh.MESH_TEXTURECOORDINATE0,
        }
        var uniformMap = {
            'u_MvpMatrix': [Laya.Sprite3D.MVPMATRIX, Laya.Shader3D.PERIOD_SPRITE],
            'u_WorldMat': [Laya.Sprite3D.WORLDMATRIX, Laya.Shader3D.PERIOD_SPRITE],
            'u_Texture': [OutlineMaterial.DIFFUSETEXTURE, Laya.Shader3D.PERIOD_MATERIAL]
        }

		var outlineShader = Laya.Shader3D.add("OutlineShader", attributeMap, uniformMap);
        
        var outline_vs = `
            attribute vec4 a_Position;
            uniform mat4 u_MvpMatrix;
            uniform mat4 u_WorldMat;
            attribute vec3 a_Normal;
            varying vec3 v_Normal;
            void main()
            {
                gl_Position = u_MvpMatrix * a_Position;
                mat3 worldMat = mat3(u_WorldMat);
                v_Normal = worldMat * a_Normal;
                gl_Position.xy += v_Normal.xy * 0.04;
            }`
        var outline_ps = `
            #ifdef FSHIGHPRECISION
            precision highp float;
            #else
            precision mediump float;
            #endif
            varying vec3 v_Normal;
            void main()
            {
                gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
            }`

        var base_vs = `
            attribute vec4 a_Position;
            attribute vec2 a_Texcoord;
            attribute vec3 a_Normal;

            varying vec2 v_Texcoord;
            varying vec3 v_Normal;

            uniform mat4 u_MvpMatrix;
            uniform mat4 u_WorldMat;
            
            void main()
            {
                mat3 worldMat = mat3(u_WorldMat);
                v_Normal = worldMat * a_Normal;
                v_Texcoord=a_Texcoord;
                gl_Position = u_MvpMatrix * a_Position;
            }`

        var base_ps = `
            #ifdef FSHIGHPRECISION
            precision highp float;
            #else
            precision mediump float;
            #endif
            varying vec3 v_Normal;
            varying vec2 v_Texcoord;

            uniform sampler2D u_Texture;

            void main()
            {
                gl_FragColor = texture2D(u_Texture, v_Texcoord);
            }`

        outlineShader.addShaderPass(outline_vs, outline_ps)
        outlineShader.addShaderPass(base_vs, base_ps)
        
        this.setShaderName("OutlineShader")

        this.getRenderState(0).cull = 1
    }

    set diffuseTexture (value) {
        this._shaderValues.setTexture(OutlineMaterial.DIFFUSETEXTURE, value)
    }
}

使用描边shader:

var outlineMaterial = new OutlineMaterial();

        Laya.Mesh.load("res/LayaMonkey/Assets/LayaMonkey/LayaMonkey-LayaMonkey.lm", Laya.Handler.create(this, function (mesh) {
            var layaMonkey = scene.addChild(new Laya.MeshSprite3D(mesh));
            layaMonkey.transform.localScale = new Laya.Vector3(0.3, 0.3, 0.3);
            layaMonkey.transform.rotation = new Laya.Quaternion(0.7071068, 0, 0, -0.7071067);
            
            layaMonkey.meshRenderer.sharedMaterial = outlineMaterial;
            Laya.timer.frameLoop(1, this, function () {
                layaMonkey.transform.rotate(this.rotation, false);
            });
        }));

        Laya.Texture2D.load("res/LayaMonkey/Assets/LayaMonkey/diffuse.png", Laya.Handler.create(null, function (tex) {
            outlineMaterial.diffuseTexture = tex;
        }));


暂无评论

发布评论

分享:

支付宝

微信