龙骨使用自定义SpriteFrame尺寸不一致导致的bug

730 阅读2分钟

问题表现

后续过程中反馈了一个问题,局部换肤后,换肤的图片非常大

image.png

问题排查

第一反应是dragonBones节点发生了缩放,排查后发现并没有

对比了前后的ske.json,发现龙骨工程调整了龙骨的长度

image.png

应该是为了减小龙骨的整体体积,加快游戏的加载速度,制作人员使用了更小的图片,这也解释了龙骨整体看起来变小的原因。

同时龙骨的纹理图片tex.json也发生了变化,比如下图中

image.png

比如上图中yu10.png这个纹理在换肤的plist龙骨的tex.json中的width/height是一致的,龙骨调整后,两者就不一致了。

image.png

并且我发现换肤的局部纹理,比龙骨的纹理,到这里基本就确认了就是换肤的散图纹理尺寸不一致导致的这个bug。

如何修复

既然换肤纹理是等比例放大了,那么我只需要知道龙骨在运行时显示的width/height即可,即使替换的纹理皮肤非常大,渲染时也会将其限定在指定的区域,这样分析下去的话,就是我使用了替换纹理的尺寸导致的异常。

image.png

对比发现,在龙骨的导出数据中记录的有这个width/height信息,尝试者修改:

image.png

我参考了引擎之前的实现逻辑,简单粗暴的替换了region,这个是使用默认龙骨纹理的区域信息,因为同一个部件在不同的图集纹理里面xy坐标是不一样的,所以也就导致了上图中的纹理发生了错乱

那么纹理的uv使用替换的皮肤纹理,而顶点的xy则使用龙骨的,最终修改如下:

image.png

修改后就正常了

image.png

总结

这个问题虽然修复了,但是也暴露制作过程中的不规范,换肤就应该尺寸一致

现在是将这个问题修复了,但是并没有校验替换的皮肤纹理是否和region成比例,如果比例不一致,就算发生缩放,也会显示异常,不过如果都出现了不一致的情况,肯定就是制作人员的问题了,这里我就没有再深入优化了。

这个功能本身就是hack了Engine的一些api,所以目前只是照顾到了cacheMode.RELATIME的模式,其他缓存模式下肯定还会有问题,项目暂时限定使用这个模式来规避这个问题,就懒得再深入搞了。