Skip to content

Commit e145b6b

Browse files
photonstormphotonstorm
committed
Fixed Dynamic Bitmap Text Rendering
1 parent 340c538 commit e145b6b

1 file changed

Lines changed: 97 additions & 49 deletions

File tree

‎src/gameobjects/bitmaptext/dynamic/DynamicBitmapTextWebGLRenderer.js‎

Lines changed: 97 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,28 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
3636

3737
renderer.setPipeline(pipeline);
3838

39-
var camMatrix = pipeline._tempCameraMatrix;
40-
var spriteMatrix = pipeline._tempSpriteMatrix;
39+
var crop = (src.cropWidth > 0 || src.cropHeight > 0);
4140

42-
spriteMatrix.applyITRS(src.x - camera.scrollX * src.scrollFactorX, src.y - camera.scrollY * src.scrollFactorY, src.rotation, src.scaleX, src.scaleY);
41+
if (crop)
42+
{
43+
pipeline.flush();
4344

44-
camMatrix.copyFrom(camera.matrix);
45+
renderer.pushScissor(
46+
src.x,
47+
src.y,
48+
src.cropWidth * src.scaleX,
49+
src.cropHeight * src.scaleY
50+
);
51+
}
52+
53+
var camMatrix = pipeline._tempMatrix1;
54+
var spriteMatrix = pipeline._tempMatrix2;
55+
var calcMatrix = pipeline._tempMatrix3;
56+
var fontMatrix = pipeline._tempMatrix4;
4557

46-
var calcMatrix;
58+
spriteMatrix.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
59+
60+
camMatrix.copyFrom(camera.matrix);
4761

4862
if (parentMatrix)
4963
{
@@ -54,12 +68,16 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
5468
spriteMatrix.e = src.x;
5569
spriteMatrix.f = src.y;
5670

57-
// Multiply by the Sprite matrix
58-
calcMatrix = camMatrix.multiply(spriteMatrix);
71+
// Multiply by the Sprite matrix, store result in calcMatrix
72+
camMatrix.multiply(spriteMatrix, calcMatrix);
5973
}
6074
else
6175
{
62-
calcMatrix = camMatrix.multiply(spriteMatrix);
76+
spriteMatrix.e -= camera.scrollX * src.scrollFactorX;
77+
spriteMatrix.f -= camera.scrollY * src.scrollFactorY;
78+
79+
// Multiply by the Sprite matrix, store result in calcMatrix
80+
camMatrix.multiply(spriteMatrix, calcMatrix);
6381
}
6482

6583
var frame = src.frame;
@@ -79,7 +97,6 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
7997

8098
var xAdvance = 0;
8199
var yAdvance = 0;
82-
var indexCount = 0;
83100
var charCode = 0;
84101
var lastCharCode = 0;
85102
var letterSpacing = src.letterSpacing;
@@ -89,26 +106,36 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
89106
var glyphW = 0;
90107
var glyphH = 0;
91108
var lastGlyph;
109+
var scrollX = src.scrollX;
110+
var scrollY = src.scrollY;
92111

93112
var fontData = src.fontData;
94113
var chars = fontData.chars;
95114
var lineHeight = fontData.lineHeight;
96115
var scale = (src.fontSize / fontData.size);
97116
var rotation = 0;
98117

99-
var roundPixels = camera.roundPixels;
100-
var displayCallback = src.displayCallback;
101-
var crop = (src.cropWidth > 0 || src.cropHeight > 0);
118+
var align = src._align;
119+
var currentLine = 0;
120+
var lineOffsetX = 0;
102121

103-
if (crop)
122+
// Update the bounds - skipped internally if not dirty
123+
src.getTextBounds(false);
124+
125+
var lineData = src._bounds.lines;
126+
127+
if (align === 1)
104128
{
105-
renderer.pushScissor(
106-
src.x,
107-
src.y,
108-
src.cropWidth * src.scaleX,
109-
src.cropHeight * src.scaleY
110-
);
129+
lineOffsetX = (lineData.longest - lineData.lengths[0]) / 2;
111130
}
131+
else if (align === 2)
132+
{
133+
lineOffsetX = (lineData.longest - lineData.lengths[0]);
134+
}
135+
136+
var roundPixels = camera.roundPixels;
137+
var displayCallback = src.displayCallback;
138+
var callbackData = src.callbackData;
112139

