[cocos2d-iphone] dynamic image on spine animation

logiebear

Note: Sorry about the links. I can't seem to use [url] tags.

Hi I've been working with the official cocos2d-iphone runtime for Objective-C and it's been working great so far. I have been having trouble trying to programmatically set an image on a spine animation. In short, what I would really like to do is to create a RegionAttachment from a dynamic UIImage/CCSprite and set it into an existing slot of my animation. I did some searching and found a thread that is similar to what I am trying to do: http://esotericsoftware.com/forum/viewtopic.php?f=7&t=1870

This thread lead me to another thread with an answer: http://esotericsoftware.com/forum/viewtopic.php?f=3&t=1554&p=7796&hilit=+cocos2d+attachment#p7627

I've been following the answer in this second thread, but I have been having trouble adapting it for the latest version of spine and cocos2d v3.4. I've been having two main problems.

) The implementation in the answer in the second link above shows creating a CCTextureAtlas from a CCTexture2D in the following method:

-(RegionAttachment*) regionWithTexture2d:(CCTexture2D*)tex2d name:(NSString*)_name{
    CCTextureAtlas *tex = [[CCTextureAtlas alloc] initWithTexture:tex2d capacity:128];
    ...

However in cocos2d v3.4, CCTextureAtlas has been retired. I've been trying to work around it by using a CCTexture instead and setting that directly as the renderObject, but I'm not sure if this is correct.

2.) The original implementation also created an AtlasPage with just a name before as follows:

AtlasPage *page = AtlasPage_create([_name UTF8String]);

However in the latest spine version, the AtlasPage_create() requires an Atlas and name as follows:

spAtlasPage* spAtlasPage_create (spAtlas* atlas, const char* name);

I'm not sure what to put as the atlas here. I've tried to put different things into spAtlas_create() or spAtlas_createFromFile(), but no matter what I do it just seems to crash.

Any help anyone can offer will be greatly appreciated! Thank you!

jpoag

According to https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2d-iphone/3/src/spine/SkeletonRenderer.m#L284 , the rendererObject is expected to be a CCTexture, so you should be good.
spAtlasPage_create() expects an atlas. Let's walk through an example of how a SkeletonAnimation gets it's skin.

In the examples for cocos2d-iphone/3, both the goblins and SpineBoy examples are loading using "filenames" for the SkeletonData.JSON and .Atlas. But this is for single animation. What if you wanted to clone a bunch of spineboys?
SkeletonRenderer::initWithFile loads the .atlas file, creates a json loader with the atlas as it's texture lookup, and loads the skeleton data from the file. The skeletondata is like a little database that is used to create initial poses in the skeleton as well as lookup stuff. Skeleton data can be shared between SkeletonAnimation instances.
When the JSON loader needs to lookup an image, it hits the spAtlas*. When spAtlas needs to load a texture, it uses create_texture

I think technically, after the SkeletonData is loaded, no one has any more use for the Atlas. You can't unload it while the spine animations that are using it are still around because it will takedown the CCTextures.

However, if you're the one creating the SkeletonData using a customized spAtlas, then you need to keep it around until it's time to die.

So,

Create an spAtlas, etiher from a file or new.
Add pages to the atlas
Use your custom spAtlas to load SkeletonData.JSON
Use skeletonData to create SkeletonAnimations

And don't release the skeletonData or spAtlas until all the animations using it are gone.

logiebear

Hi James,

Thank you for your response. We've managed to get the app to not crash by using a image to create a spAtlas. However, now when we run it, the slot is now just blank. It sounds familiar to what you mentioned in your post about keeping the customized spAtlas around, but I'm not sure what that means exactly or how to keep it around since spAtlas is a struct. I've attached my code below for reference.

- (spRegionAttachment [i])regionWithTexture:(CCTexture[/i])tex2d name:(NSString*)name
{
    NSString *path = [[NSBundle mainBundle] pathForResource:@"test" ofType:@"png"];
    spAtlas *tex = spAtlas_createFromFile([path UTF8String], (__bridge void *)(tex2d));
    spAtlasPage *page = spAtlasPage_create(tex, [name UTF8String]);
    

page->width = tex2d.contentSizeInPixels.width;
page->height = tex2d.contentSizeInPixels.height;

spAtlasRegion *reg = spAtlasRegion_create();
reg->page = page;

spRegionAttachment *region = spRegionAttachment_create([name UTF8String]);
region->rendererObject = reg;

CGSize size = tex2d.contentSizeInPixels;
float u = 0;
float u2 = 1;
float v = 0;
float v2 = 1;
spRegionAttachment_setUVs(region,u,v,u2,v2,0);

spSlot *slot = [self.skeletonNode findSlot:name];
spRegionAttachment* attachment = (spRegionAttachment*)slot->attachment;

region->regionOffsetX = 0;
region->regionOffsetY = 0;
region->regionWidth = size.width;
region->regionHeight = size.height;
region->regionOriginalWidth = region->regionWidth; // same if not doing whitespace stripping
region->regionOriginalHeight = region->regionHeight;

region->x = attachment->x;
region->y = attachment->y;
region->scaleX = attachment->scaleX;
region->scaleY = attachment->scaleY;
region->rotation = attachment->rotation;
region->width = size.width;
region->height = size.height;
spRegionAttachment_updateOffset(region);

return region;
}

