DragonBones龍骨換裝（局部換裝+全局換裝）

參考：

Egret官方換裝動畫

Egret換裝三種方式 CSDN (全局換裝)

egret使用DragonBones實現簡單的換裝

 

換裝，主要是替換任意插槽的圖片，來達到局部換裝的目的。

游戲中可以只制作一個人物動畫，然后局部替換100套衣服、100套發型或者100種眼睛。甚至可以把人和衣服所有插槽都換了。

下圖替換了衣服。

     

 

 一、創建一個測試骨骼動畫

public armatureDisplay:dragonBones.EgretArmatureDisplay;

 

let factory = dragonBones.EgretFactory.factory;
factory.parseDragonBonesData(RES.getRes("test_ske_dbbin"));
factory.parseTextureAtlasData(RES.getRes("test_tex_json"), RES.getRes("test_tex_png"));
this.armatureDisplay = factory.buildArmatureDisplay(name);
this.addChild(this.armatureDisplay);}

　　

二、封裝的換裝類

    /**
     * 替換插槽
     * @param slotName 插槽名稱 原材料
     * @param textureName 圖片名  xxx_png
     * @param 偏移量
     */
    public setNewSlot( slotName:string, textureName:string ,offsetX:number=0, offsetY:number=0){
        var slot:dragonBones.Slot = this.armatureDisplay.armature.getSlot(slotName);
        var b:egret.Bitmap = new egret.Bitmap();
        b.texture = RES.getRes(textureName);
        b.x = slot.display.x;
        b.y = slot.display.y;
        b.anchorOffsetX = b.width/2 + offsetX;
        b.anchorOffsetY = b.height/2 + offsetY;
        slot.setDisplay( b );
    }

 

三、換裝。替換人和手的插槽。

this.setNewSlot("人", "people_png");
this.setNewSlot("手", "hand_png");

 

 

 四、全局換裝

全局換裝主要是使用replaceTexture來進行替換紋理圖。

假設有兩套皮膚分別是skin1.png和skin2.png，則兩張圖必須配置文件和圖片位置都一樣才能進行全局換裝

let armatureDisplay:dragonBones.EgretArmatureDisplay;
let factory = dragonBones.EgretFactory.factory;
factory.parseDragonBonesData(RES.getRes("test_ske_dbbin"));
factory.parseTextureAtlasData(RES.getRes("test_tex_json"), RES.getRes("test_tex_png"));
armatureDisplay = factory.buildArmatureDisplay(name);
this.addChild(armatureDisplay);}

 

armatureDisplay.armatureDisplay.armature.replaceTexture(RES.getRes("skin1_png"));  //皮膚1

armatureDisplay.armatureDisplay.armature.replaceTexture(RES.getRes("skin1_png"));  //皮膚2