cocos2d下,优秀骨骼spine的换装思路

语文老师说,文章要有个好开头!!!
最近正在引入spine骨骼代替dragon bone骨骼,既然要替代,那么原先在dragon bone上的一些额外需求,不管dragon bone上能不能实现,都应该在spine上尝试一番.
说带换装,spine自带的皮肤可以实现整体换装,这个应该不用介绍,setSkin一下就ok了.但是,策划往往会需要用到局部换装,一种情况下是该部件本身存在于皮肤下,这种情况下,只要能得到目标skin,目标slot,拿到目标相应的attachment , 替换一下即可 。

///////////////////////
//替换另一个皮肤下的某个部件
//for (int i = 0; i < skeleton->data->skinsCount; i++)
//{
//  if(! strcmp(skins[i]->name,"goblingirl"))
//  {
//  int index = spSkeleton_findSlotIndex(skeleton,"head");
//  attachment = spSkin_getAttachment(skins[i],index,"head");
//  spSlot_setAttachment(goblin->findSlot("head"),attachment);
//  }
//}
//////////////////////

方法不止一种,但思路都是一样的,这样就解决了皮肤间单独换装的问题。
最后一种最坑爹的需求就是希望能把一个自己的纹理放到骨骼中的某个部位。这个需求当时去网上找并没有找到什么有效的方法。自己摸索了一下大致是做出来了。
首先顺藤摸瓜,看看SkeletonRenderer是怎么渲染出整个骨骼动画的。在draw()方法下出现了某段代码:

for (int i = 0, n = skeleton->slotsCount; i < n; i++) {
        spSlot* slot = skeleton->drawOrder[i];
        if (!slot->attachment) continue;
        CCTexture2D *texture = nullptr;
        switch (slot->attachment->type) {
        case SP_ATTACHMENT_REGION: {
            spRegionAttachment* attachment = (spRegionAttachment*)slot->attachment;
            spRegionAttachment_computeWorldVertices(attachment, slot->bone, worldVertices);
            texture = getTexture(attachment);
            uvs = attachment->uvs;
            verticesCount = 8;
            triangles = quadTriangles;
            trianglesCount = 6;
            r = attachment->r;
            g = attachment->g;
            b = attachment->b;
            a = attachment->a;
            break;
        }
        case SP_ATTACHMENT_MESH: {
            spMeshAttachment* attachment = (spMeshAttachment*)slot->attachment;
            spMeshAttachment_computeWorldVertices(attachment, slot, worldVertices);
            texture = getTexture(attachment);
            uvs = attachment->uvs;
            verticesCount = attachment->verticesCount;
            triangles = attachment->triangles;
            trianglesCount = attachment->trianglesCount;
            r = attachment->r;
            g = attachment->g;
            b = attachment->b;
            a = attachment->a;
            break;
        }
        case SP_ATTACHMENT_SKINNED_MESH: {
            spSkinnedMeshAttachment* attachment = (spSkinnedMeshAttachment*)slot->attachment;
            spSkinnedMeshAttachment_computeWorldVertices(attachment, slot, worldVertices);
            texture = getTexture(attachment);
            uvs = attachment->uvs;
            verticesCount = attachment->uvsCount;
            triangles = attachment->triangles;
            trianglesCount = attachment->trianglesCount;
            r = attachment->r;
            g = attachment->g;
            b = attachment->b;
            a = attachment->a;
            break;
        }
        }
        if (texture) {
            if (slot->data->blendMode != blendMode) {
                batch->flush();
                blendMode = slot->data->blendMode;
                switch (slot->data->blendMode) {
                case SP_BLEND_MODE_ADDITIVE:
                    ccGLBlendFunc(premultipliedAlpha ? GL_ONE : GL_SRC_ALPHA, GL_ONE);
                    break;
                case SP_BLEND_MODE_MULTIPLY:
                    ccGLBlendFunc(GL_DST_COLOR, GL_ONE_MINUS_SRC_ALPHA);
                    break;
                case SP_BLEND_MODE_SCREEN:
                    ccGLBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_COLOR);
                    break;
                default:
                    ccGLBlendFunc(blendFunc.src, blendFunc.dst);
                }
            }
            color.a = skeleton->a * slot->a * a * 255;
            float multiplier = premultipliedAlpha ? color.a : 255;
            color.r = skeleton->r * slot->r * r * multiplier;
            color.g = skeleton->g * slot->g * g * multiplier;
            color.b = skeleton->b * slot->b * b * multiplier;
            batch->add(texture, worldVertices, uvs, verticesCount, triangles, trianglesCount, &color);
        }
    }
    batch->flush();

代码比较长,其实是遍历了所有slot,取出其下的attachment,根据type属性强转成对应类型的attachment计算或取出不同类型attachment渲染所需要的数据然后取出纹理根据数据进行渲染。
比较关键的一步是取出纹理,看到这步仿佛看到了春天,于是我写代码 把这个纹理取出来,创建成精灵显示在场景下时才发现,attachment->rendererObject->page->rendererObject 这个东西根本不是一个部位的纹理,所有部位的纹理取出来都是纹理集整个纹理,也就是像下面这样的大纹理。


