推荐几个实用Cocos Creator插件！看过的都说好

2021年过半，Cocos Store 上目前已超过 400+ 资源，出现了有不少实用而有趣的插件工具，推荐几个给大家把玩，希望本文能对大家的工作有所帮助或启发！

嘴型动画生成

是一款专用于 Cocos Creator 的嘴型动画生成插件，它可以根据一段语音生成嘴型动画的 Animation Clip，适合用于制作游戏角色的说话动画，而且支持中英文语言。

上图是lipsync的主面板，下面我们简单介绍插件使用方法。

嘴型图

嘴型图，要求拖入6张必须的嘴型图A~F，嘴型说明如下：

• mouthA：用于发 “P”、 “B” 和 “M” 这类声音的闭合嘴型。和 Ⓧ 嘴型最接近，但嘴唇间有轻微的压力。
• mouthB：轻轻张嘴且牙齿闭合。用于发一些辅音（“S”、“T”、“K” 等）。也用于发一些诸如 bee 里的 "EE" 的元音。
• mouthC：张嘴。用于发诸如 men 里的 “EH” 和 bat 里的 “AE” 的元
• ......

其中 G、H、X 嘴型可选，但作者推荐都提供，这样最终生成的结果会更为自然，具体详细的嘴型要求，更多嘴型图的介绍可以看插件说明。

录音文件

本插件的功能是，根据说话的声音生成对应的动画，录音文件就是你要生成的嘴型动画的声音。支持WAV与OGG格式的音频文件。

生成目标动画

这里需要拖入一个 Cocos Creator 的 Aninmation Clip 文件，生成嘴型动画后该文件将会被覆盖。

配置好上述内容点击生成，我们将获得一段嘴型与声音匹配的一段动画，下图是在Cocos Creator中动画编辑器看到的效果。

资源链接

• 插件链接：http://store.cocos.com/app/detail/2572
• 教学视频：https://www.bilibili.com/video/BV1V5411G7cm/
• 示例代码：https://github.com/wzpan/lipsync-demo

Cocos Inspector

这是一款 Cocos Creator 节点树实时预览工具，基本功能如：

• 查看运行时场景节点树
• 实时节点属性监视、编辑
• 鼠标经过节点实时高亮

在0.0.3版本更新中，作者还提供了一个超实用的杀手锏功能：节点DrawCall分析，看下图：

而且作者积极聆听粉丝们的建议，做了不少界面 UI 的优化，0.1.1 版本还对FairyGUI进行了支持。

资源链接

• 插件链接：http://store.cocos.com/app/detail/2940
• 作者公众号：ByteTalking

快闪-代码编辑器

这是一个内嵌 Cocos Creator 的JS\TS代码编辑器，支持代码跳转、代码提示、自动补全等特性。

懒人功能

也许有会人问，为什么要用内置代码编辑器，用外置的VSCode编辑器不香么？来看看作者怎么说。

视频中只讲了一个点，快闪还有不少能让大家偷懒的功能：

1. 右键菜单直接生成getXXX/setXXX方法；
2. 在 Cocos Creator 资源管理器中，移动脚本后，自动修正脚本文件中 import 的文件路径；
3. 在 Cocos Creator 的场景编辑双击 Label 节点直接打字编辑文本；
4. 保存后自动格式化代码，自动加分号结束；
5. ......

资源链接

• 插件链接：http://store.cocos.com/app/detail/2940
• 作者Q群：569081407

建后自动压缩 PNG 资源

在第一次部署项目时，突然发现上传的资源包文件太大，怎么办？相信这款插件工具能帮助到你。

功能面板

插件使用的压缩引擎是pngquant 2.15.1，压缩质量的开关，以及文件夹和文件的排除功能，比直接使用命令行要贴心很多。

当我们构建完成后，可以看到插件开始工作，在Cocos Creator 控制台上，输出详细的压缩日志。

可喜的是，该插件是免费开源的，可以使用这款插件源码学习 Cocos Creator 插件的开发。

资源链接

• 插件链接：http://store.cocos.com/app/detail/2419
• 开源仓库：https://gitee.com/ifaswind/ccc-png-auto-compress

Shader Editor

Shader Editor 是一款用 Cocos Creator 制作的可视化 Shader 编辑器，内置上百个基础组件和特效组件，不仅能以插件方式运行，同时支持在网页中运行，方便随时使用。

编辑器特点

1. 对引擎无侵入式修改，完全纯净；
2. 支持 Creator 原生插件模式同时提供网页版的 Cloud / 云 模式，使用方便；
3. 大量内置特效组件， (目前多为基础组件，后续会添加更多复杂组件)；
4. 制作后导出特效为 Creator 原生支持的 .mlt + .effect 文件，因此可以方便地使用在各种平台上；
5. 全中文化（双语切换），编辑器所有功能全部中文化，包括所有组件的说明，文档；
6. 完整、丰富的在线文档，同时编辑器中内置同样完整的文档，包括大量演示视频及示例工程项目（可直接下载运行）。

Shader 教程

除上述功能外，作者还在积极输出相关文档、视频，并且在自己的微信公众号上连载Shader入门教程，已经更新到 0x0D 了！

同时教程中的 Shader 案例工程也上架到了 Cocos Store 并可直接应用到自己的项目中。

资源链接

• 插件链接：http://store.cocos.com/app/detail/2749
• B站视频：https://space.bilibili.com/1908055
• 作者公众号：SuperRaccoon

结语

今天就为大家分享这5款插件工具，感谢开发者们的热心分享。