113140
for (var i = 0; i < textLength; i++)
114141
{
@@ -117,6 +144,17 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
117144
// Carriage-return
118145
if (charCode === 10)
119146
{
147+
currentLine++;
148+
149+
if (align === 1)
150+
{
151+
lineOffsetX = (lineData.longest - lineData.lengths[currentLine]) / 2;
152+
}
153+
else if (align === 2)
154+
{
155+
lineOffsetX = (lineData.longest - lineData.lengths[currentLine]);
156+
}
157+
120158
xAdvance = 0;
121159
yAdvance += lineHeight;
122160
lastGlyph = null;
@@ -137,8 +175,8 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
137175
glyphW = glyph.width;
138176
glyphH = glyph.height;
139177

140-
var x = (glyph.xOffset + xAdvance) * scale;
141-
var y = (glyph.yOffset + yAdvance) * scale;
178+
var x = (glyph.xOffset + xAdvance) - scrollX;
179+
var y = (glyph.yOffset + yAdvance) - scrollY;
142180

143181
if (lastGlyph !== null)
144182
{
@@ -156,29 +194,25 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
156194
continue;
157195
}
158196

159-
x -= src.displayOriginX;
160-
y -= src.displayOriginY;
161197
scale = (src.fontSize / src.fontData.size);
162198
rotation = 0;
163199

164200
if (displayCallback)
165201
{
166-
var output = displayCallback({
167-
color: 0,
168-
tint: {
169-
topLeft: tintTL,
170-
topRight: tintTR,
171-
bottomLeft: tintBL,
172-
bottomRight: tintBR
173-
},
174-
index: i,
175-
charCode: charCode,
176-
x: x,
177-
y: y,
178-
scale: scale,
179-
rotation: rotation,
180-
data: glyph.data
181-
});
202+
callbackData.color = 0;
203+
callbackData.tint.topLeft = tintTL;
204+
callbackData.tint.topRight = tintTR;
205+
callbackData.tint.bottomLeft = tintBL;
206+
callbackData.tint.bottomRight = tintBR;
207+
callbackData.index = i;
208+
callbackData.charCode = charCode;
209+
callbackData.x = x;
210+
callbackData.y = y;
211+
callbackData.scale = scale;
212+
callbackData.rotation = rotation;
213+
callbackData.data = glyph.data;
214+
215+
var output = displayCallback(callbackData);
182216

183217
x = output.x;
184218
y = output.y;
@@ -206,25 +240,37 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
206240
tintBR = Utils.getTintAppendFloatAlpha(tintBR, camera.alpha * src._alphaBR);
207241
}
208242

243+
x *= scale;
244+
y *= scale;
245+
246+
x -= src.displayOriginX;
247+
y -= src.displayOriginY;
248+
249+
x += lineOffsetX;
250+
251+
fontMatrix.applyITRS(x, y, rotation, scale, scale);
252+
253+
calcMatrix.multiply(fontMatrix, spriteMatrix);
254+
209255
var u0 = glyphX / textureWidth;
210256
var v0 = glyphY / textureHeight;
211257
var u1 = (glyphX + glyphW) / textureWidth;
212258
var v1 = (glyphY + glyphH) / textureHeight;
213259

214-
var xw = x + glyphW * scale;
215-
var yh = y + glyphH * scale;
260+
var xw = glyphW;
261+
var yh = glyphH;
216262

217-
var tx0 = x * calcMatrix.a + y * calcMatrix.c + calcMatrix.e;
218-
var ty0 = x * calcMatrix.b + y * calcMatrix.d + calcMatrix.f;
263+
var tx0 = spriteMatrix.e;
264+
var ty0 = spriteMatrix.f;
219265

220-
var tx1 = x * calcMatrix.a + yh * calcMatrix.c + calcMatrix.e;
221-
var ty1 = x * calcMatrix.b + yh * calcMatrix.d + calcMatrix.f;
266+
var tx1 = yh * spriteMatrix.c + spriteMatrix.e;
267+
var ty1 = yh * spriteMatrix.d + spriteMatrix.f;
222268

223-
var tx2 = xw * calcMatrix.a + yh * calcMatrix.c + calcMatrix.e;
224-
var ty2 = xw * calcMatrix.b + yh * calcMatrix.d + calcMatrix.f;
269+
var tx2 = xw * spriteMatrix.a + yh * spriteMatrix.c + spriteMatrix.e;
270+
var ty2 = xw * spriteMatrix.b + yh * spriteMatrix.d + spriteMatrix.f;
225271

226-
var tx3 = xw * calcMatrix.a + y * calcMatrix.c + calcMatrix.e;
227-
var ty3 = xw * calcMatrix.b + y * calcMatrix.d + calcMatrix.f;
272+
var tx3 = xw * spriteMatrix.a + spriteMatrix.e;
273+
var ty3 = xw * spriteMatrix.b + spriteMatrix.f;
228274

229275
if (roundPixels)
230276
{
@@ -246,6 +292,8 @@ var DynamicBitmapTextWebGLRenderer = function (renderer, src, interpolationPerce
246292

247293
if (crop)
248294
{
295+
pipeline.flush();
296+
249297
renderer.popScissor();
250298
}
251299
};

0 commit comments

Comments
 (0)