[WebGL] Lighting a Spine Character?

CCTucker1327 · 10 янв 2021

We're currently using the Phaser Framework for creating our Game and we have a spine project that has several pieces of equipment, a semi-complex rig, and several animations. The issue is that while I was going through and adding some polish to our project (in the form of removing our placeholder character) I noticed something bothersome.

There was no lighting affecting my Spine character

I reached out to the creator of Photon and asked about it applying lighting and with a very, very brief conversation he said "I can't see how it would be possible, Spine objects aren't rendered by Phaser, they're entirely external" and this puts us at a dilemma.

Our game is very heavily focused on the use of dynamic lighting, so the character being stuck in a permanent LIT state really throws off the entire theme. We could export sequences (which would be affected by the lighting) but considering all of the pieces of equipment we have and the deformations in our animations this is going to end up generating thousands of sprites, if not more and due to all of these deforming animations, I don't see how just overlaying equipment on-top of an animated character like you would in 3D games could work.

If anyone has any ideas on how we can save this project other than severely dumbing down our characters, please let me know.

CCTucker1327 · 10 янв 2021

Ffrissonlabs · 29 мая 2022

Any updates on this?

Mario · 30 мая 2022

Phaser uses Spine's WebGL backend under the hood to render. That backend allows setting custom shaders, e.g. for lighting, by passinfna Shader to PolygonBatcher: https://github.com/EsotericSoftware/spine-runtimes/blob/4.0/spine-ts/spine-webgl/src/PolygonBatcher.ts#L62

The runtime itself doesn't come with a lighting shader out of the box, as that's engine specific. I.e. engine's usually have specific uniforms that need to be set and evaluated in the shader tomapply lighting.

From the Phaser docs, it seems like it's not possible to pass a shader through to the batcher via the Phaser API that wraps our WebGL backend. That's something that needs fixing on the Phaser side.