CocosCreator入门（四） ------ 资源（细）

详尽介绍详见官网说明：https://docs.cocos.com/creator/manual/zh/asset-workflow

贴图

详尽介绍详见官网说明：https://docs.cocos.com/creator/manual/zh/asset-workflow/sprite.html

性能优化注意事项

使用单独存在的 Texture 作为 Sprite 资源，在预览和发布游戏时，将无法对这些 Sprite 进行批量渲染优化的操作。目前编辑器不支持转换原有的单张 Texture 引用到 Atlas 里的 SpriteFrame 引用，所以在开发正式项目时，应该尽早把需要使用的图片合成 Atlas（图集），并通过 Atlas 里的 SpriteFrame 引用使用。

另外，引擎中的 cc.macro.CLEANUP_IMAGE_CACHE 字段表示是否将贴图上传至 GPU 之后删除 DOM Image 缓存。具体来说，我们通过设置 image.src 为空字符串来释放这部分内存。正常情况下，可以不需要开启这个选项，因为在 web 平台，Image 对象所占用的内存很小。但是在微信小游戏平台的当前版本，Image 对象会缓存解码后的图片数据，它所占用的内存空间很大。所以我们在微信小游戏平台默认开启了这个选项，在上传 GL 贴图之后立即释放 Image 对象的内存，避免过高的内存占用。

自动图集

预览项目或者在 Cocos Creator 中使用碎图的时候都是直接使用的碎图资源，在 构建项目 这一步才会真正生成图集到项目中。

注意：如果碎图开启了 Alpha 预乘，那么在生成图集时会失效。若需要使用预乘功能，可在图集上勾选 Premultiply Alpha。

格式：AutoAtlas.pac

Separate Alpha

ETC1 和 PVR 格式都会用一个固定的空间来存储每个像素的颜色值。当需要存储 RGBA 4 个通道时，图片的显示质量可能会变得非常低。所以提供了一个 Separate Alpha 选项，该选项会将贴图的 Alpha 通道提取出来合并到贴图下方，然后整张贴图按照 RGB 3 个通道的格式来压缩。这样子每个通道的存储空间都得到了提升，贴图的质量也就提升了。

图像资源的自动剪裁

自带位置信息的序列帧动画

有很多动画师在绘制序列帧动画时，会使用一张较大的画布，然后将角色在动画中的运动直接通过角色在画布上的位置变化表现出来。在使用这种素材时，我们需要将 Sprite 组件 的 Trim 设为 false，将 Size Mode 设为 RAW。这样动画在播放每个序列帧时，都将使用原始图片的尺寸，并保留图像周围透明像素的信息，这样才能正确显示绘制在动画中的角色位移。

而 Trim 设为 true，则是在位移完全由角色位置属性控制的动画中，更推荐使用的方式。

TexturePacker 设置

在制作序列帧动画时，我们通常会使用 TexturePacker 这样的工具将序列帧打包成图集，并在导入后通过图集资源下的 SpriteFrame 来使用。在 TexturePacker 中输出图集资源时，Sprites 分类下的 Trim mode 请选择 Trim，一定不要选择 Crop, flush position，否则透明像素剪裁信息会丢失，您在使用图集里的资源时也就无法获得原始图片未剪裁的尺寸和偏移信息了。

文本资源

https://docs.cocos.com/creator/manual/zh/asset-workflow/text.html

Creator 从 1.10 开始正式支持了文本文件。常见的文本格式，如 .txt, .plist, .xml, .json, .yaml, .ini, .csv, .md，都会导入为 cc.TextAsset。

你可以直接为组件关联一个 TextAsset：

    // 声明
    file: {
        default: null,
        type: cc.TextAsset,
    },

    // 读取
    var text = this.file.text;

也可以动态加载：

    cc.loader.loadRes(url, function (err, file) {
        cc.log(file.text);
    });

艺术数字资源 

战斗漂字制作 *.labelatlas

https://docs.cocos.com/creator/manual/zh/asset-workflow/label-atlas.html

字体资源

讲述fnt、png字体添加，怎么图集优化。

https://docs.cocos.com/creator/manual/zh/asset-workflow/font.html

粒子资源（ParticleSystem）

.plist

https://docs.cocos.com/creator/manual/zh/asset-workflow/particle.html

在项目中的存放

为了提高资源管理效率，建议将导入的 plist 和 png （如果有使用贴图）文件存放在单独的目录下，不要和其他资源混在一起。

声音资源

https://docs.cocos.com/creator/manual/zh/asset-workflow/audio-asset.html

骨骼动画资源（Spine）

https://docs.cocos.com/creator/manual/zh/asset-workflow/spine.html

Creator v2.2.0 及以上支持 Spine v3.7）。

骨骼动画所需资源有：

• .json 骨骼数据
• .png 图集纹理

• .txt/.atlas 图集数据

  

 

骨骼动画资源（DragonBones）

https://docs.cocos.com/creator/manual/zh/asset-workflow/dragonbones.html

DragonBones 骨骼动画资源是由 DragonBones 编辑器导出的数据格式（支持 DragonBones v5.6.2 及以下）。

导入 DragonBones 骨骼动画资源

DragonBones 骨骼动画资源有：

• .json 骨骼数据
• .json 图集数据
• .png 图集纹理

 

在项目中的存放

为了提高资源管理效率，建议将导入的资源文件存放在单独的目录下，不要和其他资源混在一起。

详尽介绍详见官网说明：