Skip to content

Commit 7cd7cfd

Browse files
committed
Issue cocos2d#1615 port cc.LabelTTF for WebGL
1 parent 95b4f4f commit 7cd7cfd

File tree

3 files changed

+92
-405
lines changed

3 files changed

+92
-405
lines changed

cocos2d/label_nodes/CCLabelTTF.js

Lines changed: 70 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -96,19 +96,39 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
9696
/**
9797
* changes the string to render
9898
* @warning Changing the string is as expensive as creating a new cc.LabelTTF. To obtain better performance use cc.LabelAtlas
99-
* @param {String} string text for the label
99+
* @param {String} text text for the label
100100
*/
101-
setString:function (string) {
102-
if (this._string != string) {
103-
this._string = string + "";
104-
105-
// Force update
106-
if (this._string.length > 0) {
107-
this._updateTTF();
101+
setString:function (text) {
102+
cc.Assert(text != null, "Invalid string");
103+
if (this._string != text) {
104+
this._string = text + "";
105+
106+
if (cc.renderContextType === cc.CANVAS) {
107+
// Force update
108+
if (this._string.length > 0) {
109+
this._updateTTF();
110+
}
111+
} else {
112+
this._updateTexture();
108113
}
109114
}
110115
},
111116

117+
_updateTexture:function () {
118+
var tex = new cc.Texture2D();
119+
tex.initWithString(this._string, this._fontName, this._fontSize * cc.CONTENT_SCALE_FACTOR(), cc.SIZE_POINTS_TO_PIXELS(this._dimensions),
120+
this._hAlignment, this._vAlignment);
121+
122+
if (!tex)
123+
return false;
124+
125+
this.setTexture(tex);
126+
var texSize = this._texture.getContentSize();
127+
this.setTextureRect(cc.rect(0, 0, texSize.width, texSize.height));
128+
129+
return true;
130+
},
131+
112132
/**
113133
* returns the text of the label
114134
* @return {String}
@@ -127,15 +147,18 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
127147

128148
/**
129149
* set Horizontal Alignment of cc.LabelTTF
130-
* @param {cc.TEXT_ALIGNMENT_LEFT|cc.TEXT_ALIGNMENT_CENTER|cc.TEXT_ALIGNMENT_RIGHT} Horizontal Alignment
150+
* @param {cc.TEXT_ALIGNMENT_LEFT|cc.TEXT_ALIGNMENT_CENTER|cc.TEXT_ALIGNMENT_RIGHT} alignment HorizontalAlignment
131151
*/
132152
setHorizontalAlignment:function (alignment) {
133153
if (alignment != this._hAlignment) {
134154
this._hAlignment = alignment;
135155

136156
// Force update
137157
if (this._string.length > 0) {
138-
this._updateTTF();
158+
if(cc.renderContextType === cc.CANVAS)
159+
this._updateTTF();
160+
else
161+
this._updateTexture();
139162
}
140163
}
141164
},
@@ -158,7 +181,10 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
158181

159182
// Force update
160183
if (this._string.length > 0) {
161-
this._updateTTF();
184+
if(cc.renderContextType === cc.CANVAS)
185+
this._updateTTF();
186+
else
187+
this._updateTexture();
162188
}
163189
}
164190
},
@@ -181,7 +207,10 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
181207

182208
// Force udpate
183209
if (this._string.length > 0) {
184-
this._updateTTF();
210+
if(cc.renderContextType === cc.CANVAS)
211+
this._updateTTF();
212+
else
213+
this._updateTexture();
185214
}
186215
}
187216
},
@@ -204,7 +233,10 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
204233

205234
// Force update
206235
if (this._string.length > 0) {
207-
this._updateTTF();
236+
if(cc.renderContextType === cc.CANVAS)
237+
this._updateTTF();
238+
else
239+
this._updateTexture();
208240
}
209241
}
210242
},
@@ -226,7 +258,10 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
226258
this._fontName = new String(fontName);
227259
// Force update
228260
if (this._string.length > 0) {
229-
this._updateTTF();
261+
if(cc.renderContextType === cc.CANVAS)
262+
this._updateTTF();
263+
else
264+
this._updateTexture();
230265
}
231266
}
232267
},
@@ -264,14 +299,21 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
264299
}
265300

