1

How can I change the color of a Spine slot in Phaser? (I'm using Phaser version 3.60.0-beta.22)

I can find an attachment, and it should be possible to change the color by creating a new color (of the type spine.Color) like this:

const slot skeleton.findSlot('slot-name');
slot.color = new spine.Color(1,1,1); // IDE doesn't complain, but I get ReferenceError at runtime

However, I get a runtime error: "ReferenceError: spine is not defined". I followed this blog post to include the SpinePlugin in my TypeScript project. Loading and adding Spine game objects to the scene work fine. I just don't know how to create a new Color and apply it to the slot.

John
  • 10,165
  • 5
  • 55
  • 71

1 Answers1

1

You can call the Color Class from the plugin property, of the scene.spine property

slot.color = new this.spine.plugin.Color(1, 1, 1);

Update (based on question in the comment):

Here possible hacky typescript syntax fix:

slot.color = new (this as any).spine.plugin.Color(1, 1, 1);
winner_joiner
  • 12,173
  • 4
  • 36
  • 61
  • Thanks for the answer! I assume `this` is the `scene`. I also had to make a few adjustments to make it work. I had to write `scene['spine'].plugin.webgl.Color(1,1,1)`. I had to write `['spine']` because I got the following error in the IDE otherwise "Property 'spine' does not exist on type 'Scene'." Do you happen to know how to prevent that error from appearing in the IDE? (I'm using TypeScript) – John Apr 04 '23 at 12:04
  • @John I no typescript expert, but quick fix could be to write `new (this as any).spine.plugin.Color(1,1,1)`, like this there should be no error. And yes with `this` I meant the `scene`, I just wrote it as I would in the `create` function. – winner_joiner Apr 04 '23 at 12:18
  • Thanks for the additional comment. I don't know why I had to write `webgl` after `plugin` to make it work though. The answer helped me solve the question, so I will accept it. – John Apr 04 '23 at 12:37
  • 1
    @John thanks for the acceptance. the `webgl` is also interesting to me, it could have to do with the plugin version, or so. I based my answer on [spine.d.ts from the github master](https://github.com/photonstorm/phaser/blob/master/types/spine.d.ts) since I didn't have a current, spine project. I'm glad I could help, happy coding/ _phaser-ing_. :) – winner_joiner Apr 04 '23 at 13:15