龙骨动画学习四：动态换肤

在项目中我们经常会有这样写需求：更换角色皮肤，更换角色使用的武器，更换场景等。

本文演示一个更换角色使用的武器。

根据需求我们发现其实就是更换插槽的图片而已。

dragonbones.js中提供了对应的接口：

        /**
         * - 用特定的显示对象数据替换特定插槽当前的显示对象数据。
         * 用 "dragonBonesName/armatureName/slotName/displayName" 指定显示对象数据。
         * @param dragonBonesName - DragonBonesData 实例的缓存名称。
         * @param armatureName - 骨架数据名称。
         * @param slotName - 插槽数据名称。
         * @param displayName - 显示对象数据名称。
         * @param slot - 插槽。
         * @param displayIndex - 被替换的显示对象数据的索引。 （如果未设置，则替换当前的显示对象数据）
         * @version DragonBones 4.5
         * @language zh_CN
         */
        replaceSlotDisplay(dragonBonesName: string, armatureName: string, slotName: string, displayName: string, slot: Slot, displayIndex?: number): boolean;

/**
 * 龙骨动画换肤
 */
class DBTestScene5 extends eui.UILayer{
    constructor(){
        super();
        this.init();
        
    }

    private init(){
        this.createDagonbonesAnimation();

        let btn:eui.Button = new eui.Button();
        btn.label = "更换武器";
        btn.horizontalCenter = 0;
        btn.verticalCenter = 0;
        this.addChild(btn);
        btn.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onTap,this);
    }

    private index = 0;
    private onTap(){
        let textureArr:string[] = ["sword","knife"];
        this.index++;
        let textureName = textureArr[this.index%2];
        console.log(textureName);
        
        this.factory.replaceSlotDisplay("theWarrior","warrior","hand_weapon",textureName,this.armatureDisplay.armature.getSlot("hand_weapon"))
       

    }
    private factory:dragonBones.EgretFactory;
    private armatureDisplay:dragonBones.EgretArmatureDisplay;

    

    private createDagonbonesAnimation(){
        let factory:dragonBones.EgretFactory =  new dragonBones.EgretFactory();
        this.addDragonbonesDataToFactory(factory,"theWarrior");
        this.factory = factory;

        let theWarrior:dragonBones.EgretArmatureDisplay = factory.buildArmatureDisplay("warrior");
        theWarrior.x = 300;
        theWarrior.y = 300;
        this.addChild(theWarrior);
        theWarrior.animation.play("alert");
        this.armatureDisplay = theWarrior;
         
    }
    private addDragonbonesDataToFactory(factory:dragonBones.EgretFactory,ResName:string){
        factory.parseDragonBonesData(RES.getRes(ResName+"_ske_json"));
        factory.parseTextureAtlasData(RES.getRes(ResName+"_tex_json"),RES.getRes(ResName+"_tex_png"));
    }


}

标签：换肤,动画,string,龙骨,factory,private,dragonBones,param,theWarrior
来源： https://www.cnblogs.com/thankspipi/p/15186454.html