经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » 程序设计 » 游戏设计 » 查看文章
ShaderHelper2 组件升级,支持自动枚举参数!
来源:cnblogs  作者:张晓衡  时间:2019/9/29 10:42:24  对本文有异议

ShaderHelper2 组件新体验视频演示:
https://www.bilibili.com/video/av69314195/

ShaderHelper2 组件我们已经介绍过两次了,不了解的伙伴可以看下面两篇文章:

  1. 新版ShaderHelper,终于支持 Creator 2.1.2 了!
  2. ShaderHelper2正式回归,并全面使用TypeScript语言!

本文主要介绍这次改进的地方。

虽然 ShaderHelper2 支持了在 Cocos Creator 2.1.2 以上引擎版本使用,使用体验也得到了改进,但是 Shawn 编写的组件的理念是希望能为策划、美术以及非程序员提供内容生产的能力,在易用性上再进一步,改进功能点如下:

自动隐藏props属性

当一个Shader Effect中不含有可调节的参数,ShaderHelper 组件将不会显示props属性到属性面板上,看下图:

file

可以看到上图中,Dissolve特效组件属性非常简洁,仅有一个 Program 属性,我们仍然可以使用ShaderTime组件调节动态 time 参数。

自动枚举参数到props属性

如果一个Shader Effect 是含有参数的,当切换 Program 属性时将会自动刷新 props 属性,枚举出Shader 的可控参数,而且参数的Key值是只读,不会因为误操作修改出错,看下图:

file

props属性中的参数 value 同样支持动态调节,可以在场景编辑器中实时看到修改后的效果。

优化提示警告

之前的版本,在切换不同的特效时当Effect中并没有定义USE_TEXTURE时会有警告,看下图:

file

通过对 EffectAsstes 属性检查,将此警告屏蔽掉了,以免在使用过程中产生产生烦人的提示,检查代码如下:

  1. //在材质对象上开启USE_TEXTURE定义
  2. let defineUserTexture = !!effectAsset.shaders.find(shader => shader.defines.find(def => def.name === 'USE_TEXTURE'));
  3. if (defineUserTexture) {
  4. material.define('USE_TEXTURE', true);
  5. }

同样,如果选择非动态Shader,同时为节点添加了 ShaderTime 组件,也会出现类似上面的警告,同样得到的修正:

  1. protected update(dt) {
  2. this._material = this.getComponent(cc.Sprite).sharedMaterials[0];
  3. if (this.node.active && this._material && this._material.effect._properties.time) {
  4. this._setShaderTime(dt);
  5. }
  6. }

代码Github地址:
https://github.com/ShawnZhang2015/ShaderHelper2

原文链接:http://www.cnblogs.com/creator-star/p/11606310.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号