UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2025-12-21 09:46:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts][phaser] Correctly managed scene resize event. See #2916.

Browse Source
This commit is contained in:
Davide Tantillo 2025-09-24 14:52:19 +02:00
parent 249df20753
commit 4396578d9b
2 changed files with 58 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
spine-ts/spine-phaser-v3/src/SpinePlugin.ts
View File

@ -27,11 +27,13 @@
* THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*****************************************************************************/ *****************************************************************************/
import * as Phaser from "phaser";
import { SPINE_ATLAS_CACHE_KEY, SPINE_GAME_OBJECT_TYPE, SPINE_SKELETON_DATA_FILE_TYPE, SPINE_ATLAS_FILE_TYPE, SPINE_SKELETON_FILE_CACHE_KEY as SPINE_SKELETON_DATA_CACHE_KEY } from "./keys.js";
import { AtlasAttachmentLoader, GLTexture, SceneRenderer, Skeleton, SkeletonBinary, SkeletonData, SkeletonJson, TextureAtlas } from "@esotericsoftware/spine-webgl"
import { SpineGameObject, SpineGameObjectBoundsProvider } from "./SpineGameObject.js";
import { CanvasTexture, SkeletonRenderer } from "@esotericsoftware/spine-canvas"; import { CanvasTexture, SkeletonRenderer } from "@esotericsoftware/spine-canvas";
import { AtlasAttachmentLoader, GLTexture, SceneRenderer, Skeleton, SkeletonBinary, SkeletonData, SkeletonJson, TextureAtlas } from "@esotericsoftware/spine-webgl"
import * as Phaser from "phaser";
import { SPINE_ATLAS_CACHE_KEY, SPINE_ATLAS_FILE_TYPE, SPINE_GAME_OBJECT_TYPE, SPINE_SKELETON_FILE_CACHE_KEY as SPINE_SKELETON_DATA_CACHE_KEY, SPINE_SKELETON_DATA_FILE_TYPE } from "./keys.js";
import { SpineGameObject, SpineGameObjectBoundsProvider } from "./SpineGameObject.js";
Skeleton.yDown = true;
/** /**
* Configuration object used when creating {@link SpineGameObject} instances via a scene's * Configuration object used when creating {@link SpineGameObject} instances via a scene's
@ -165,32 +167,29 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
static rendererId = 0; static rendererId = 0;
boot () { boot () {
Skeleton.yDown = true; if (this.isWebGL && this.gl) {
if (this.isWebGL) { SpinePlugin.gameWebGLRenderer ||= new SceneRenderer((this.game.renderer as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl, true);
if (!SpinePlugin.gameWebGLRenderer) { } else if (this.scene) {
SpinePlugin.gameWebGLRenderer = new SceneRenderer((this.game.renderer! as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl!, true); this.canvasRenderer ||= new SkeletonRenderer(this.scene.sys.context);
}
this.onResize();
this.game.scale.on(Phaser.Scale.Events.RESIZE, this.onResize, this);
} else {
if (!this.canvasRenderer) {
this.canvasRenderer = new SkeletonRenderer(this.scene!.sys.context);
}
} }
var eventEmitter = this.systems!.events; this.onResize();
eventEmitter.once('shutdown', this.shutdown, this); if (this.systems) {
eventEmitter.once('destroy', this.destroy, this); this.systems.events.once("destroy", this.destroy, this);
this.game.events.once('destroy', this.gameDestroy, this); this.systems.events.on("start", this.onStart, this);
this.systems.events.on("shutdown", this.shutdown, this);
}
this.game.events.once("destroy", this.gameDestroy, this);
} }
onResize () { onResize () {
var phaserRenderer = this.game.renderer; const phaserRenderer = this.game.renderer;
var sceneRenderer = this.webGLRenderer; const sceneRenderer = this.webGLRenderer;
if (phaserRenderer && sceneRenderer) { if (phaserRenderer && sceneRenderer) {
var viewportWidth = phaserRenderer.width; const viewportWidth = phaserRenderer.width;
var viewportHeight = phaserRenderer.height; const viewportHeight = phaserRenderer.height;
sceneRenderer.camera.position.x = viewportWidth / 2; sceneRenderer.camera.position.x = viewportWidth / 2;
sceneRenderer.camera.position.y = viewportHeight / 2; sceneRenderer.camera.position.y = viewportHeight / 2;
sceneRenderer.camera.up.y = -1; sceneRenderer.camera.up.y = -1;
@ -199,15 +198,20 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
} }
} }
onStart () {
this.game.scale.on(Phaser.Scale.Events.RESIZE, this.onResize, this);
}
shutdown () { shutdown () {
this.systems!.events.off("shutdown", this.shutdown, this);
if (this.isWebGL) { if (this.isWebGL) {
this.game.scale.off(Phaser.Scale.Events.RESIZE, this.onResize, this); this.game.scale.off(Phaser.Scale.Events.RESIZE, this.onResize, this);
} }
} }
destroy () { destroy () {
this.shutdown() this.shutdown();
this.systems?.events.off("start", this.onStart, this);
this.systems?.events.off("shutdown", this.shutdown, this);
} }
gameDestroy () { gameDestroy () {

54
spine-ts/spine-phaser-v4/src/SpinePlugin.ts
View File

@ -27,11 +27,13 @@
* THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. * THE SPINE RUNTIMES, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*****************************************************************************/ *****************************************************************************/
import * as Phaser from "phaser";
import { SPINE_ATLAS_CACHE_KEY, SPINE_GAME_OBJECT_TYPE, SPINE_SKELETON_DATA_FILE_TYPE, SPINE_ATLAS_FILE_TYPE, SPINE_SKELETON_FILE_CACHE_KEY as SPINE_SKELETON_DATA_CACHE_KEY } from "./keys.js";
import { AtlasAttachmentLoader, GLTexture, SceneRenderer, Skeleton, SkeletonBinary, SkeletonData, SkeletonJson, TextureAtlas } from "@esotericsoftware/spine-webgl"
import { SpineGameObject, SpineGameObjectBoundsProvider } from "./SpineGameObject.js";
import { CanvasTexture, SkeletonRenderer } from "@esotericsoftware/spine-canvas"; import { CanvasTexture, SkeletonRenderer } from "@esotericsoftware/spine-canvas";
import { AtlasAttachmentLoader, GLTexture, SceneRenderer, Skeleton, SkeletonBinary, SkeletonData, SkeletonJson, TextureAtlas } from "@esotericsoftware/spine-webgl"
import * as Phaser from "phaser";
import { SPINE_ATLAS_CACHE_KEY, SPINE_ATLAS_FILE_TYPE, SPINE_GAME_OBJECT_TYPE, SPINE_SKELETON_FILE_CACHE_KEY as SPINE_SKELETON_DATA_CACHE_KEY, SPINE_SKELETON_DATA_FILE_TYPE } from "./keys.js";
import { SpineGameObject, SpineGameObjectBoundsProvider } from "./SpineGameObject.js";
Skeleton.yDown = true;
/** /**
* Configuration object used when creating {@link SpineGameObject} instances via a scene's * Configuration object used when creating {@link SpineGameObject} instances via a scene's
@ -147,32 +149,29 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
static rendererId = 0; static rendererId = 0;
boot () { boot () {
Skeleton.yDown = true; if (this.isWebGL && this.gl) {
if (this.isWebGL) { this.gameWebGLRenderer ||= new SceneRenderer((this.game.renderer as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl, true);
if (!this.gameWebGLRenderer) { } else if (this.scene) {
this.gameWebGLRenderer = new SceneRenderer((this.game.renderer! as Phaser.Renderer.WebGL.WebGLRenderer).canvas, this.gl!, true); this.canvasRenderer ||= new SkeletonRenderer(this.scene.sys.context);
}
this.onResize();
this.game.scale.on(Phaser.Scale.Events.RESIZE, this.onResize, this);
} else {
if (!this.canvasRenderer) {
this.canvasRenderer = new SkeletonRenderer(this.scene!.sys.context);
}
} }
var eventEmitter = this.systems!.events; this.onResize();
eventEmitter.once('shutdown', this.shutdown, this); if (this.systems) {
eventEmitter.once('destroy', this.destroy, this); this.systems.events.once("destroy", this.destroy, this);
this.game.events.once('destroy', this.gameDestroy, this); this.systems.events.on("start", this.onStart, this);
this.systems.events.on("shutdown", this.shutdown, this);
}
this.game.events.once("destroy", this.gameDestroy, this);
} }
onResize () { onResize () {
var phaserRenderer = this.game.renderer; const phaserRenderer = this.game.renderer;
var sceneRenderer = this.webGLRenderer; const sceneRenderer = this.webGLRenderer;
if (phaserRenderer && sceneRenderer) { if (phaserRenderer && sceneRenderer) {
var viewportWidth = phaserRenderer.width; const viewportWidth = phaserRenderer.width;
var viewportHeight = phaserRenderer.height; const viewportHeight = phaserRenderer.height;
sceneRenderer.camera.position.x = viewportWidth / 2; sceneRenderer.camera.position.x = viewportWidth / 2;
sceneRenderer.camera.position.y = viewportHeight / 2; sceneRenderer.camera.position.y = viewportHeight / 2;
sceneRenderer.camera.up.y = -1; sceneRenderer.camera.up.y = -1;
@ -181,15 +180,20 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
} }
} }
onStart () {
this.game.scale.on(Phaser.Scale.Events.RESIZE, this.onResize, this);
}
shutdown () { shutdown () {
this.systems!.events.off("shutdown", this.shutdown, this);
if (this.isWebGL) { if (this.isWebGL) {
this.game.scale.off(Phaser.Scale.Events.RESIZE, this.onResize, this); this.game.scale.off(Phaser.Scale.Events.RESIZE, this.onResize, this);
} }
} }
destroy () { destroy () {
this.shutdown() this.shutdown();
this.systems?.events.off("start", this.onStart, this);
this.systems?.events.off("shutdown", this.shutdown, this);
} }
gameDestroy () { gameDestroy () {