Position animation to bottom of player of unknown height

julian

I'm using the web player with a transparent background and would like the feet of my animation to appear on the ground. The problem the height of the player is a random value generated dynamically (as I am loading variations in size of the same animation) so I don't know what this will be. Currently the animation is positioned in the centre of the player so my animation is floating - is there a way to position it to the bottom of the player?
Thanks

Mario

Are you using web player to create a game? I'd strongly recommend not doing that. Web player is meant to show off animations. While you can do a lot with it, for games, I'd suggest using spine-phaser.

https://esotericsoftware.com/blog/spine-phaser-runtime

You can "anchor" your animation at the bottom of the player, by setting padBottom to 0. Additionally, you can set padTop to a percentage, e.g. "30%". Then your skeleton will take up the remaining 70% of the viewport on the y-axis.

julian

Thanks @Mario for that - I actually tried doing it in pixi-spine but the problem I am facing is that I need to dynamically load each animation from a DB - about 13 altogether at 1 minute intervals - stored as a data url (all 3 files). The web player has the rawDataUri's config which works perfectly for creating new animations this way. Although there seems some documentation in pixi spine it seems only available in older packages - not compatible with the latest version of spine.
I'll check out phaser - do you know off the top of your head it it works with having the atlas, json and png all as data uri's?
Thank you again for you quick response it's very helpful.

Mario

Ah, I understand. I'm afraid I'm not enough of a Phaser expert to answer the question of whether it supports raw data URIs. That's probably something the Phaser people can better answer. I found this:
photonstorm/phaser3700

So it appears you can push data URLs through the Phaser APIs. I haven't tested it with spine-phaser yet though.

julian

Thanks mate, your input on the web player solved a heap to problems - thanks!! I will look into phaser/pixie spine. Sadly support latest versions are a bit thin on the ground

Mario

julian we actually have an official runtime for both phaser and pixi now! Have a look at the spine-runtimes repository at https://github.com/esotericsoftware/spine-runtimes under the spine-ts folder. They contain lots of examples as well.

You can find the docs for spine-phaser and spine-pixie here:
https://esotericsoftware.com/spine-phaser

spine-pixi is super new and I haven't i finished the docs yet. The example code in the runtimes repo should be enough to get you started though.

julian

Mario Thanks, I am really keen to use pixi-spine - I am hoping to try and load dynamic animations that will get added to a folder on an external url. If I have all three files located in one folder could this be possible? The program I am working on will need to support around 20 different animations on the screen at one time - and as you pointed out the web player couldn't handle this 🙁
I will check out the documentation - thanks for your ongoing help