CocosCreator Shader 马赛克效果

CocosCreatorWebGLShader2020/5/301793CocosCreator文章集合

经过一两天的CocosShader学习，发现cocos与单纯的WebGL还是不太一样，它提供了更多的内置函数与宏，还有一些默认变量；让开发者编写Shader特效更加方便；

看了看别人家写的马赛克shader教程，挺有意思，于是自己动手写了个马赛克，不小心一行代码搞定；

上效果：

上代码：

  uniform PIXEL{
    float hgsize;
    float vgsize;
  };

  #if USE_TEXTURE
  in vec2 v_uv0;
  uniform sampler2D texture;
  #endif

  float pixelateIt (float uv, float size){
    return (uv-mod(uv,size)) + (size/2.0);
  }

  void main () {
    vec4 o = vec4(1, 1, 1, 1);

    
    #if USE_TEXTURE
      vec2 c = v_uv0;
      c.x = pixelateIt(c.x, hgsize);
      c.y = pixelateIt(c.y, vgsize); 
      CCTexture(texture, c, o);
    #endif

    ALPHA_TEST(o);

    gl_FragColor = o;
  }

可以看出来关键性代码就一行，还是挺方便，呵呵哒。