其他平台的情况本人并不是很清楚,但是在cocos2d-x下,spine的骨骼动画是一个node读取了大量的数据,一个纹理渲染出来,所以并不存在可以获得单个纹理的接口。spine并没有专门对cocos2d-x做处理,而是从一大堆C语言写的代码上加了一个Node就完成了。
在此坑爹的情况下,此时的我是崩溃的。


cocos2d下,优秀骨骼spine的换装思路_第1张图片

我去spine详细地读了那篇用English写的简单文档.结合底层坑爹C语言代码后发现attachment->rendererObject实际上存放的是区域信息AtlasRegion,而Atlas Region下page则是页信息,page再向上一级就是最大的atlas,一个骨骼有一个atlas(暂时的想法是这样子的)而一个atlas有多个page,上图纹理集就是一个page,所以理论上而言可以用代码定义一个并不存在的page 将图片信息写入page->region->rendererObject,再将region定义出一个attachment放入slot中,渲染时就会顺着attachment->rendererObject->page->rendererObject一条线路读取到我们所放入的纹理。而其中复杂的数据如果顺序错误或遗漏则会引起渲染的结果畸形。

CCTexture2D* pTexture = CCTextureCache::sharedTextureCache()->addImage("CloseSelected.png");
    int attachmentType = slot->attachment->type;;
    switch (attachmentType)
    {
    case SP_ATTACHMENT_REGION:{
        
        

        break;}
    case SP_ATTACHMENT_MESH:{
        spMeshAttachment* attachment = (spMeshAttachment*)slot->attachment;
        spAtlas* atlas = goblin->getAtlas();
        spAtlasPage* page =  atlas->pages;
        spAtlasPage* newPage = spAtlasPage_create(atlas , "goblins-test.png");
        spAtlasRegion* region = ((spAtlasRegion*)attachment->rendererObject);
        spAtlasRegion* newRegion =  spAtlasRegion_create();
        CCTexture2D* newTexture = CCTextureCache::sharedTextureCache()->addImage("goblin-test4.png");
        newPage->format = page->format;
        newPage->magFilter = page->magFilter;
        newPage->minFilter = page->minFilter;
        newPage->name = page->name;
        newPage->rendererObject = newTexture;
        //newPage->rendererObject = NULL;
        newPage->width = 40;
        newPage->height = 40;
        newPage->uWrap = page->uWrap;
        newPage->vWrap = page->vWrap;
        newRegion->height= newPage->height;
        newRegion->width = newRegion->width;
        newRegion->offsetX = 0;
        newRegion->offsetY = 0;
        newRegion->originalHeight = newRegion->height;
        newRegion->originalWidth = newRegion->width;
        newRegion->name = region->name;
        newRegion->u = 0;
        newRegion->v = 0;
        newRegion->u2 = 1;
        newRegion->v2 = 1;
        newRegion->page = newPage;
        attachment->rendererObject = newRegion;
        attachment->regionU = newRegion->u;
        attachment->regionV = newRegion->v;
        attachment->regionU2 = newRegion->u2;
        attachment->regionV2 = newRegion->v2;
        attachment->regionRotate = newRegion->rotate;
        attachment->regionOffsetX = newRegion->offsetX;
        attachment->regionOffsetY = newRegion->offsetY;
        attachment->regionWidth = newRegion->width;
        attachment->regionHeight = newRegion->height;
        attachment->regionOriginalWidth = newRegion->originalWidth;
        attachment->regionOriginalHeight = newRegion->originalHeight;
        attachment->regionHeight = newRegion->height;

        spMeshAttachment_updateUVs(attachment);


        break;}
    case SP_ATTACHMENT_SKINNED_MESH:{
        spSkinnedMeshAttachment* attachment = (spSkinnedMeshAttachment*)slot->attachment;
        ((spAtlasRegion*)attachment->rendererObject)->page->rendererObject = pTexture;

        break;}
    default:{
        CCLog("%s" , "undisposed attachment type !~~~~ ");
        break;}
    }

以上是其中一种类型的attachment,经过上述实验后,我自己做的纹理成功地被替换到骨骼中 并且一切动作都正常,蒙皮效果也是正常的,但是可能由于数据并不够完整,新加入的纹理必须和原来的骨骼中相应部位的纹理一样大小,其实这也是可以理解的,如果大小不一样,原来的蒙皮会扭曲新纹理,从而出现畸形,可能其他类型的attachment如region类型可以实现替换的图像大于原大小,但是这种类型没有蒙皮效果也就是没有Mesh网格渲染效果,不够柔软,这样就失去了spine的特色。


cocos2d下,优秀骨骼spine的换装思路_第2张图片
cocos2d下,优秀骨骼spine的换装思路_第3张图片
cocos2d下,优秀骨骼spine的换装思路_第4张图片
cocos2d下,优秀骨骼spine的换装思路_第5张图片

--MT.Team
--MT.Lambda

你可能感兴趣的:(cocos2d下,优秀骨骼spine的换装思路)