CocosCreator1.x实现水流动的效果

Cocos Creator版本：1.10.2

运行结果：(H5和原生都支持)

场景:

脚本：
HelloWorld.js：

let shader = require(`shader`);

cc.Class({
   
    extends: cc.Component,
    properties: {
   
        water: cc.Node,
        waterNormalMap: cc.SpriteFrame,
    },

    onLoad() {
   
        // 加载所有着色器程序
        shader.loadShaderPrograms();

        // 初始化水的着色器程序
        this._time = 0;
        this._waterSpeed = 0.1;
        shader.setGLProgramForNode(`water`, this.water);
        shader.use(`water`);
        shader.setUniformTexture(`water`, `normalMap`, this.waterNormalMap.getTexture());
        shader.setUniformFloat(`water`, `v_offset`, 0);
    },

    update(dt) {
   
        // 更新水的着色器程序
        this._time += dt;
        shader.use(`water`);
        shader.setUniformFloat(`water`, `v_offset`, (this._time * this._waterSpeed) % 1);
    },
});

shader.js