pixijs / spine

Pixi.js plugin that enables Spine support.
Other
567 stars 217 forks source link

How to tint slot in pixi-spine #440

Open realmariaviana opened 2 years ago

realmariaviana commented 2 years ago

Tried to use solutions given in https://github.com/pixijs/spine/issues/365 and https://github.com/pixijs/spine/blob/master/examples/change_tint.md and none of them work. However, when trying the alpha for opacity it works perfectly. Right now I'm iterating through all the slots, like this:

animation.asset.spineData.slots.forEach(slot => {
            slot.alpha = 0.5;
            slot.tint = 0xFF0000;
            slot.color = {r: 255, g: 255, b: 255, a: 0.5};
});

Any ideas? Thank you in advance.

FloodGames commented 2 years ago

These two things should work:

  tentSpine.skeleton.findSlot("TintStripTINT1").color.setFromString("ffff00")
  tentSpine.skeleton.findSlot("TintStripTINT1").color.set(1, 0, 1, 1) //alternative code
export declare interface ISlot {
    getAttachment(): IAttachment;
    data: ISlotData;
    color: Color;
    darkColor: Color;
    blendMode: number;
    bone: IBone;
    sprites?: any;
    currentSprite?: any;
    currentSpriteName?: string;
    meshes?: any;
    currentMesh?: any;
    currentMeshName?: string;
    currentMeshId?: number;
    currentGraphics?: any;
    clippingContainer?: any;
    hackRegion?: TextureRegion;
    hackAttachment?: IAttachment;
}

So, if you really want to go over every slot (which is probably not what you want), this is how it looks:

  animation.asset.skeleton.slots.forEach((slot) => {
    slot.color.set(1, 0, 0, 0.5)
  })

🧑‍🍳🥪