【分享】基于 Cocos Creator 2.2 版本的自定义渲染组件及材质的 Demo

自定义渲染组件及材质

  • 由于 2.2 版本的渲染组件及 Assembler 有了不少改动,所以用户脚本自定义渲染组件及自定义 Assembler 也有一些不同,这里提供一个自定义渲染组件的 Demo 示例,供大家参考, 后续会补上相关文档。

    自定义渲染组件继承 cc.RenderComponent,需重写 _resetAssembler 及 _activeMaterial 方法

    自定义 Assembler 继承 cc.Assembler,需重写 init,updateRenderData 及 fillBuffers 方法

  • 目前 2.2 版本的材质系统也基本趋于稳定,可以很方便的在编辑器中进行自定义材质及 Effect,不管是 Shader 的编写还是材质的属性编辑都十分方便快捷,Demo 中也移植了一些 Shader 效果供大家学习。2.2 版本的材质系统基本与 Creator 3D 一致,关于 Effect 文件的格式及语法可以参考文档 Effect 文档

  • Demo 中的效果没有考虑移动端性能,移植过来仅供大家学习参考,后续会在此基础上更新一些更适用于项目的效果供大家参考。希望开发者在此基础上能够创作出更多高质量的游戏作品,Effect 文件编写的语法高亮可以搜索 VsCode 插件 Cocos Effect

Demo 下载地址

CreatorShaderDemo


天气相关示例:

滚动背景:

云:

雨:

雪:


图片相关:

使用RenderTexture进行屏幕后处理:


GamePlay:

点光源:

4赞

mark

mark

火钳留名

1赞

太好了

普天同庆:grinning:

赞赞赞,

不过要来思考一下怎么搞动态载入才行

ia方式的渲染呢?

我抽空补个IA的示例

多来点

什么动态载入?动态加载材质设置给组件吗?

mark

mark

是的,材质与shader相关档案许多都是一个一个的单档文件

mark,膜拜

感谢大神提供的方法
现在有个问题就是给button等组件使用的时候,点击button会导致材质失效,这个应该怎么解决呢?

跟普通的资源加载一样的,通过 loadRes 先加载 Effect 文件,然后加载 Material 文件。

  • 1.内置的Button初始化的时候如果没有指定Button的 _graySpriteMaterial 跟 _spriteMaterial 就会切换回默认的材质,可以设置Button的这两个值,避免切换回默认材质。

  • 2.引擎这边做了修改,如果没有指定Button的_spriteMaterial会优先使用Sprite组件指定的材质,Sprite组件未指定再切换回默认材质,_graySpriteMaterial如果未指定,依然会使用默认的置灰材质。【修改在2.2版本】

https://github.com/cocos-creator/engine/pull/5465

IA的例子有问题呢,用的2.2beta1版本打开。模拟器运行直接报错。

mark