Changing Sprite

Cocos Creator
#1

I have searched in here and followed all threads but nothing seems to work.

All I want to do is change the sprite frame associated with a node.

What do I need to do to change it?

I have tried

    var image = cc.url.raw("resources/texture/game/newsprite.png");
    var texture = cc.textureCache.addImage(image);
    this.playerDeadNode.getComponent(cc.Sprite).spriteFrame.setTexture(texture);

but nothing

I have tried

var sprite = this.playerDeadNode.getComponent(cc.Sprite);
cc.loader.loadRes(“resources/texture/game/newsprite.png”, function(err, data) {
this.spriteFrame = new cc.SpriteFrame(data);
}.bind(sprite));

but nothing.

Any ideas?

#2

OK I found a possible solution…

This thread : [SOLVED] Setting texture of spriteFrame applies to all instances

Lead me to change

var image = cc.url.raw("resources/texture/game/newsprite.png");
var texture = cc.textureCache.addImage(image);
this.playerDeadNode.getComponent(cc.Sprite).spriteFrame.setTexture(texture);

to

    var image = cc.url.raw("resources/texture/game/newsprite.png");
    var texture = cc.textureCache.addImage(image);
    this.playerDeadNode.getComponent(cc.Sprite).spriteFrame= new cc.SpriteFrame(texture);

its using the new cc.SpriteFrame(texture); that made the difference.

However I am getting this warning when running browser…

“It’s not recommended to use SpriteFrame constructor (new SpriteFrame) because its memory usage can’t be tracked in native environment, if you know what you are doing, you may need to manually retain it after creation then release it when you no longer need it.”

Would be cool to get some feed back on this from cocos guys.

Thanks

1 Like
#3

I don’t have answers, but this is something i’m curious about as well.

I used to use TexturePacker’s atlases, and we could change spriteFrame by having a reference to the atlas :

    spriteTexture: {default: null, type: cc.SpriteAtlas}

Then accessing one of it’s image by name :

this._spriteFrame = this.spriteTexture.getSpriteFrame(spriteFrameName);

However, I’m switching from TexturePacker to AutoAtlas. Therefore I’m also looking for a new way to change atlas by name.

So I’m going to use what you just shared until we have more feedback from the Cocos team;
So thanks for your post :slight_smile:

(By feedback, I mean it would be nice to have someone’s opinion on which way is best performance-wise etc.)

#4

Autoatlas is designed to be very transparent from script’s point of view, for example autoatlases are not generated in preview run - individual sprites are used instead. So referencing spriteframes would be a good way:

properties: { spriteFrame : cc.SpriteFrame }

If you want to reference spriteframes specifically by name (e.g. generating frame names on fly: run01.png etc.), you can use cc.loader.loadRes and cc.loader.getRes. But loading proccess details may differ on different platforms, so you may have some issues writing code that would work on all platforms + debug preview runs. I would rather see if there are other suitable ways to link assets through editor, switching sprites in an Animation for instance.