Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-23 05:03:37 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #2519 from TadejZupancic/patch-1

Browse source 
Fixing measurement of text width that produced too narrow canvas
This commit is contained in:
Richard Davey 2016-06-02 14:53:17 +01:00
commit 56cc7dc155
1 changed files with 91 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

94
src/gameobjects/Text.js
View file

@ -390,12 +390,23 @@ Phaser.Text.prototype.updateText = function () {
drawnLines = this.style.maxLines; drawnLines = this.style.maxLines;
} }
this._charCount = 0;
for (var i = 0; i < drawnLines; i++) for (var i = 0; i < drawnLines; i++)
{ {
if (tabs === 0) if (tabs === 0)
{ {
// Simple layout (no tabs) // Simple layout (no tabs)
var lineWidth = this.context.measureText(lines[i]).width + this.style.strokeThickness + this.padding.x; var lineWidth = this.style.strokeThickness + this.padding.x;
if (this.colors.length > 0 || this.strokeColors.length > 0 || this.fontWeights.length > 0 || this.fontStyles.length > 0)
{
lineWidth += this.measureLine(lines[i]);
}
else
{
lineWidth += this.context.measureText(lines[i]).width;
}
// Adjust for wrapped text // Adjust for wrapped text
if (this.style.wordWrap) if (this.style.wordWrap)
@ -415,7 +426,16 @@ Phaser.Text.prototype.updateText = function () {
for (var c = 0; c < line.length; c++) for (var c = 0; c < line.length; c++)
{ {
var section = Math.ceil(this.context.measureText(line[c]).width); var section = 0;
if (this.colors.length > 0 || this.strokeColors.length > 0 || this.fontWeights.length > 0 || this.fontStyles.length > 0)
{
section = this.measureLine(line[c]);
}
else
{
section = Math.ceil(this.context.measureText(line[c]).width);
}
if (c > 0) if (c > 0)
{ {
@ -430,7 +450,14 @@ Phaser.Text.prototype.updateText = function () {
for (var c = 0; c < line.length; c++) for (var c = 0; c < line.length; c++)
{ {
// How far to the next tab? // How far to the next tab?
lineWidth += Math.ceil(this.context.measureText(line[c]).width); if (this.colors.length > 0 || this.strokeColors.length > 0 || this.fontWeights.length > 0 || this.fontStyles.length > 0)
{
lineWidth += this.measureLine(line[c]);
}
else
{
lineWidth += Math.ceil(this.context.measureText(line[c]).width);
}
var diff = this.game.math.snapToCeil(lineWidth, tabs) - lineWidth; var diff = this.game.math.snapToCeil(lineWidth, tabs) - lineWidth;
@ -648,6 +675,67 @@ Phaser.Text.prototype.updateShadow = function (state) {
}; };
/**
* Measures a line of text character by character taking into the account the specified character styles.
*
* @method Phaser.Text#measureLine
* @private
* @param {string} line - The line of text to measure.
* @return {integer} length of the line.
*/
Phaser.Text.prototype.measureLine = function (line) {
var lineLength = 0;
for (var i = 0; i < line.length; i++)
{
var letter = line[i];
if (this.fontWeights.length > 0 || this.fontStyles.length > 0)
{
var components = this.fontToComponents(this.context.font);
if (this.fontStyles[this._charCount])
{
components.fontStyle = this.fontStyles[this._charCount];
}
if (this.fontWeights[this._charCount])
{
components.fontWeight = this.fontWeights[this._charCount];
}
this.context.font = this.componentsToFont(components);
}
if (this.style.stroke && this.style.strokeThickness)
{
if (this.strokeColors[this._charCount])
{
this.context.strokeStyle = this.strokeColors[this._charCount];
}
this.updateShadow(this.style.shadowStroke);
}
if (this.style.fill)
{
if (this.colors[this._charCount])
{
this.context.fillStyle = this.colors[this._charCount];
}
this.updateShadow(this.style.shadowFill);
}
lineLength += this.context.measureText(letter).width;
this._charCount++;
}
return Math.ceil(lineLength);
};
/** /**
* Updates a line of text, applying fill and stroke per-character colors or style and weight per-character font if applicable. * Updates a line of text, applying fill and stroke per-character colors or style and weight per-character font if applicable.
* *