266301
if (this.init(true)) {
302+
if (cc.renderContextType === cc.WEBGL)
303+
this.setShaderProgram(cc.ShaderCache.getInstance().programForKey(cc.LabelTTF._SHADER_PROGRAM));
304+
267305
this._dimensions = cc.size(dimensions.width, dimensions.height);
268306
this._fontName = fontName;
269307
this._hAlignment = hAlignment;
270308
this._vAlignment = vAlignment;
271-
this._fontSize = fontSize * cc.CONTENT_SCALE_FACTOR();
309+
this._fontSize = fontSize;
310+
272311
this.setString(strInfo);
273-
this._fontStyleStr = this._fontSize + "px '" + this._fontName + "'";
274-
this._updateTTF();
312+
313+
if (cc.renderContextType == cc.CANVAS) {
314+
this._fontStyleStr = this._fontSize + "px '" + this._fontName + "'";
315+
this._updateTTF();
316+
}
275317
return true;
276318
}
277319
return false;
@@ -307,14 +349,14 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
307349
} else if (this._dimensions.width == 0) {
308350
context.textBaseline = "bottom";
309351
context.textAlign = "left";
310-
if(!this._string.indexOf){
352+
if (!this._string.indexOf) {
311353
var z = 0;
312354
}
313355

314356
if (this._string.indexOf("\n") > -1)
315357
this._multiLineText(context);
316-
else
317-
context.fillText(this._string, -this._contentSize.width * this._anchorPoint.x, this._contentSize.height * this._anchorPoint.y);
358+
else
359+
context.fillText(this._string, -this._contentSize.width * this._anchorPoint.x, this._contentSize.height * this._anchorPoint.y);
318360
} else {
319361
context.textBaseline = cc.LabelTTF._textBaseline[this._vAlignment];
320362
context.textAlign = cc.LabelTTF._textAlign[this._hAlignment];
@@ -337,26 +379,26 @@ cc.LabelTTF = cc.Sprite.extend(/** @lends cc.LabelTTF# */{
337379
}
338380
},
339381

340-
_multiLineText:function(context){
382+
_multiLineText:function (context) {
341383
var rowHeight = this._fontSize * 1.2;
342384
var tmpWords = this._string.split("\n");
343385
var lineHeight = tmpWords.length;
344386
var splitStrWidthArr = [];
345387
var maxLineWidth = 0;
346-
for(var i = 0; i< lineHeight; i++){
388+
for (var i = 0; i < lineHeight; i++) {
347389
splitStrWidthArr[i] = context.measureText(tmpWords[i]).width;
348-
if(splitStrWidthArr[i] > maxLineWidth)
390+
if (splitStrWidthArr[i] > maxLineWidth)
349391
maxLineWidth = splitStrWidthArr[i];
350392
}
351393

352-
var centerPoint = cc.p(maxLineWidth / 2,(lineHeight * rowHeight) / 2);
394+
var centerPoint = cc.p(maxLineWidth / 2, (lineHeight * rowHeight) / 2);
353395
for (i = 0; i < lineHeight; i++) {
354-
var xOffset = -splitStrWidthArr[i]/2;
396+
var xOffset = -splitStrWidthArr[i] / 2;
355397
if (this._hAlignment == cc.TEXT_ALIGNMENT_RIGHT)
356398
xOffset = centerPoint.x - maxLineWidth;
357399
if (this._hAlignment == cc.TEXT_ALIGNMENT_CENTER)
358400
xOffset = maxLineWidth - splitStrWidthArr[i];
359-
context.fillText(tmpWords[i], xOffset, i * rowHeight - centerPoint.y + rowHeight/2);
401+
context.fillText(tmpWords[i], xOffset, i * rowHeight - centerPoint.y + rowHeight / 2);
360402
}
361403
},
362404

@@ -441,6 +483,8 @@ cc.LabelTTF._textAlign = ["left", "center", "right"];
441483

442484
cc.LabelTTF._textBaseline = ["top", "middle", "bottom"];
443485

486+
cc.LabelTTF._SHADER_PROGRAM = cc.USE_LA88_LABELS ? cc.SHADER_POSITION_TEXTURECOLOR : cc.SHADER_POSITION_TEXTUREA8COLOR;
487+
444488
/**
445489
* creates a cc.LabelTTF from a fontname, alignment, dimension and font size
446490
* @param {String} label

cocos2d/platform/CCConfig.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -205,6 +205,19 @@ cc.RETINA_DISPLAY_SUPPORT = 1;
205205
*/
206206
cc.RETINA_DISPLAY_FILENAME_SUFFIX = "-hd";
207207

208+
/**
209+
* <p>
210+
* If enabled, it will use LA88 (Luminance Alpha 16-bit textures) for CCLabelTTF objects. <br/>
211+
* If it is disabled, it will use A8 (Alpha 8-bit textures). <br/>
212+
* LA88 textures are 6% faster than A8 textures, but they will consume 2x memory. <br/>
213+
* <br/>
214+
* This feature is enabled by default.
215+
* </p>
216+
* @constant
217+
* @type Number
218+
*/
219+
cc.USE_LA88_LABELS = 1;
220+
208221
/**
209222
* <p>
210223
* If enabled, all subclasses of cc.Sprite will draw a bounding box<br/>

0 commit comments

Comments
 (0)