前言
顾名思义:就是把spine 从任何一个远程服务器加载到本地并正确显示。
和本地加载的共同点就是都要加载到内存里面。
操作
废话不多,直接上代码。
// var spineNode = new cc.Node();
// var skeleton = spineNode.addComponent(sp.Skeleton);
// this.node.addChild(spineNode);
varimage = info.img; // “http://localhost:8080/download/spineres/1/laba.png“;
varske = info.json; // “http://localhost8080/download/spineres/1/laba.json“;
varatlas = info.atlas; // “http://localhost8080/download/spineres/1/laba.atlas“;
cc.assetManager.loadAny([{ url:atlas, ext:’.txt’ }, { url:ske, ext:’.txt’ }], (error, assets) => {
cc.assetManager.loadRemote(image, (error, texture) => {
varasset = newsp.SkeletonData();
asset.skeletonJson = assets[1] ;
asset.atlasText = assets[0];
asset.textures = [texture];
letstrs = asset.atlasText.split(‘\n’);
letimages = [];
for(leti = 0; i < strs.length; ++i){
if(strs[i].indexOf(“.png”) != -1){
images.push(strs[i]);
}
}
asset[‘textureNames’] = images;
this.spine.skeletonData = asset;
// 效果不佳
// let animations = Object.keys(asset.skeletonJson.animations);
// let animation = animations[Math.floor(Math.random() * animations.length)];
// this.spine.animation = animation;
// this.spine.paused = true;
letskins = Object.keys(asset.skeletonJson.skins);
if(skins.length > 1){
if(skins[0] != ‘default’){
this.spine.setSkin(skins[0]);
}else{
this.spine.setSkin(skins[1]);
}
}
// 调整适配尺寸
if (this.spine.node.width > 100 && this.spine.node.height < 100) {
letaxio = 100 / this.spine.node.width;
this.spine.node.scale = axio;
}
elseif (this.spine.node.width < 100 && this.spine.node.height > 100) {
letaxio = 100 / this.spine.node.height;
this.spine.node.scale = axio;
}
elseif (this.spine.node.width > 100 && this.spine.node.height > 100){
letaxioY = 100 / this.spine.node.height;
letaxioX = 100 / this.spine.node.width;
if(this.spine.node.width >= this.spine.node.height){
this.spine.node.scale = axioX;
}else{
this.spine.node.scale = axioY;
}
}
});
});
如果远程spine文件是二进制
// var spineNode = new cc.Node();
// var skeleton = spineNode.addComponent(sp.Skeleton);
// this.node.addChild(spineNode);
// var image = info.img; // “http://localhost:8080/download/spineres/1/laba.png“;
// var ske = info.json; // “http://localhost8080/download/spineres/1/laba.json“;
// var atlas = info.atlas; // “http://localhost8080/download/spineres/1/laba.atlas“;
// cc.assetManager.loadAny([{ url: atlas, ext: ‘.txt’ }, { url: ske, ext: ‘.bin’ }], (error, assets) => {
// cc.assetManager.loadRemote(image, (error, texture) => {
// var asset = new sp.SkeletonData();
// asset._nativeAsset = assets[1];
// asset.atlasText = assets[0];
// asset.textures = [texture];
// asset.textureNames = [‘1.png’];
// skeleton.skeletonData = asset;
// });
// });
效果示意:
参考备注:
https://forum.cocos.org/t/cocos-creator-2-0-x-cc-loader-load-spine/71353
https://docs.cocos.com/creator/manual/zh/getting-started/faq.html
