Bone3d for spine-projection about pixi-projection

[ivanpopelyshev]

With my current understanding of Bone transforms - its not possible:

https://github.com/pixijs/pixi-spine/blob/master/src/core/Bone.ts#L94
https://github.com/pixijs/pixi-spine/blob/master/src/core/IkConstraint.ts#L83
https://github.com/pixijs/pixi-spine/blob/master/src/core/PathConstraint.ts#L70

Compare that to pixi transform: https://github.com/pixijs/pixi.js/blob/dev/packages/math/src/Transform.js#L189

[djmisterjon]

ha i see, thanks.
I thought there might be hope in this area instead !
https://github.com/pixijs/pixi-spine/blob/2522be16a342749320a3e7a7455bf1fe15f16777/src/Spine.ts#L280
I tried tests but it was a bit of a mess because I do not use the typescript version.

[ivanpopelyshev]

Oh.. then maybe its possible. I will think about it.

[djmisterjon]

otherwise it is not serious, if you see that these really too hacky or very bad for performance!, I have a slightly less attractive alternative, I could simply use the spine3d container, perform a rotation change with eulerY and play on the 2Dplane.
These are less effective than playing with the 3dBones, but the result is interesting.

[djmisterjon]

hum, this is the alternative am talking about without 3d bone.
I have some difficulty quantifying automatic camera angles and environment z-index for now but the result seem interesting.

The user case is allow some static creature to hit a target with her hitBone from spine2d.
this is the code used from the gif, but have some bug in some context :(

                const dist = $camera.getDistanceFrom(this.p, target.p);
                const hitBone = this.s.skeleton.findBone('hitBone');
                const zeroX = hitBone.x; // just a temp backup

                this.s.state.setAnimation(3,'atk0',false,0);
                this.s.state.addEmptyAnimation(3,0.2,0);
                const tl = new TimelineMax();
                tl.to($camera, 1, {_ang:dist.a/Math.PI,_perspective:-0.28, _zoom:0.6, ease:Power4.easeOut },0);
                tl.to(this.s.euler, 1, { y:dist.a, ease: Power4.easeOut},0);
                tl.to(hitBone, 0.1, {x:zeroX-(dist.d/this.s.scale3d._x), ease:Back.easeIn.config(1.2) },1.1);
                tl.call(() => {
                    target.s.state.setAnimation(3,'hit0',false,0);
                } ,null,null,'+=0.1');