COCOS动态加载问题

Question

            var url = {
                atlasUrl: "http://47.96.2.87:8080/guai.plist", // 图集plist文件地址
                atlasTextureUrl: "http://47.96.2.87:8081/guai.png", // 图集纹理图片地址
            };
             
            cc.assetManager.loadRemote(url.atlasUrl,function(err, atlas) {


            console.log(atlas)  //打印ATLAS没有问题
              
                cc.loader.load({url: url.atlasTextureUrl, type: 'png'}, function(err, texture) {
                  
                   
                    var spriteFrame1 = new cc.SpriteFrame(texture);
                    ent.getComponent(cc.Sprite).spriteFrame = spriteFrame1 //显示图片也没有问题




                    var spriteFrame = atlas.getSpriteFrame('1');      
                    atlas.texture = texture;
                   ent1.getComponent(cc.Sprite).spriteFrame = spriteFrame;   //把plist 和png合一就报错 atlas.getSpriteFrame is not a function

      
                });
            });

atlas.getSpriteFrame is not a funct。何解

Answer 1

引自免费微信小程序：皆我百晓生：

在Cocos Creator 中，您尝试通过动态加载方式获取远程plist和png文件，并将它们组合成一个可被cc.Sprite组件使用的精灵帧（SpriteFrame）。从您的代码片段来看，错误信息提示atlas.getSpriteFrame is not a function，这表明您对从cc.assetManager.loadRemote加载得到的atlas对象调用了不正确的接口。

实际上，在Cocos Creator中，当您加载完.plist文件后，它会被解析为一个cc.SpriteAtlas对象，这个对象确实提供了获取精灵帧的方法getSpriteFrame。然而，由于cc.assetManager.loadRemote对于.plist文件的加载是异步的，您需要确保在.plist文件完全加载并解析为cc.SpriteAtlas之后再尝试获取精灵帧。

针对您的情况，应当首先确保atlasUrl指向的是一个有效的.plist文件，并且在.plist文件加载完成后的回调函数内部操作相关的cc.SpriteAtlas对象。这里的问题可能在于texture加载完成后您直接设置了atlas.texture，但atlas在此时并非完整的cc.SpriteAtlas实例。

调整后的代码示例如下：

var url = {
    atlasUrl: "http://47.96.2.87:8080/guai.plist",
    atlasTextureUrl: "http://47.96.2.87:8081/guai.png"
};

// 异步加载plist文件
cc.assetManager.loadRemote(url.atlasUrl, function (err, atlasInfo) {
    if (err) {
        console.error('Failed to load atlas:', err);
        return;
    }

    // 确保atlasInfo已经被转换为SpriteAtlas类型
    cc.loader.loadRes(atlasInfo.path, cc.SpriteAtlas, function (err, atlas) {
        if (err) {
            console.error('Failed to load SpriteAtlas:', err);
            return;
        }

        // 同步加载纹理图片
        cc.loader.load({url: url.atlasTextureUrl, type: 'png'}, function (err, texture) {
            if (err) {
                console.error('Failed to load texture:', err);
                return;
            }

            // 将纹理赋给SpriteAtlas
            atlas.texture = texture;

            // 此时可以安全地获取SpriteFrame
            var spriteFrame = atlas.getSpriteFrame('1');
            
            // 给实体设置精灵帧
            var ent1 = ... // 获取ent1实体
            var spriteComp = ent1.getComponent(cc.Sprite);
            if (spriteComp) {
                spriteComp.spriteFrame = spriteFrame;
            } else {
                console.error('No cc.Sprite component found on entity.');
            }
        });
    });
});

注意：

1. cc.assetManager.loadRemote返回的信息需要进一步通过cc.loader.loadRes加载为cc.SpriteAtlas。
2. 上述代码片段中的ent1变量应替换为您实际需要设置精灵帧的游戏对象引用。