[ts] Fixed SkeletonDebugRenderer, fixed memory allocations in SkeletonRenderer

This commit is contained in:
badlogic 2017-01-26 16:21:08 +01:00
parent 8f99571185
commit 7b463b1336
9 changed files with 75 additions and 53 deletions

View File

@ -1508,6 +1508,7 @@ declare module spine.webgl {
private gl;
private bounds;
private temp;
private vertices;
private static LIGHT_GRAY;
private static GREEN;
constructor(gl: WebGLRenderingContext);
@ -1522,6 +1523,7 @@ declare module spine.webgl {
premultipliedAlpha: boolean;
private gl;
private tempColor;
private vertices;
constructor(gl: WebGLRenderingContext);
draw(batcher: PolygonBatcher, skeleton: Skeleton): void;
computeRegionVertices(slot: Slot, region: RegionAttachment, pma: boolean): ArrayLike<number>;

View File

@ -793,7 +793,7 @@ var spine;
this.frames = spine.Utils.newFloatArray(frameCount * TwoColorTimeline.ENTRIES);
}
TwoColorTimeline.prototype.getPropertyId = function () {
return (TimelineType.color << 24) + this.slotIndex;
return (TimelineType.twoColor << 24) + this.slotIndex;
};
TwoColorTimeline.prototype.setFrame = function (frameIndex, time, r, g, b, a, r2, g2, b2) {
frameIndex *= TwoColorTimeline.ENTRIES;
@ -7773,6 +7773,7 @@ var spine;
this.boneWidth = 2;
this.bounds = new spine.SkeletonBounds();
this.temp = new Array();
this.vertices = spine.Utils.newFloatArray(webgl.SkeletonRenderer.VERTEX_SIZE * 1024);
this.gl = gl;
}
SkeletonDebugRenderer.prototype.draw = function (shapes, skeleton, ignoredBones) {
@ -7806,11 +7807,12 @@ var spine;
var attachment = slot.getAttachment();
if (attachment instanceof spine.RegionAttachment) {
var regionAttachment = attachment;
var vertices = regionAttachment.updateWorldVertices(slot, false);
shapes.line(vertices[spine.RegionAttachment.X1], vertices[spine.RegionAttachment.Y1], vertices[spine.RegionAttachment.X2], vertices[spine.RegionAttachment.Y2]);
shapes.line(vertices[spine.RegionAttachment.X2], vertices[spine.RegionAttachment.Y2], vertices[spine.RegionAttachment.X3], vertices[spine.RegionAttachment.Y3]);
shapes.line(vertices[spine.RegionAttachment.X3], vertices[spine.RegionAttachment.Y3], vertices[spine.RegionAttachment.X4], vertices[spine.RegionAttachment.Y4]);
shapes.line(vertices[spine.RegionAttachment.X4], vertices[spine.RegionAttachment.Y4], vertices[spine.RegionAttachment.X1], vertices[spine.RegionAttachment.Y1]);
var vertices = this.vertices;
regionAttachment.computeWorldVertices(slot.bone, vertices, 0, 2);
shapes.line(vertices[0], vertices[1], vertices[2], vertices[3]);
shapes.line(vertices[2], vertices[3], vertices[4], vertices[5]);
shapes.line(vertices[4], vertices[5], vertices[6], vertices[7]);
shapes.line(vertices[6], vertices[7], vertices[0], vertices[1]);
}
}
}
@ -7822,22 +7824,22 @@ var spine;
if (!(attachment instanceof spine.MeshAttachment))
continue;
var mesh = attachment;
mesh.updateWorldVertices(slot, false);
var vertices = mesh.worldVertices;
var vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, 2);
var triangles = mesh.triangles;
var hullLength = mesh.hullLength;
if (this.drawMeshTriangles) {
shapes.setColor(this.triangleLineColor);
for (var ii = 0, nn = triangles.length; ii < nn; ii += 3) {
var v1 = triangles[ii] * 8, v2 = triangles[ii + 1] * 8, v3 = triangles[ii + 2] * 8;
var v1 = triangles[ii] * 2, v2 = triangles[ii + 1] * 2, v3 = triangles[ii + 2] * 2;
shapes.triangle(false, vertices[v1], vertices[v1 + 1], vertices[v2], vertices[v2 + 1], vertices[v3], vertices[v3 + 1]);
}
}
if (this.drawMeshHull && hullLength > 0) {
shapes.setColor(this.attachmentLineColor);
hullLength = (hullLength >> 1) * 8;
var lastX = vertices[hullLength - 8], lastY = vertices[hullLength - 7];
for (var ii = 0, nn = hullLength; ii < nn; ii += 8) {
hullLength = (hullLength >> 1) * 2;
var lastX = vertices[hullLength - 2], lastY = vertices[hullLength - 1];
for (var ii = 0, nn = hullLength; ii < nn; ii += 2) {
var x = vertices[ii], y = vertices[ii + 1];
shapes.line(x, y, lastX, lastY);
lastX = x;
@ -7869,7 +7871,7 @@ var spine;
var path = attachment;
var nn = path.worldVerticesLength;
var world = this.temp = spine.Utils.setArraySize(this.temp, nn, 0);
path.computeWorldVertices(slot, world);
path.computeWorldVertices(slot, 0, nn, world, 0, 2);
var color = this.pathColor;
var x1 = world[2], y1 = world[3], x2 = 0, y2 = 0;
if (path.closed) {
@ -7924,6 +7926,7 @@ var spine;
function SkeletonRenderer(gl) {
this.premultipliedAlpha = false;
this.tempColor = new spine.Color();
this.vertices = spine.Utils.newFloatArray(SkeletonRenderer.VERTEX_SIZE * 1024);
this.gl = gl;
}
SkeletonRenderer.prototype.draw = function (batcher, skeleton) {
@ -7969,8 +7972,8 @@ var spine;
var multiplier = pma ? alpha : 1;
var color = this.tempColor;
color.set(skeletonColor.r * slotColor.r * regionColor.r * multiplier, skeletonColor.g * slotColor.g * regionColor.g * multiplier, skeletonColor.b * slotColor.b * regionColor.b * multiplier, alpha);
var vertices = spine.Utils.newFloatArray(4 * SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, this.vertices, 0, SkeletonRenderer.VERTEX_SIZE);
var vertices = this.vertices;
var uvs = region.uvs;
vertices[spine.RegionAttachment.C1R] = color.r;
vertices[spine.RegionAttachment.C1G] = color.g;
@ -8008,7 +8011,10 @@ var spine;
var color = this.tempColor;
color.set(skeletonColor.r * slotColor.r * regionColor.r * multiplier, skeletonColor.g * slotColor.g * regionColor.g * multiplier, skeletonColor.b * slotColor.b * regionColor.b * multiplier, alpha);
var numVertices = mesh.worldVerticesLength / 2;
var vertices = spine.Utils.newFloatArray(numVertices * SkeletonRenderer.VERTEX_SIZE);
if (this.vertices.length < mesh.worldVerticesLength) {
this.vertices = spine.Utils.newFloatArray(mesh.worldVerticesLength);
}
var vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
var uvs = mesh.uvs;
for (var i = 0, n = numVertices, u = 0, v = 2; i < n; i++) {

File diff suppressed because one or more lines are too long

View File

@ -1438,6 +1438,7 @@ declare module spine.webgl {
private gl;
private bounds;
private temp;
private vertices;
private static LIGHT_GRAY;
private static GREEN;
constructor(gl: WebGLRenderingContext);
@ -1452,6 +1453,7 @@ declare module spine.webgl {
premultipliedAlpha: boolean;
private gl;
private tempColor;
private vertices;
constructor(gl: WebGLRenderingContext);
draw(batcher: PolygonBatcher, skeleton: Skeleton): void;
computeRegionVertices(slot: Slot, region: RegionAttachment, pma: boolean): ArrayLike<number>;

View File

@ -7352,6 +7352,7 @@ var spine;
this.boneWidth = 2;
this.bounds = new spine.SkeletonBounds();
this.temp = new Array();
this.vertices = spine.Utils.newFloatArray(webgl.SkeletonRenderer.VERTEX_SIZE * 1024);
this.gl = gl;
}
SkeletonDebugRenderer.prototype.draw = function (shapes, skeleton, ignoredBones) {
@ -7385,11 +7386,12 @@ var spine;
var attachment = slot.getAttachment();
if (attachment instanceof spine.RegionAttachment) {
var regionAttachment = attachment;
var vertices = regionAttachment.updateWorldVertices(slot, false);
shapes.line(vertices[spine.RegionAttachment.X1], vertices[spine.RegionAttachment.Y1], vertices[spine.RegionAttachment.X2], vertices[spine.RegionAttachment.Y2]);
shapes.line(vertices[spine.RegionAttachment.X2], vertices[spine.RegionAttachment.Y2], vertices[spine.RegionAttachment.X3], vertices[spine.RegionAttachment.Y3]);
shapes.line(vertices[spine.RegionAttachment.X3], vertices[spine.RegionAttachment.Y3], vertices[spine.RegionAttachment.X4], vertices[spine.RegionAttachment.Y4]);
shapes.line(vertices[spine.RegionAttachment.X4], vertices[spine.RegionAttachment.Y4], vertices[spine.RegionAttachment.X1], vertices[spine.RegionAttachment.Y1]);
var vertices = this.vertices;
regionAttachment.computeWorldVertices(slot.bone, vertices, 0, 2);
shapes.line(vertices[0], vertices[1], vertices[2], vertices[3]);
shapes.line(vertices[2], vertices[3], vertices[4], vertices[5]);
shapes.line(vertices[4], vertices[5], vertices[6], vertices[7]);
shapes.line(vertices[6], vertices[7], vertices[0], vertices[1]);
}
}
}
@ -7401,22 +7403,22 @@ var spine;
if (!(attachment instanceof spine.MeshAttachment))
continue;
var mesh = attachment;
mesh.updateWorldVertices(slot, false);
var vertices = mesh.worldVertices;
var vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, 2);
var triangles = mesh.triangles;
var hullLength = mesh.hullLength;
if (this.drawMeshTriangles) {
shapes.setColor(this.triangleLineColor);
for (var ii = 0, nn = triangles.length; ii < nn; ii += 3) {
var v1 = triangles[ii] * 8, v2 = triangles[ii + 1] * 8, v3 = triangles[ii + 2] * 8;
var v1 = triangles[ii] * 2, v2 = triangles[ii + 1] * 2, v3 = triangles[ii + 2] * 2;
shapes.triangle(false, vertices[v1], vertices[v1 + 1], vertices[v2], vertices[v2 + 1], vertices[v3], vertices[v3 + 1]);
}
}
if (this.drawMeshHull && hullLength > 0) {
shapes.setColor(this.attachmentLineColor);
hullLength = (hullLength >> 1) * 8;
var lastX = vertices[hullLength - 8], lastY = vertices[hullLength - 7];
for (var ii = 0, nn = hullLength; ii < nn; ii += 8) {
hullLength = (hullLength >> 1) * 2;
var lastX = vertices[hullLength - 2], lastY = vertices[hullLength - 1];
for (var ii = 0, nn = hullLength; ii < nn; ii += 2) {
var x = vertices[ii], y = vertices[ii + 1];
shapes.line(x, y, lastX, lastY);
lastX = x;
@ -7448,7 +7450,7 @@ var spine;
var path = attachment;
var nn = path.worldVerticesLength;
var world = this.temp = spine.Utils.setArraySize(this.temp, nn, 0);
path.computeWorldVertices(slot, world);
path.computeWorldVertices(slot, 0, nn, world, 0, 2);
var color = this.pathColor;
var x1 = world[2], y1 = world[3], x2 = 0, y2 = 0;
if (path.closed) {
@ -7503,6 +7505,7 @@ var spine;
function SkeletonRenderer(gl) {
this.premultipliedAlpha = false;
this.tempColor = new spine.Color();
this.vertices = spine.Utils.newFloatArray(SkeletonRenderer.VERTEX_SIZE * 1024);
this.gl = gl;
}
SkeletonRenderer.prototype.draw = function (batcher, skeleton) {
@ -7548,8 +7551,8 @@ var spine;
var multiplier = pma ? alpha : 1;
var color = this.tempColor;
color.set(skeletonColor.r * slotColor.r * regionColor.r * multiplier, skeletonColor.g * slotColor.g * regionColor.g * multiplier, skeletonColor.b * slotColor.b * regionColor.b * multiplier, alpha);
var vertices = spine.Utils.newFloatArray(4 * SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, this.vertices, 0, SkeletonRenderer.VERTEX_SIZE);
var vertices = this.vertices;
var uvs = region.uvs;
vertices[spine.RegionAttachment.C1R] = color.r;
vertices[spine.RegionAttachment.C1G] = color.g;
@ -7587,7 +7590,10 @@ var spine;
var color = this.tempColor;
color.set(skeletonColor.r * slotColor.r * regionColor.r * multiplier, skeletonColor.g * slotColor.g * regionColor.g * multiplier, skeletonColor.b * slotColor.b * regionColor.b * multiplier, alpha);
var numVertices = mesh.worldVerticesLength / 2;
var vertices = spine.Utils.newFloatArray(numVertices * SkeletonRenderer.VERTEX_SIZE);
if (this.vertices.length < mesh.worldVerticesLength) {
this.vertices = spine.Utils.newFloatArray(mesh.worldVerticesLength);
}
var vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
var uvs = mesh.uvs;
for (var i = 0, n = numVertices, u = 0, v = 2; i < n; i++) {

File diff suppressed because one or more lines are too long

View File

@ -46,11 +46,11 @@ function init () {
mvp.ortho2d(0, 0, canvas.width - 1, canvas.height - 1);
skeletonRenderer = new spine.webgl.SkeletonRenderer(gl);
debugRenderer = new spine.webgl.SkeletonDebugRenderer(gl);
debugRenderer.drawRegionAttachments = false;
debugRenderer.drawBoundingBoxes = false;
debugRenderer.drawMeshHull = false;
debugRenderer.drawMeshTriangles = false;
debugRenderer.drawPaths = false;
debugRenderer.drawRegionAttachments = true;
debugRenderer.drawBoundingBoxes = true;
debugRenderer.drawMeshHull = true;
debugRenderer.drawMeshTriangles = true;
debugRenderer.drawPaths = true;
debugShader = spine.webgl.Shader.newColored(gl);
shapes = new spine.webgl.ShapeRenderer(gl);
assetManager = new spine.webgl.AssetManager(gl);

View File

@ -50,6 +50,7 @@ module spine.webgl {
private gl: WebGLRenderingContext;
private bounds = new SkeletonBounds();
private temp = new Array<number>();
private vertices = Utils.newFloatArray(SkeletonRenderer.VERTEX_SIZE * 1024);
private static LIGHT_GRAY = new Color(192 / 255, 192 / 255, 192 / 255, 1);
private static GREEN = new Color(0, 1, 0, 1);
@ -86,11 +87,12 @@ module spine.webgl {
let attachment = slot.getAttachment();
if (attachment instanceof RegionAttachment) {
let regionAttachment = <RegionAttachment>attachment;
let vertices = regionAttachment.updateWorldVertices(slot, false);
shapes.line(vertices[RegionAttachment.X1], vertices[RegionAttachment.Y1], vertices[RegionAttachment.X2], vertices[RegionAttachment.Y2]);
shapes.line(vertices[RegionAttachment.X2], vertices[RegionAttachment.Y2], vertices[RegionAttachment.X3], vertices[RegionAttachment.Y3]);
shapes.line(vertices[RegionAttachment.X3], vertices[RegionAttachment.Y3], vertices[RegionAttachment.X4], vertices[RegionAttachment.Y4]);
shapes.line(vertices[RegionAttachment.X4], vertices[RegionAttachment.Y4], vertices[RegionAttachment.X1], vertices[RegionAttachment.Y1]);
let vertices = this.vertices;
regionAttachment.computeWorldVertices(slot.bone, vertices, 0, 2);
shapes.line(vertices[0], vertices[1], vertices[2], vertices[3]);
shapes.line(vertices[2], vertices[3], vertices[4], vertices[5]);
shapes.line(vertices[4], vertices[5], vertices[6], vertices[7]);
shapes.line(vertices[6], vertices[7], vertices[0], vertices[1]);
}
}
}
@ -102,14 +104,14 @@ module spine.webgl {
let attachment = slot.getAttachment();
if (!(attachment instanceof MeshAttachment)) continue;
let mesh = <MeshAttachment>attachment;
mesh.updateWorldVertices(slot, false);
let vertices = mesh.worldVertices;
let vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, 2);
let triangles = mesh.triangles;
let hullLength = mesh.hullLength;
if (this.drawMeshTriangles) {
shapes.setColor(this.triangleLineColor);
for (let ii = 0, nn = triangles.length; ii < nn; ii += 3) {
let v1 = triangles[ii] * 8, v2 = triangles[ii + 1] * 8, v3 = triangles[ii + 2] * 8;
let v1 = triangles[ii] * 2, v2 = triangles[ii + 1] * 2, v3 = triangles[ii + 2] * 2;
shapes.triangle(false, vertices[v1], vertices[v1 + 1], //
vertices[v2], vertices[v2 + 1], //
vertices[v3], vertices[v3 + 1] //
@ -118,9 +120,9 @@ module spine.webgl {
}
if (this.drawMeshHull && hullLength > 0) {
shapes.setColor(this.attachmentLineColor);
hullLength = (hullLength >> 1) * 8;
let lastX = vertices[hullLength - 8], lastY = vertices[hullLength - 7];
for (let ii = 0, nn = hullLength; ii < nn; ii += 8) {
hullLength = (hullLength >> 1) * 2;
let lastX = vertices[hullLength - 2], lastY = vertices[hullLength - 1];
for (let ii = 0, nn = hullLength; ii < nn; ii += 2) {
let x = vertices[ii], y = vertices[ii + 1];
shapes.line(x, y, lastX, lastY);
lastX = x;
@ -153,7 +155,7 @@ module spine.webgl {
let path = <PathAttachment>attachment;
let nn = path.worldVerticesLength;
let world = this.temp = Utils.setArraySize(this.temp, nn, 0);
path.computeWorldVertices(slot, world);
path.computeWorldVertices(slot, 0, nn, world, 0, 2);
let color = this.pathColor;
let x1 = world[2], y1 = world[3], x2 = 0, y2 = 0;
if (path.closed) {

View File

@ -36,6 +36,7 @@ module spine.webgl {
premultipliedAlpha = false;
private gl: WebGLRenderingContext;
private tempColor = new Color();
private vertices = Utils.newFloatArray(SkeletonRenderer.VERTEX_SIZE * 1024);
constructor (gl: WebGLRenderingContext) {
this.gl = gl;
@ -89,9 +90,9 @@ module spine.webgl {
skeletonColor.b * slotColor.b * regionColor.b * multiplier,
alpha);
let vertices = Utils.newFloatArray(4 * SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
region.computeWorldVertices(slot.bone, this.vertices, 0, SkeletonRenderer.VERTEX_SIZE);
let vertices = this.vertices;
let uvs = region.uvs;
vertices[RegionAttachment.C1R] = color.r;
@ -139,7 +140,10 @@ module spine.webgl {
alpha);
let numVertices = mesh.worldVerticesLength / 2;
let vertices = Utils.newFloatArray(numVertices * SkeletonRenderer.VERTEX_SIZE);
if (this.vertices.length < mesh.worldVerticesLength) {
this.vertices = Utils.newFloatArray(mesh.worldVerticesLength);
}
let vertices = this.vertices;
mesh.computeWorldVertices(slot, 0, mesh.worldVerticesLength, vertices, 0, SkeletonRenderer.VERTEX_SIZE);
let uvs = mesh.uvs;