Hello nayo 🙂
Your skeleton has an empty setup pose, and the animations don’t activate any attachments.
If you want to see something, you need to activate a skin. You can use skeleton.setSkinByName to do that.
There’s another issue with your code. You're using:
spineboy.displayHeight = (spineboy.height / spineboy.width) * 200;
But spineboy.height and spineboy.width are 0 because they’re calculated based on the bounds provider passed to the constructor.
If no bounds provider is passed, the SetupPoseBoundsProvider is used. But as mentioned earlier, the setup pose is empty, so the calculated bounds are 0,0.
In this case, you should use a SkinsAndAnimationBoundsProvider, which can take an array of skins to determine the bounds.
In short, to make your code work, you need to change it like this:
create() {
const spineboy = this.add.spine(
400,
500,
"spineboy-data",
"spineboy-atlas",
new spine.SkinsAndAnimationBoundsProvider(undefined, ["pifu/fen"]),
);
spineboy.skeleton.setSkinByName("pifu/fen");
spineboy.displayWidth = 200;
spineboy.displayHeight = (spineboy.height / spineboy.width) * 200;
this.input.enableDebug(spineboy, 0xff00ff);
spineboy.animationState.setAnimation(0, "Move", true);
}
I highly recommend to read the spine-phaser documentation that goes throug all this concept 👍️