After 3 days of research, Shader is finally ported to Cocos Creator 2.2.0!

preview

Sweep effect – Fluxay2

Mosaic Pixel Effects — Mosaic

Transition effect – Transfer

Shawn spent three days studying the Effect syntax of Cocos Creator 2.2.0. Finally, on the eve of section 1024, he roughly figured out how to transplant the Shader effects of 2.1.3 and successfully transplanted the above several Effect files. Here are the key points, which I believe you can do on your own.

uniform block

All uniform variables must be placed in a UNIFORM block, except for sampler2D:

uniform PROPERTIES{
  vec4  color;
  float  factor;
  float width;
  float time;
}Copy the code

In WebGL 2, a new Uniform Block writing method was introduced. Variables shared between shaders and applications, or between shader phases, can be organized into Uniform blocks, and sometimes must be. Shawn is not sure about the details and needs further study.

Vec3 unavailable

Several shaders have uniform variables of type VEC3, which always fail:There is no way, made a good several are not good, only to ask the engine group big guy:

By panda’s advice, I changed the variable of vec3 type to VEC4 and it was fine!

Shawn has had a number of friends ask him about ShaderHelper2 not working on Cocos Creator 2.2.0.

With apologies, the effects in ShaderHelper2 are not fully ported, and several of the ported effects are not yet tested and will be released in a few days. You can also quickly port them using the above method.