UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-03-26 22:49:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Translate is done each frame through requestAnimationFrame.

Browse Source
This commit is contained in:
Davide Tantillo 2024-08-29 14:51:34 +02:00
parent 6c0b1b8c2c
commit 034c6266e8
1 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
spine-ts/spine-webgl/src/SpineWebComponentWidget.ts
View File

@ -637,6 +637,8 @@ class SpineWebComponentOverlay extends HTMLElement {
this.updateCanvasSize(); this.updateCanvasSize();
this.zoomHandler(); this.zoomHandler();
// translateCanvas starts a requestAnimationFrame loop
this.translateCanvas(); this.translateCanvas();
this.overflowLeftSize = this.overflowLeft * document.documentElement.clientWidth; this.overflowLeftSize = this.overflowLeft * document.documentElement.clientWidth;
@ -955,14 +957,17 @@ class SpineWebComponentOverlay extends HTMLElement {
} }
} }
// right now, we scroll the canvas each frame, that makes scrolling on mobile waaay more smoother
// this is way scroll handler do nothing
private scrollHandler = () => { private scrollHandler = () => {
this.translateCanvas(); // this.translateCanvas();
} }
private translateCanvas() { private translateCanvas() {
const scrollPositionX = window.scrollX - this.overflowLeftSize; const scrollPositionX = window.scrollX - this.overflowLeftSize;
const scrollPositionY = window.scrollY - this.overflowTopSize; const scrollPositionY = window.scrollY - this.overflowTopSize;
this.canvas.style.transform =`translate(${scrollPositionX}px,${scrollPositionY}px)`; this.canvas.style.transform =`translate(${scrollPositionX}px,${scrollPositionY}px)`;
requestAnimationFrame(() => this.translateCanvas());
} }
private zoomHandler = () => { private zoomHandler = () => {