mirror of
https://github.com/photonstorm/phaser
synced 2025-02-02 07:13:49 +00:00
Phaser.Text no longer extends PIXI.Text but replaces it entirely. Phaser.Text now natively extends a Phaser Sprite, meaning it can be enabled for physics, damaged, etc.
This commit is contained in:
photonstorm
parent
102c74e121
commit
0258245f12
4 changed files with 312 additions and 364 deletions
|
|
@ -256,6 +256,8 @@ Version 2.4 - "Katar" - in dev
|
|||
* Input.deleteMoveCallback no longer takes an integer as its parameter. Now you have to give it the original callback and context in order to remove it. This is to protect against index invalidation (see the fixed Bugs list)
|
||||
* Group.add and Group.addAt will only create a Physics Body on the child if it doesn't already have one. This is a change from 2.3 where it would replace the physics body property with the new body, but this could lead to garbage build-up over time, so you should now properly destroy the body before changing it.
|
||||
* Button game objects now have `Input.useHandCursor` set to `true` by default.
|
||||
* Phaser.BitmapText no longer extends PIXI.BitmapText but replaces it entirely.
|
||||
* Phaser.Text no longer extends PIXI.Text but replaces it entirely. Phaser.Text now natively extends a Phaser Sprite, meaning it can be enabled for physics, damaged, etc.
|
||||
|
||||
### New Features
|
||||
|
||||
|
|
|
|||
|
|
@ -48,7 +48,6 @@
|
|||
<script src="$path/src/pixi/display/DisplayObjectContainer.js"></script>
|
||||
<script src="$path/src/pixi/display/Sprite.js"></script>
|
||||
<script src="$path/src/pixi/display/SpriteBatch.js"></script>
|
||||
<script src="$path/src/pixi/text/Text.js"></script>
|
||||
<script src="$path/src/pixi/display/Stage.js"></script>
|
||||
|
||||
<script src="$path/src/pixi/utils/Utils.js"></script>
|
||||
|
|
|
|||
|
|
@ -13,21 +13,7 @@
|
|||
* See {@link http://www.jordanm.co.uk/tinytype this compatibility table} for the available default fonts across mobile browsers.
|
||||
*
|
||||
* @class Phaser.Text
|
||||
* @extends PIXI.Text
|
||||
* @extends Phaser.Component.Core
|
||||
* @extends Phaser.Component.Angle
|
||||
* @extends Phaser.Component.AutoCull
|
||||
* @extends Phaser.Component.Bounds
|
||||
* @extends Phaser.Component.BringToTop
|
||||
* @extends Phaser.Component.Destroy
|
||||
* @extends Phaser.Component.FixedToCamera
|
||||
* @extends Phaser.Component.InputEnabled
|
||||
* @extends Phaser.Component.InWorld
|
||||
* @extends Phaser.Component.LifeSpan
|
||||
* @extends Phaser.Component.Overlap
|
||||
* @extends Phaser.Component.PhysicsBody
|
||||
* @extends Phaser.Component.Reset
|
||||
* @extends Phaser.Component.Smoothed
|
||||
* @extends Phaser.Sprite
|
||||
* @constructor
|
||||
* @param {Phaser.Game} game - Current game instance.
|
||||
* @param {number} x - X position of the new text object.
|
||||
|
|
@ -70,6 +56,28 @@ Phaser.Text = function (game, x, y, text, style) {
|
|||
*/
|
||||
this.padding = new Phaser.Point();
|
||||
|
||||
/**
|
||||
* @property {HTMLCanvasElement} canvas - The canvas element that the text is rendered.
|
||||
*/
|
||||
this.canvas = document.createElement('canvas');
|
||||
|
||||
/**
|
||||
* @property {HTMLCanvasElement} context - The context of the canvas element that the text is rendered to.
|
||||
*/
|
||||
this.context = this.canvas.getContext('2d');
|
||||
|
||||
/**
|
||||
*
|
||||
* @property {number} resolution - The resolution of the canvas.
|
||||
* @default
|
||||
*/
|
||||
this.resolution = 1;
|
||||
|
||||
/**
|
||||
* @property {array} colors - An array of the color values as specified by {@link Phaser.Text#addColor addColor}.
|
||||
*/
|
||||
this.colors = [];
|
||||
|
||||
/**
|
||||
* @property {string} _text - Internal cache var.
|
||||
* @private
|
||||
|
|
@ -95,16 +103,21 @@ Phaser.Text = function (game, x, y, text, style) {
|
|||
this._charCount = 0;
|
||||
|
||||
/**
|
||||
* @property {array} colors - An array of the color values as specified by {@link Phaser.Text#addColor addColor}.
|
||||
* @property {number} _width - Internal width var.
|
||||
* @private
|
||||
*/
|
||||
this.colors = [];
|
||||
this._width = 0;
|
||||
|
||||
/**
|
||||
* @property {number} _height - Internal height var.
|
||||
* @private
|
||||
*/
|
||||
this._height = 0;
|
||||
|
||||
Phaser.Sprite.call(this, game, x, y, PIXI.Texture.fromCanvas(this.canvas));
|
||||
|
||||
this.setStyle(style);
|
||||
|
||||
PIXI.Text.call(this, text, this.style);
|
||||
|
||||
Phaser.Component.Core.init.call(this, game, x, y, '', null);
|
||||
|
||||
if (text !== ' ')
|
||||
{
|
||||
this.updateText();
|
||||
|
|
@ -112,30 +125,9 @@ Phaser.Text = function (game, x, y, text, style) {
|
|||
|
||||
};
|
||||
|
||||
Phaser.Text.prototype = Object.create(PIXI.Text.prototype);
|
||||
Phaser.Text.prototype = Object.create(Phaser.Sprite.prototype);
|
||||
Phaser.Text.prototype.constructor = Phaser.Text;
|
||||
|
||||
Phaser.Component.Core.install.call(Phaser.Text.prototype, [
|
||||
'Angle',
|
||||
'AutoCull',
|
||||
'Bounds',
|
||||
'BringToTop',
|
||||
'Destroy',
|
||||
'FixedToCamera',
|
||||
'InputEnabled',
|
||||
'InWorld',
|
||||
'LifeSpan',
|
||||
'Overlap',
|
||||
'PhysicsBody',
|
||||
'Reset',
|
||||
'Smoothed'
|
||||
]);
|
||||
|
||||
Phaser.Text.prototype.preUpdatePhysics = Phaser.Component.PhysicsBody.preUpdate;
|
||||
Phaser.Text.prototype.preUpdateLifeSpan = Phaser.Component.LifeSpan.preUpdate;
|
||||
Phaser.Text.prototype.preUpdateInWorld = Phaser.Component.InWorld.preUpdate;
|
||||
Phaser.Text.prototype.preUpdateCore = Phaser.Component.Core.preUpdate;
|
||||
|
||||
/**
|
||||
* Automatically called by World.preUpdate.
|
||||
*
|
||||
|
|
@ -662,7 +654,226 @@ Phaser.Text.prototype.componentsToFont = function (components) {
|
|||
};
|
||||
|
||||
/**
|
||||
* The text string to be displayed by this Text object, taking into account the style settings.
|
||||
* The text to be displayed by this Text object.
|
||||
* Use a \n to insert a carriage return and split the text.
|
||||
* The text will be rendered with any style currently set.
|
||||
*
|
||||
* @method Phaser.Text#setText
|
||||
* @param {string} [text] - The text to be displayed. Set to an empty string to clear text that is already present.
|
||||
*/
|
||||
Phaser.Text.prototype.setText = function (text) {
|
||||
|
||||
this.text = text.toString() || '';
|
||||
this.dirty = true;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates the texture based on the canvas dimensions.
|
||||
*
|
||||
* @method Phaser.Text#updateTexture
|
||||
* @private
|
||||
*/
|
||||
Phaser.Text.prototype.updateTexture = function () {
|
||||
|
||||
this.texture.baseTexture.width = this.canvas.width;
|
||||
this.texture.baseTexture.height = this.canvas.height;
|
||||
this.texture.crop.width = this.texture.frame.width = this.canvas.width;
|
||||
this.texture.crop.height = this.texture.frame.height = this.canvas.height;
|
||||
|
||||
this._width = this.canvas.width;
|
||||
this._height = this.canvas.height;
|
||||
|
||||
// update the dirty base textures
|
||||
this.texture.baseTexture.dirty();
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the WebGL renderer
|
||||
*
|
||||
* @method Phaser.Text#_renderWebGL
|
||||
* @private
|
||||
* @param {RenderSession} renderSession - The Render Session to render the Text on.
|
||||
*/
|
||||
Phaser.Text.prototype._renderWebGL = function (renderSession) {
|
||||
|
||||
if (this.dirty)
|
||||
{
|
||||
this.resolution = renderSession.resolution;
|
||||
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
PIXI.Sprite.prototype._renderWebGL.call(this, renderSession);
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the Canvas renderer.
|
||||
*
|
||||
* @method Phaser.Text#_renderCanvas
|
||||
* @private
|
||||
* @param {RenderSession} renderSession - The Render Session to render the Text on.
|
||||
*/
|
||||
Phaser.Text.prototype._renderCanvas = function (renderSession) {
|
||||
|
||||
if (this.dirty)
|
||||
{
|
||||
this.resolution = renderSession.resolution;
|
||||
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
PIXI.Sprite.prototype._renderCanvas.call(this, renderSession);
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Calculates the ascent, descent and fontSize of a given font style.
|
||||
*
|
||||
* @method Phaser.Text#determineFontProperties
|
||||
* @private
|
||||
* @param {object} fontStyle
|
||||
*/
|
||||
Phaser.Text.prototype.determineFontProperties = function (fontStyle) {
|
||||
|
||||
var properties = Phaser.Text.fontPropertiesCache[fontStyle];
|
||||
|
||||
if (!properties)
|
||||
{
|
||||
properties = {};
|
||||
|
||||
var canvas = Phaser.Text.fontPropertiesCanvas;
|
||||
var context = Phaser.Text.fontPropertiesContext;
|
||||
|
||||
context.font = fontStyle;
|
||||
|
||||
var width = Math.ceil(context.measureText('|MÉq').width);
|
||||
var baseline = Math.ceil(context.measureText('|MÉq').width);
|
||||
var height = 2 * baseline;
|
||||
|
||||
baseline = baseline * 1.4 | 0;
|
||||
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
context.fillStyle = '#f00';
|
||||
context.fillRect(0, 0, width, height);
|
||||
|
||||
context.font = fontStyle;
|
||||
|
||||
context.textBaseline = 'alphabetic';
|
||||
context.fillStyle = '#000';
|
||||
context.fillText('|MÉq', 0, baseline);
|
||||
|
||||
if (!context.getImageData(0, 0, width, height))
|
||||
{
|
||||
properties.ascent = baseline;
|
||||
properties.descent = baseline + 6;
|
||||
properties.fontSize = properties.ascent + properties.descent;
|
||||
|
||||
Phaser.Text.fontPropertiesCache[fontStyle] = properties;
|
||||
|
||||
return properties;
|
||||
}
|
||||
|
||||
var imagedata = context.getImageData(0, 0, width, height).data;
|
||||
var pixels = imagedata.length;
|
||||
var line = width * 4;
|
||||
|
||||
var i, j;
|
||||
|
||||
var idx = 0;
|
||||
var stop = false;
|
||||
|
||||
// ascent. scan from top to bottom until we find a non red pixel
|
||||
for (i = 0; i < baseline; i++)
|
||||
{
|
||||
for (j = 0; j < line; j += 4)
|
||||
{
|
||||
if (imagedata[idx + j] !== 255)
|
||||
{
|
||||
stop = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!stop)
|
||||
{
|
||||
idx += line;
|
||||
}
|
||||
else
|
||||
{
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
properties.ascent = baseline - i;
|
||||
|
||||
idx = pixels - line;
|
||||
stop = false;
|
||||
|
||||
// descent. scan from bottom to top until we find a non red pixel
|
||||
for (i = height; i > baseline; i--)
|
||||
{
|
||||
for (j = 0; j < line; j += 4)
|
||||
{
|
||||
if (imagedata[idx + j] !== 255)
|
||||
{
|
||||
stop = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!stop)
|
||||
{
|
||||
idx -= line;
|
||||
}
|
||||
else
|
||||
{
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
properties.descent = i - baseline;
|
||||
//TODO might need a tweak. kind of a temp fix!
|
||||
properties.descent += 6;
|
||||
properties.fontSize = properties.ascent + properties.descent;
|
||||
|
||||
Phaser.Text.fontPropertiesCache[fontStyle] = properties;
|
||||
}
|
||||
|
||||
return properties;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Returns the bounds of the Text as a rectangle.
|
||||
* The bounds calculation takes the worldTransform into account.
|
||||
*
|
||||
* @method Phaser.Text#getBounds
|
||||
* @param {Phaser.Matrix} matrix - The transformation matrix of the Text.
|
||||
* @return {Phaser.Rectangle} The framing rectangle
|
||||
*/
|
||||
Phaser.Text.prototype.getBounds = function (matrix) {
|
||||
|
||||
if (this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
return PIXI.Sprite.prototype.getBounds.call(this, matrix);
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* The text to be displayed by this Text object.
|
||||
* Use a \n to insert a carriage return and split the text.
|
||||
* The text will be rendered with any style currently set.
|
||||
*
|
||||
* @name Phaser.Text#text
|
||||
* @property {string} text
|
||||
|
|
@ -1146,3 +1357,58 @@ Object.defineProperty(Phaser.Text.prototype, 'shadowFill', {
|
|||
}
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* @name Phaser.Text#width
|
||||
* @property {number} width - The width of the Text. Setting this will modify the scale to achieve the value requested.
|
||||
*/
|
||||
Object.defineProperty(Phaser.Text.prototype, 'width', {
|
||||
|
||||
get: function() {
|
||||
|
||||
if (this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
return this.scale.x * this.texture.frame.width;
|
||||
},
|
||||
|
||||
set: function(value) {
|
||||
|
||||
this.scale.x = value / this.texture.frame.width;
|
||||
this._width = value;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* @name Phaser.Text#height
|
||||
* @property {number} height - The height of the Text. Setting this will modify the scale to achieve the value requested.
|
||||
*/
|
||||
Object.defineProperty(Phaser.Text.prototype, 'height', {
|
||||
|
||||
get: function() {
|
||||
|
||||
if (this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
return this.scale.y * this.texture.frame.height;
|
||||
},
|
||||
|
||||
set: function(value) {
|
||||
|
||||
this.scale.y = value / this.texture.frame.height;
|
||||
this._height = value;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
Phaser.Text.fontPropertiesCache = {};
|
||||
|
||||
Phaser.Text.fontPropertiesCanvas = document.createElement('canvas');
|
||||
Phaser.Text.fontPropertiesContext = Phaser.Text.fontPropertiesCanvas.getContext('2d');
|
||||
|
|
|
|||
|
|
@ -1,319 +0,0 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
* Modified by Tom Slezakowski http://www.tomslezakowski.com @TomSlezakowski (24/03/2014) - Added dropShadowColor.
|
||||
*/
|
||||
|
||||
/**
|
||||
* A Text Object will create a line or multiple lines of text. To split a line you can use '\n' in your text string,
|
||||
* or add a wordWrap property set to true and and wordWrapWidth property with a value in the style object.
|
||||
*
|
||||
* @class Text
|
||||
* @extends Sprite
|
||||
* @constructor
|
||||
* @param text {String} The copy that you would like the text to display
|
||||
* @param [style] {Object} The style parameters
|
||||
* @param [style.font] {String} default 'bold 20px Arial' The style and size of the font
|
||||
* @param [style.fill='black'] {String|Number} A canvas fillstyle that will be used on the text e.g 'red', '#00FF00'
|
||||
* @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text
|
||||
* @param [style.stroke] {String|Number} A canvas fillstyle that will be used on the text stroke e.g 'blue', '#FCFF00'
|
||||
* @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke)
|
||||
* @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used
|
||||
* @param [style.wordWrapWidth=100] {Number} The width at which text will wrap, it needs wordWrap to be set to true
|
||||
* @param [style.dropShadow=false] {Boolean} Set a drop shadow for the text
|
||||
* @param [style.dropShadowColor='#000000'] {String} A fill style to be used on the dropshadow e.g 'red', '#00FF00'
|
||||
* @param [style.dropShadowAngle=Math.PI/4] {Number} Set a angle of the drop shadow
|
||||
* @param [style.dropShadowDistance=5] {Number} Set a distance of the drop shadow
|
||||
*/
|
||||
PIXI.Text = function(text, style)
|
||||
{
|
||||
/**
|
||||
* The canvas element that everything is drawn to
|
||||
*
|
||||
* @property canvas
|
||||
* @type HTMLCanvasElement
|
||||
*/
|
||||
this.canvas = document.createElement('canvas');
|
||||
|
||||
/**
|
||||
* The canvas 2d context that everything is drawn with
|
||||
* @property context
|
||||
* @type HTMLCanvasElement
|
||||
*/
|
||||
this.context = this.canvas.getContext('2d');
|
||||
|
||||
/**
|
||||
* The resolution of the canvas.
|
||||
* @property resolution
|
||||
* @type Number
|
||||
*/
|
||||
this.resolution = 1;
|
||||
|
||||
PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas));
|
||||
|
||||
this.setText(text);
|
||||
this.setStyle(style);
|
||||
};
|
||||
|
||||
// constructor
|
||||
PIXI.Text.prototype = Object.create(PIXI.Sprite.prototype);
|
||||
PIXI.Text.prototype.constructor = PIXI.Text;
|
||||
|
||||
/**
|
||||
* The width of the Text, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(PIXI.Text.prototype, 'width', {
|
||||
get: function() {
|
||||
|
||||
if(this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
|
||||
return this.scale.x * this.texture.frame.width;
|
||||
},
|
||||
set: function(value) {
|
||||
this.scale.x = value / this.texture.frame.width;
|
||||
this._width = value;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* The height of the Text, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(PIXI.Text.prototype, 'height', {
|
||||
get: function() {
|
||||
|
||||
if(this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
|
||||
return this.scale.y * this.texture.frame.height;
|
||||
},
|
||||
set: function(value) {
|
||||
this.scale.y = value / this.texture.frame.height;
|
||||
this._height = value;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Set the copy for the text object. To split a line you can use '\n'.
|
||||
*
|
||||
* @method setText
|
||||
* @param text {String} The copy that you would like the text to display
|
||||
*/
|
||||
PIXI.Text.prototype.setText = function(text)
|
||||
{
|
||||
this.text = text.toString() || ' ';
|
||||
this.dirty = true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates texture size based on canvas size
|
||||
*
|
||||
* @method updateTexture
|
||||
* @private
|
||||
*/
|
||||
PIXI.Text.prototype.updateTexture = function()
|
||||
{
|
||||
this.texture.baseTexture.width = this.canvas.width;
|
||||
this.texture.baseTexture.height = this.canvas.height;
|
||||
this.texture.crop.width = this.texture.frame.width = this.canvas.width;
|
||||
this.texture.crop.height = this.texture.frame.height = this.canvas.height;
|
||||
|
||||
this._width = this.canvas.width;
|
||||
this._height = this.canvas.height;
|
||||
|
||||
// update the dirty base textures
|
||||
this.texture.baseTexture.dirty();
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the WebGL renderer
|
||||
*
|
||||
* @method _renderWebGL
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
*/
|
||||
PIXI.Text.prototype._renderWebGL = function(renderSession)
|
||||
{
|
||||
if(this.dirty)
|
||||
{
|
||||
this.resolution = renderSession.resolution;
|
||||
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
PIXI.Sprite.prototype._renderWebGL.call(this, renderSession);
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the Canvas renderer
|
||||
*
|
||||
* @method _renderCanvas
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
*/
|
||||
PIXI.Text.prototype._renderCanvas = function(renderSession)
|
||||
{
|
||||
if(this.dirty)
|
||||
{
|
||||
this.resolution = renderSession.resolution;
|
||||
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
PIXI.Sprite.prototype._renderCanvas.call(this, renderSession);
|
||||
};
|
||||
|
||||
/**
|
||||
* Calculates the ascent, descent and fontSize of a given fontStyle
|
||||
*
|
||||
* @method determineFontProperties
|
||||
* @param fontStyle {Object}
|
||||
* @private
|
||||
*/
|
||||
PIXI.Text.prototype.determineFontProperties = function(fontStyle)
|
||||
{
|
||||
var properties = PIXI.Text.fontPropertiesCache[fontStyle];
|
||||
|
||||
if (!properties)
|
||||
{
|
||||
properties = {};
|
||||
|
||||
var canvas = PIXI.Text.fontPropertiesCanvas;
|
||||
var context = PIXI.Text.fontPropertiesContext;
|
||||
|
||||
context.font = fontStyle;
|
||||
|
||||
var width = Math.ceil(context.measureText('|MÉq').width);
|
||||
var baseline = Math.ceil(context.measureText('|MÉq').width);
|
||||
var height = 2 * baseline;
|
||||
|
||||
baseline = baseline * 1.4 | 0;
|
||||
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
context.fillStyle = '#f00';
|
||||
context.fillRect(0, 0, width, height);
|
||||
|
||||
context.font = fontStyle;
|
||||
|
||||
context.textBaseline = 'alphabetic';
|
||||
context.fillStyle = '#000';
|
||||
context.fillText('|MÉq', 0, baseline);
|
||||
|
||||
if (!context.getImageData(0, 0, width, height))
|
||||
{
|
||||
properties.ascent = baseline;
|
||||
properties.descent = baseline + 6;
|
||||
properties.fontSize = properties.ascent + properties.descent;
|
||||
|
||||
PIXI.Text.fontPropertiesCache[fontStyle] = properties;
|
||||
|
||||
return properties;
|
||||
}
|
||||
|
||||
var imagedata = context.getImageData(0, 0, width, height).data;
|
||||
var pixels = imagedata.length;
|
||||
var line = width * 4;
|
||||
|
||||
var i, j;
|
||||
|
||||
var idx = 0;
|
||||
var stop = false;
|
||||
|
||||
// ascent. scan from top to bottom until we find a non red pixel
|
||||
for (i = 0; i < baseline; i++)
|
||||
{
|
||||
for (j = 0; j < line; j += 4)
|
||||
{
|
||||
if (imagedata[idx + j] !== 255)
|
||||
{
|
||||
stop = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!stop)
|
||||
{
|
||||
idx += line;
|
||||
}
|
||||
else
|
||||
{
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
properties.ascent = baseline - i;
|
||||
|
||||
idx = pixels - line;
|
||||
stop = false;
|
||||
|
||||
// descent. scan from bottom to top until we find a non red pixel
|
||||
for (i = height; i > baseline; i--)
|
||||
{
|
||||
for (j = 0; j < line; j += 4)
|
||||
{
|
||||
if (imagedata[idx + j] !== 255)
|
||||
{
|
||||
stop = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!stop)
|
||||
{
|
||||
idx -= line;
|
||||
}
|
||||
else
|
||||
{
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
properties.descent = i - baseline;
|
||||
//TODO might need a tweak. kind of a temp fix!
|
||||
properties.descent += 6;
|
||||
properties.fontSize = properties.ascent + properties.descent;
|
||||
|
||||
PIXI.Text.fontPropertiesCache[fontStyle] = properties;
|
||||
}
|
||||
|
||||
return properties;
|
||||
};
|
||||
|
||||
/**
|
||||
* Returns the bounds of the Text as a rectangle. The bounds calculation takes the worldTransform into account.
|
||||
*
|
||||
* @method getBounds
|
||||
* @param matrix {Matrix} the transformation matrix of the Text
|
||||
* @return {Rectangle} the framing rectangle
|
||||
*/
|
||||
PIXI.Text.prototype.getBounds = function(matrix)
|
||||
{
|
||||
if(this.dirty)
|
||||
{
|
||||
this.updateText();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
return PIXI.Sprite.prototype.getBounds.call(this, matrix);
|
||||
};
|
||||
|
||||
PIXI.Text.fontPropertiesCache = {};
|
||||
PIXI.Text.fontPropertiesCanvas = document.createElement('canvas');
|
||||
PIXI.Text.fontPropertiesContext = PIXI.Text.fontPropertiesCanvas.getContext('2d');
|
||||
Loading…
Reference in a new issue