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

reuse existing canvas element when possible (#876)

Browse Source 
* reuse existing canvas element when possible

* [ts][widget] enable retina quality graphics
This commit is contained in:
Dave Geddes 2017-04-18 01:43:41 -06:00 committed by Mario Zechner
parent 2cd9467d27
commit 3ec6c85074
1 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
spine-ts/widget/src/Widget.ts
View File

@ -60,10 +60,14 @@ module spine {
this.validateConfig(config); this.validateConfig(config);
let canvas = this.canvas = document.createElement("canvas"); let existingCanvas = <HTMLCanvasElement> element.children[0];
let canvas = this.canvas = existingCanvas || document.createElement("canvas");
canvas.style.width = "100%"; canvas.style.width = "100%";
canvas.style.height = "100%"; canvas.style.height = "100%";
(<HTMLElement> element).appendChild(canvas); // only create a new canvas when one doesn't already exist
if (!existingCanvas) {
(<HTMLElement>element).appendChild(canvas);
}
canvas.width = (<HTMLElement>element).clientWidth; canvas.width = (<HTMLElement>element).clientWidth;
canvas.height = (<HTMLElement>element).clientHeight; canvas.height = (<HTMLElement>element).clientHeight;
var webglConfig = { alpha: config.alpha }; var webglConfig = { alpha: config.alpha };
@ -235,10 +239,12 @@ module spine {
private resize () { private resize () {
let canvas = this.canvas; let canvas = this.canvas;
let w = canvas.clientWidth;
let h = canvas.clientHeight;
let bounds = this.bounds; let bounds = this.bounds;
if (canvas.width != w || canvas.height != h) { let w = bounds.size.x;
let h = bounds.size.y;
// set canvas drawingBuffer equal to skeleton bounds (enables retina quality graphics)
// Math.floor is for matching how browsers round canvas size
if (canvas.width != Math.floor(w) || canvas.height != Math.floor(h)) {
canvas.width = w; canvas.width = w;
canvas.height = h; canvas.height = h;
} }