jpoag

At this point, you'll have to add in some debug breakpoints and hover over the code to examine everything to make sure it's filled in the way you're expecting.

Throw a debug break point at the return of the function you posted and hand check everything. Then, break in the SkeletonRenderer draw routine and keep hitting continue until you get the region attachment that isn't drawing. Then break step through the generation of the mesh.

logiebear

I've managed to get the image to show by setting rendererObject of the AtlasPage to the CCTexture, but now it shows for a split second before crashing. I added some breakpoints in the draw method of the SkeletonRenderer (where the crash occured) and discovered that the crash is due to the texture being nil on the slot with the custom attachment. For the first iteration of all the slots, the texture is there so the image appears. However, during the next iteration, the texture disappears and thus it crashes on setting the texture.

This sounds almost exactly like what James was describing with the CCTexture getting taken down. I'm still not sure what it means to keep the spAtlas around in order to prevent the texture from disappearing. Please advise! Thank you!

jpoag

http://stackoverflow.com/questions/7036350/arc-and-bridged-cast

I suspect that the __bridge isn't enough to keep the ARC garbage collector from trashing the CCTexture.

Nate

It sounds like you are very close. I suggest looking more at the crash. Why is it crashing? Has something been released that shouldn't have been? Why wasn't it retained?

logiebear

Yes! It turns out it was the __bridge cast that wasn't retaining the CCTexture. Replacing the cast with (void *)CFBridgingRetain(tex2d) fixed the problem. Thank you @jpoag for all your help!

To note, when using a CCSprite, the image would rotate and flip the image causing me to need to perform the opposite transformations on the image beforehand. However, if I just used a UIImage and CCTexture instead, I only needed to scale the image to the right size. I've attached my final code below.

Code for changing head to Icon.png:

UIImage *image = [UIImage imageNamed:@"Icon.png"];
CCTexture *texture = [[CCTexture alloc] initWithCGImage:image.CGImage contentScale:image.scale];
[self.skeletonNode setCCTexture:texture intoSlot:@"head"];

Extension on SkeletonAnimation:

- (bool)setCCTexture:(CCTexture *)texture intoSlot:(NSString *)slotName
{
    spRegionAttachment *reg = [self regionWithTexture:texture
                                                 name:slotName];
    spSlot *slot = [self findSlot:slotName];
    if (slot != nil && reg != nil) {
        spSlot_setAttachment(slot,(spAttachment *)reg);
        return true;
    } else {
        return false;
    }
    

return false;
}

- (spRegionAttachment *)regionWithTexture:(CCTexture *)tex2d name:(NSString *)name
{
    spAtlasPage *page = spAtlasPage_create(0, [name UTF8String]);
    page->rendererObject = (void *)CFBridgingRetain(tex2d);
    

    page->width = tex2d.contentSizeInPixels.width;
    page->height = tex2d.contentSizeInPixels.height;
    

    spAtlasRegion *reg = spAtlasRegion_create();
    reg->page = page;
    

    spRegionAttachment *region = spRegionAttachment_create([name UTF8String]);
    region->rendererObject = reg;
    

    CGSize size = tex2d.contentSizeInPixels;
    float u = 0;
    float u2 = 1;
    float v = 0;
    float v2 = 1;
    spRegionAttachment_setUVs(region,u,v,u2,v2,0);
    

    spSlot *slot = [self findSlot:name];
    spRegionAttachment* attachment = (spRegionAttachment*)slot->attachment;
    

    region->regionOffsetX = 0;
    region->regionOffsetY = 0;
    region->regionWidth = size.width;
    region->regionHeight = size.height;
    region->regionOriginalWidth = region->regionWidth; // same if not doing whitespace stripping
    region->regionOriginalHeight = region->regionHeight;
    

    region->x = attachment->x;
    region->y = attachment->y;
    region->scaleX = attachment->scaleX;
    region->scaleY = attachment->scaleY;
    region->rotation = attachment->rotation;
    region->width = size.width;
    region->height = size.height;
    spRegionAttachment_updateOffset(region);
    

    return region;
}

Thank you again for your help!

jpoag

No problem.

shengyincan

in spine-cocos2dx.ccp # SkeletonRenderer#_atlas, when will it set to 0 except the de-constructor of SkeletonRenderer?