Cocos Creator spine打包成zip下载并解压

最新推荐文章于 2024-08-14 15:39:42 发布

无声Silence

最新推荐文章于 2024-08-14 15:39:42 发布

阅读量466

点赞数 2

文章标签： spine typescript cocos2d

本文链接：https://blog.csdn.net/wenyanning/article/details/137465528

版权

文章介绍了如何在CocosCreator中将spine资源压缩成zip文件，以便于管理和网络下载。通过JSZip库解压zip，UPNG解压图片，实现了spine数据的加载和骨骼动画的播放。

摘要由CSDN通过智能技术生成

Cocos Creator spine打包成zip下载并解压

业务上的小需求，相关的spine想压缩成一个zip方便管理和外包，也想着游戏里也这么用，但着急上线，就需要网络下载，常规办法是spine打包成3个文件，之后分别下载，代码如下

let comp = this.getComponent('sp.Skeleton') as sp.Skeleton;
let image = "http://localhost/download/spineres/1/1.png";
let ske = "http://localhost/download/spineres/1/1.json";
let atlas = "http://localhost/download/spineres/1/1.atlas";
assetManager.loadAny([{ url: atlas, ext: '.txt' }, { url: ske, ext: '.txt' }], (error, assets) => {
    assetManager.loadRemote(image, (error, texture: Texture2D) => {
        let asset = new sp.SkeletonData();
        asset.skeletonJson = assets[1];
        asset.atlasText = assets[0];
        asset.textures = [texture];
        asset.textureNames = ['1.png'];
        skeleton.skeletonData = asset;
    });
});

方法很常规，但有个管理问题，就是可能在文件迁移或者管理的时候不明晰，容易混（其实还是运营和后端对自己不关心的东西不在意觉得烦而已），于是乎压缩成zip就相当方便了

            cc.assetManager.loadRemote(this._sub1Data.gameAnimationURL, (err, zipBin: any) => {
                if (err) return;
                if (this && this.isValid) {
                    JSZip.loadAsync(zipBin._buffer).then((zip) => {
                        zip.file(spineName + ".png").async('uint8array').then((data3) => {
                            zip.file(spineName + ".atlas").async("text").then((data2) => {
                                zip.file(spineName + ".json").async("text").then((data1) => {
                                    let asset = new sp.SkeletonData();
                                    asset.skeletonJson = data1;
                                    asset.atlasText = data2;
                                    asset['_uuid'] = '43534'
                                    let texture = new cc.Texture2D();
                                    const UPNG = window['UPNG'];
                                    let png = UPNG.decode(data3.buffer);
                                    let flag = texture.initWithData(png.data,cc.Texture2D.PixelFormat.RGBA8888,png.width, png.height);
                                    console.log("flag_"+flag);
                                    texture.handleLoadedTexture();
                                    asset['textureNames'].push(spineName + ".png");
                                    asset.textures.push(texture);
                                    spine.skeletonData = asset;
                                    imageNode.active = false;
                                    spine.node.active = true;
                                    spine.setAnimation(0, 'animation', true);
                                })
                            });
                        })
                    });
                }
            })