研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了

01 

预览

研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了_第1张图片
扫光特效—Fluxay2

研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了_第2张图片马赛克像素特效—Mosaic

研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了_第3张图片
过渡效果—Transfer

Shawn 花了3天时间,研究了Cocos Creator 2.2.0 的 Effect 语法,终于在1024节前夕,大概知道如何将 2.1.3 的 Shader 特效给移植过去,成功移植了上面几个 Effect 文件,下面我讲一下关键要点,相信你可以自行完成。

02 

uniform block 


在片元代码中定义 uniform 变量,除了sampler2D 类型以外,必须将 uniform 变量放到 uniform block 里面,代码如下:

uniform PROPERTIES{	
  vec4  color;	
  float factor;	
  float width;	
  float time;	
}
在 WebGL 2 中新增了 Uniform Block 的写法,着色器与应用程序之间,或者着色器各阶段之间共享的变量可组织为变量块(Uniform Block)的形式,并且有时候必须采取这种形式。
Shawn 对具体细节也不清楚,还需要进一步学习。

02 

vec3 不可用

有几个 Shader 有包含有 vec3 类型的 uniform 变量,始终报错,如下提示:
640?wx_fmt=png
没有办法,搞了好次几都不行,只有求助引擎组大佬:
研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了_第4张图片

通过 panda 的指点,我将 vec3 类型的变量改为 vec4 就没事了!

有不少伙伴在微信或公众号后台向 Shawn 询问 ShaderHelper2 不能在 Cocos Creator 2.2.0 上工作的问题。

在此向大家致歉 ShaderHelper2 中的 Effect 还未完全移植完毕,移植的几个 Effect 也还未经过测试,需要再过几天才能放出,通过上面的方法你也可以快速移植。

03 

结语

Shawn 写公众号有两年了,目前自由职业也已经 4 个月了,日更 120+ 天,但苦于一直没有收入,也未能探索出一个能持续维持生活的路子。 唯一在10月接到「腾讯云沙龙」的 3 场线下沙龙推广活动,缓解拮据的经济情况。

本周六 是「腾讯云沙 龙」上海站,如果你在上海或有上海的朋友,请相互转告或邀约同 行,Shawn为大 家争取福利,上周 北京站有 3 位伙伴获得了公众号专属福利《腾讯游戏 开发精萃》 ,他们是:
  • 星空

  • samael

  • 赚钱容易花钱难

再次感谢 3 位伙伴对 Shawn 的支持,腾讯云这边非常大方,尽管「赚钱容易花钱难」没有邀到朋友同行,Shawn 也为他争取到了一份2_11.png

扫码报名
研究了3天,终于将 Shader 移植到 Cocos Creator 2.2.0 上了_第5张图片
「腾讯云沙龙▪上海站

你可能感兴趣的:(Creator3D,Cocos,Creator基础教程)