Cocostudio skeletal animation to code sample

cocos2d-x JavaScript
#1

Hi! :smile:
Can you show me an example on how to use the skeletal animation made with cocostudio…
So far I already made the animation, and when I export it it has only the .json file,
but when i added it in a scene it is not animating…
I have a daragon.csd that hast the animation
then a dragonLayer.csd that has a background and the animated sprite(dragon.csd) inside it…

is it seems like it is not automatically animating…

how can I access this animation and play it?..
can you guys show me an example? I have search the net but their examples are already deprecated… thanks!

and btw when i said skeleton/skeletal, what i mean is bone… i dont know if it is different with armature… cuz when i drag the armature in to the scene it just a single sprite, but mine is separate images animated with bones… and when i export it cocostudio it doesnt have a plist, its just one big json file

@Zinitter @doanhieuthien @Dredok

#2

@eydamson

I didn’t use skeletal animation before.

I think you can try check “Spine Test” in the test case.
http://cocos2d-x.org/js-tests/

var spineBoy = new sp.SkeletonAnimation('res/skeletons/spineboy.json', 'res/skeletons/spineboy.atlas');

From the post v3.7.1 Cocos2d-x&JS v3.7.1 is released
v3.7.1 and Cocos 2.3.2, we are providing a new skeleton animation system which is different from Armature.
which stated skeleton is different from Armature.

#3

Hey thanks, but I already found the solution…
I just find the child node containing the animations and play the animation based on the frames that i want to play… thanks man… :smiley:

#4

Hi, since you got it to work maybe you can help me do the same :smiley:
I have a skeleton animation I made in Cocostudio 2. I’m using Cocos2d-JS v3.7.1. The animation is 30 frames, and I named it “dance”. here’s my code:

        var skeleton = ccs.load (res.Skeleton_json);
    this.addChild(skeleton.node);
    skeleton.node.x = size.width/2 + 100;
    skeleton.node.y = size.height/2;
    
    var action2 = skeleton.action;
    if (action2)
    {
        skeleton.node.runAction(action);
        action2.play("dance",true);
    }

I get a syntax error when I run it:

SyntaxError: unreachable code after return statement

in CCSpriteFrameCacheHelper.js

here is the function, I think:

    /**
 * Returns texture atlas with texture.
 * @param texture
 * @returns {*}
 */
getTextureAtlasWithTexture:function (texture) {
    //todo
    return null;
    var textureName = texture.getName();
    var atlas = this._textureAtlasDic[textureName];
    if (atlas == null) {
        atlas = new cc.TextureAtlas(texture, 20);
        this._textureAtlasDic[textureName] = atlas;
    }
    return atlas;
},

Anyone know if that’s a bug, or if I’m doing it wrong?

#5

for me runAction is redundant, its working even if you omit that.

i think you got to make sure that the action is not null that it has the animation it self…

and i used this action.gotoFrameAndPlay(startFrame,endFrame,true); instead of action.play()
try to use this, hope it helps :smile:

#6

The function is buggy… the line just below “//todo” is returning null regardless of the input. i think you need to remove the 3rd line of the function quoted below:

return null;

and replace it with the line below.

if(texture == null) return null;

That should get things done. :smile: