Skip to content

Commit 0918bc1

Browse files
committed
Support for stroke rendering added
1 parent aac7830 commit 0918bc1

2 files changed

Lines changed: 135 additions & 50 deletions

File tree

src/gameobjects/shape/rectangle/RectangleWebGLRenderer.js

Lines changed: 62 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ var RectangleWebGLRenderer = function (renderer, src, interpolationPercentage, c
2727

2828
var camMatrix = pipeline._tempMatrix1;
2929
var shapeMatrix = pipeline._tempMatrix2;
30+
var calcMatrix = pipeline._tempMatrix3;
3031

3132
renderer.setPipeline(pipeline);
3233

@@ -42,40 +43,76 @@ var RectangleWebGLRenderer = function (renderer, src, interpolationPercentage, c
4243
// Undo the camera scroll
4344
shapeMatrix.e = src.x;
4445
shapeMatrix.f = src.y;
45-
46-
// Multiply by the Sprite matrix, store result in calcMatrix
47-
// camMatrix.multiply(shapeMatrix);
4846
}
4947
else
5048
{
5149
shapeMatrix.e -= camera.scrollX * src.scrollFactorX;
5250
shapeMatrix.f -= camera.scrollY * src.scrollFactorY;
53-
54-
// Multiply by the Sprite matrix, store result in calcMatrix
55-
// camMatrix.multiply(shapeMatrix);
5651
}
5752

53+
camMatrix.multiply(shapeMatrix, calcMatrix);
54+
55+
var dx = src._displayOriginX;
56+
var dy = src._displayOriginY;
5857
var alpha = camera.alpha * src.alpha;
5958

60-
var fillTint = pipeline.fillTint;
61-
var fillTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.fillColor, src.fillAlpha * alpha);
62-
63-
fillTint.TL = fillTintColor;
64-
fillTint.TR = fillTintColor;
65-
fillTint.BL = fillTintColor;
66-
fillTint.BR = fillTintColor;
67-
68-
var x = -src._displayOriginX;
69-
var y = -src._displayOriginY;
70-
71-
pipeline.batchFillRect(
72-
x,
73-
y,
74-
src.width,
75-
src.height,
76-
shapeMatrix,
77-
camMatrix
78-
);
59+
if (src.isFilled)
60+
{
61+
var fillTint = pipeline.fillTint;
62+
var fillTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.fillColor, src.fillAlpha * alpha);
63+
64+
fillTint.TL = fillTintColor;
65+
fillTint.TR = fillTintColor;
66+
fillTint.BL = fillTintColor;
67+
fillTint.BR = fillTintColor;
68+
69+
pipeline.batchFillRect(
70+
-dx,
71+
-dy,
72+
src.width,
73+
src.height
74+
);
75+
}
76+
77+
if (src.isStroked)
78+
{
79+
var strokeTint = pipeline.strokeTint;
80+
var strokeTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.strokeColor, src.strokeAlpha * alpha);
81+
82+
strokeTint.TL = strokeTintColor;
83+
strokeTint.TR = strokeTintColor;
84+
strokeTint.BL = strokeTintColor;
85+
strokeTint.BR = strokeTintColor;
86+
87+
var path = src.pathData;
88+
var pathLength = path.length - 1;
89+
var lineWidth = src.lineWidth;
90+
var halfLineWidth = lineWidth / 2;
91+
92+
var px1 = path[0] - dx;
93+
var py1 = path[1] - dy;
94+
95+
for (var i = 2; i < pathLength; i += 2)
96+
{
97+
var px2 = path[i] - dx;
98+
var py2 = path[i + 1] - dy;
99+
100+
pipeline.batchLine(
101+
px1,
102+
py1,
103+
px2,
104+
py2,
105+
halfLineWidth,
106+
halfLineWidth,
107+
lineWidth,
108+
i - 2,
109+
(i === pathLength - 1)
110+
);
111+
112+
px1 = px2;
113+
py1 = py2;
114+
}
115+
}
79116
};
80117

81118
module.exports = RectangleWebGLRenderer;

src/gameobjects/shape/triangle/TriangleWebGLRenderer.js

Lines changed: 73 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ var TriangleWebGLRenderer = function (renderer, src, interpolationPercentage, ca
2727

2828
var camMatrix = pipeline._tempMatrix1;
2929
var shapeMatrix = pipeline._tempMatrix2;
30+
var calcMatrix = pipeline._tempMatrix3;
3031

3132
renderer.setPipeline(pipeline);
3233

@@ -49,33 +50,80 @@ var TriangleWebGLRenderer = function (renderer, src, interpolationPercentage, ca
4950
shapeMatrix.f -= camera.scrollY * src.scrollFactorY;
5051
}
5152

53+
camMatrix.multiply(shapeMatrix, calcMatrix);
54+
55+
var dx = src._displayOriginX;
56+
var dy = src._displayOriginY;
5257
var alpha = camera.alpha * src.alpha;
5358

54-
var fillTint = pipeline.fillTint;
55-
var fillTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.fillColor, src.fillAlpha * alpha);
56-
57-
fillTint.TL = fillTintColor;
58-
fillTint.TR = fillTintColor;
59-
fillTint.BL = fillTintColor;
60-
fillTint.BR = fillTintColor;
61-
62-
var x1 = src.data.x1 - src._displayOriginX;
63-
var y1 = src.data.y1 - src._displayOriginY;
64-
var x2 = src.data.x2 - src._displayOriginX;
65-
var y2 = src.data.y2 - src._displayOriginY;
66-
var x3 = src.data.x3 - src._displayOriginX;
67-
var y3 = src.data.y3 - src._displayOriginY;
68-
69-
pipeline.batchFillTriangle(
70-
x1,
71-
y1,
72-
x2,
73-
y2,
74-
x3,
75-
y3,
76-
shapeMatrix,
77-
camMatrix
78-
);
59+
if (src.isFilled)
60+
{
61+
var fillTint = pipeline.fillTint;
62+
var fillTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.fillColor, src.fillAlpha * alpha);
63+
64+
fillTint.TL = fillTintColor;
65+
fillTint.TR = fillTintColor;
66+
fillTint.BL = fillTintColor;
67+
fillTint.BR = fillTintColor;
68+
69+
var x1 = src.data.x1 - dx;
70+
var y1 = src.data.y1 - dy;
71+
var x2 = src.data.x2 - dx;
72+
var y2 = src.data.y2 - dy;
73+
var x3 = src.data.x3 - dx;
74+
var y3 = src.data.y3 - dy;
75+
76+
pipeline.batchFillTriangle(
77+
x1,
78+
y1,
79+
x2,
80+
y2,
81+
x3,
82+
y3,
83+
shapeMatrix,
84+
camMatrix
85+
);
86+
}
87+
88+
if (src.isStroked)
89+
{
90+
var strokeTint = pipeline.strokeTint;
91+
var strokeTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.strokeColor, src.strokeAlpha * alpha);
92+
93+
strokeTint.TL = strokeTintColor;
94+
strokeTint.TR = strokeTintColor;
95+
strokeTint.BL = strokeTintColor;
96+
strokeTint.BR = strokeTintColor;
97+
98+
var path = src.pathData;
99+
var pathLength = path.length - 1;
100+
var lineWidth = src.lineWidth;
101+
var halfLineWidth = lineWidth / 2;
102+
103+
var px1 = path[0] - dx;
104+
var py1 = path[1] - dy;
105+
106+
for (var i = 2; i < pathLength; i += 2)
107+
{
108+
var px2 = path[i] - dx;
109+
var py2 = path[i + 1] - dy;
110+
111+
pipeline.batchLine(
112+
px1,
113+
py1,
114+
px2,
115+
py2,
116+
halfLineWidth,
117+
halfLineWidth,
118+
lineWidth,
119+
i - 2,
120+
(i === pathLength - 1)
121+
);
122+
123+
px1 = px2;
124+
py1 = py2;
125+
}
126+
}
79127
};
80128

81129
module.exports = TriangleWebGLRenderer;

0 commit comments

Comments
 (0)