wassname/phaser
1
0
Fork 0
mirror of https://github.com/wassname/phaser.git synced 2026-07-08 00:10:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

BitmapFont moved to extending RenderTexture instead of BitmapData. Now applied as a texture to a Sprite/Image.

Browse Source
This commit is contained in:
photonstorm
2014-02-14 13:50:50 +00:00
parent c3f306c795
commit ef95fbaa00
4 changed files with 113 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/wip/bitmaptext3.js
+17 -7
View File
@@ -9,12 +9,22 @@ function preload() {
}
var font;
var i;
function create() {
font = game.add.bitmapFont(game.world.centerX, 300, 'knightHawks', 31, 25, Phaser.BitmapFont.TEXT_SET6, 10, 1, 1);
font.anchor.set(0.5);
font = game.add.bitmapFont('knightHawks', 31, 25, Phaser.BitmapFont.TEXT_SET6, 10, 1, 1);
font.text = 'phaser was here';
for (var c = 0; c < 10; c++)
{
var i = game.add.image(0, c * 32, font);
i.tint = Math.random() * 0xFFFFFF;
}
// i.scale.set(2);
// font.anchor.set(0.5);
// font.text = 'phaser';
game.input.onDown.add(change, this);
@@ -23,21 +33,21 @@ function create() {
function change() {
font.tint = Math.random() * 0xFFFFFF;
font.text = 'rocking the house';
}
function update() {
// font.text = "phaser\n\nx: " + game.input.x + "\ny: " + game.input.y;
font.text = "phaser x: " + game.input.x + " y: " + game.input.y;
// font.text = "phaser x: " + game.input.x + " y: " + game.input.y;
}
function render() {
game.debug.renderText("x: " + game.input.x + "\ny: " + game.input.y, 32, 32);
game.debug.renderText(font.bmd.width + " x " + font.bmd.height, 32, 64);
game.debug.renderText(font.width + " x " + font.height, 32, 96);
// game.debug.renderText("x: " + game.input.x + "\ny: " + game.input.y, 32, 32);
// game.debug.renderText(font.bmd.width + " x " + font.bmd.height, 32, 64);
// game.debug.renderText(font.width + " x " + font.height, 32, 96);
}
src/gameobjects/BitmapFont.js
+75 -31
View File
@@ -6,6 +6,7 @@
/**
* @class Phaser.BitmapFont
* @extends Phaser.RenderTexture
* @constructor
* @param {Phaser.Game} game - Current game instance.
* @param {string} key - The font set graphic set as stored in the Game.Cache.
@@ -18,7 +19,7 @@
* @param {number} [xOffset=0] - If the font set doesn't start at the top left of the given image, specify the X coordinate offset here.
* @param {number} [yOffset=0] - If the font set doesn't start at the top left of the given image, specify the Y coordinate offset here.
*/
Phaser.BitmapFont = function (game, x, y, key, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset) {
Phaser.BitmapFont = function (game, key, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset) {
/**
* @property {number} characterWidth - The width of each character in the font set.
@@ -112,11 +113,22 @@ Phaser.BitmapFont = function (game, x, y, key, characterWidth, characterHeight,
var currentX = this.offsetX;
var currentY = this.offsetY;
var r = 0;
var data = new Phaser.FrameData();
for (var c = 0; c < chars.length; c++)
{
// The rect is hooked to the ASCII value of the character
this.grabData[chars.charCodeAt(c)] = new Phaser.Rectangle(currentX, currentY, this.characterWidth, this.characterHeight);
var uuid = game.rnd.uuid();
var frame = data.addFrame(new Phaser.Frame(c, currentX, currentY, this.characterWidth, this.characterHeight, '', uuid));
this.grabData[chars.charCodeAt(c)] = frame.index;
PIXI.TextureCache[uuid] = new PIXI.Texture(PIXI.BaseTextureCache[key], {
x: currentX,
y: currentY,
width: this.characterWidth,
height: this.characterHeight
});
r++;
@@ -132,13 +144,11 @@ Phaser.BitmapFont = function (game, x, y, key, characterWidth, characterHeight,
}
}
/**
* @property {Phaser.BitmapData} bmd - The internal BitmapData to which the font is rendered.
*/
// this.bmd = new Phaser.BitmapData(game, this.characterWidth, this.characterHeight);
this.bmd = new Phaser.BitmapData(game, 800, 600);
game.cache.updateFrameData(key, data);
Phaser.Image.call(this, game, x, y, this.bmd);
this.stamp = new Phaser.Image(game, 0, 0, key, 0);
Phaser.RenderTexture.call(this, game);
/**
* @property {number} type - Base Phaser object type.
@@ -147,7 +157,7 @@ Phaser.BitmapFont = function (game, x, y, key, characterWidth, characterHeight,
};
Phaser.BitmapFont.prototype = Object.create(Phaser.Image.prototype);
Phaser.BitmapFont.prototype = Object.create(Phaser.RenderTexture.prototype);
Phaser.BitmapFont.prototype.constructor = Phaser.BitmapFont;
/**
@@ -301,6 +311,41 @@ Phaser.BitmapFont.prototype.setText = function (content, multiLine, characterSpa
}
/**
* Over rides the default PIXI.RenderTexture resize event as we need our baseTexture resized as well.
*
* @method Phaser.BitmapFont#resize
* @memberof Phaser.BitmapFont
*/
Phaser.BitmapFont.prototype.resize = function (width, height) {
this.width = width;
this.height = height;
this.frame.width = this.width;
this.frame.height = this.height;
this.baseTexture.width = this.width;
this.baseTexture.height = this.height;
if (this.renderer.type === PIXI.WEBGL_RENDERER)
{
this.projection.x = this.width / 2;
this.projection.y = -this.height / 2;
var gl = this.renderer.gl;
gl.bindTexture(gl.TEXTURE_2D, this.baseTexture._glTextures[gl.id]);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, this.width, this.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
}
else
{
this.textureBuffer.resize(this.width, this.height);
}
PIXI.Texture.frameUpdates.push(this);
}
/**
* Updates the BitmapData of the Sprite with the text
*
@@ -311,19 +356,21 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
var cx = 0;
var cy = 0;
if (this.multiLine)
{
var lines = this._text.split("\n");
if (this.fixedWidth > 0)
{
this.bmd.resize(fixedWidth, (lines.length * (this.characterHeight + this.customSpacingY)) - this.customSpacingY);
this.resize(fixedWidth, (lines.length * (this.characterHeight + this.customSpacingY)) - this.customSpacingY);
}
else
{
this.bmd.resize(this.getLongestLine() * (this.characterWidth + this.customSpacingX), (lines.length * (this.characterHeight + this.customSpacingY)) - this.customSpacingY);
this.resize(this.getLongestLine() * (this.characterWidth + this.customSpacingX), (lines.length * (this.characterHeight + this.customSpacingY)) - this.customSpacingY);
}
this.textureBuffer.clear();
// Loop through each line of text
for (var i = 0; i < lines.length; i++)
@@ -336,11 +383,11 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
break;
case Phaser.BitmapFont.ALIGN_RIGHT:
cx = this.bmd.width - (lines[i].length * (this.characterWidth + this.customSpacingX));
cx = this.width - (lines[i].length * (this.characterWidth + this.customSpacingX));
break;
case Phaser.BitmapFont.ALIGN_CENTER:
cx = (this.bmd.width / 2) - ((lines[i].length * (this.characterWidth + this.customSpacingX)) / 2);
cx = (this.width / 2) - ((lines[i].length * (this.characterWidth + this.customSpacingX)) / 2);
cx += this.customSpacingX / 2;
break;
}
@@ -360,12 +407,14 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
{
if (this.fixedWidth > 0)
{
this.bmd.resize(fixedWidth, this.characterHeight);
this.resize(fixedWidth, this.characterHeight);
}
else
{
this.bmd.resize(this._text.length * (this.characterWidth + this.customSpacingX), this.characterHeight);
this.resize(this._text.length * (this.characterWidth + this.customSpacingX), this.characterHeight);
}
this.textureBuffer.clear();
switch (this.align)
{
@@ -374,11 +423,11 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
break;
case Phaser.BitmapFont.ALIGN_RIGHT:
cx = this.bmd.width - (this._text.length * (this.characterWidth + this.customSpacingX));
cx = this.width - (this._text.length * (this.characterWidth + this.customSpacingX));
break;
case Phaser.BitmapFont.ALIGN_CENTER:
cx = (this.bmd.width / 2) - ((this._text.length * (this.characterWidth + this.customSpacingX)) / 2);
cx = (this.width / 2) - ((this._text.length * (this.characterWidth + this.customSpacingX)) / 2);
cx += this.customSpacingX / 2;
break;
}
@@ -386,16 +435,6 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
this.pasteLine(this._text, cx, 0, this.customSpacingX);
}
this.bmd.render();
this.texture.frame.width = this.bmd.width;
this.texture.frame.height = this.bmd.height;
this.updateFrame = true;
this.dirty = true;
this.textureChange = true;
// this.setTexture(this.bmd.texture);
// this.width = this.bmd.width;
// this.height = this.bmd.height;
}
/**
@@ -411,6 +450,8 @@ Phaser.BitmapFont.prototype.buildBitmapFontText = function () {
*/
Phaser.BitmapFont.prototype.pasteLine = function (line, x, y, customSpacingX) {
var p = new Phaser.Point();
for (var c = 0; c < line.length; c++)
{
// If it's a space then there is no point copying, so leave a blank space
@@ -423,11 +464,14 @@ Phaser.BitmapFont.prototype.pasteLine = function (line, x, y, customSpacingX) {
// If the character doesn't exist in the font then we don't want a blank space, we just want to skip it
if (this.grabData[line.charCodeAt(c)])
{
this.bmd.copyPixels(this.fontSet, this.grabData[line.charCodeAt(c)], x, y);
this.stamp.frame = this.grabData[line.charCodeAt(c)];
p.set(x, y);
this.render(this.stamp, p, false);
// this.bmd.copyPixels(this.fontSet, this.grabData[line.charCodeAt(c)], x, y);
x += this.characterWidth + this.customSpacingX;
if (x > this.bmd.width)
if (x > this.width)
{
break;
}
src/gameobjects/GameObjectFactory.js
+4 -9
View File
@@ -260,8 +260,6 @@ Phaser.GameObjectFactory.prototype = {
/**
* Create a new BitmapFont object.
*
* @param {number} x - X position of the new bitmapText object.
* @param {number} y - Y position of the new bitmapText object.
* @param {string} font - The key of the BitmapFont as stored in Game.Cache.
* @param {number} characterWidth - The width of each character in the font set.
* @param {number} characterHeight - The height of each character in the font set.
@@ -271,14 +269,11 @@ Phaser.GameObjectFactory.prototype = {
* @param {number} [ySpacing=0] - If the characters in the font set have vertical spacing between them set the required amount here.
* @param {number} [xOffset=0] - If the font set doesn't start at the top left of the given image, specify the X coordinate offset here.
* @param {number} [yOffset=0] - If the font set doesn't start at the top left of the given image, specify the Y coordinate offset here.
* @param {Phaser.Group} [group] - Optional Group to add the object to. If not specified it will be added to the World group.
* @return {Phaser.BitmapFont} The newly created BitmapFont object.
* @return {Phaser.BitmapFont} The newly created BitmapFont texture which can be applied to an Image or Sprite.
*/
bitmapFont: function (x, y, font, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset, group) {
bitmapFont: function (font, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset) {
if (typeof group === 'undefined') { group = this.world; }
return group.add(new Phaser.BitmapFont(this.game, x, y, font, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset));
return new Phaser.BitmapFont(this.game, font, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset);
},
@@ -328,8 +323,8 @@ Phaser.GameObjectFactory.prototype = {
*/
renderTexture: function (width, height, key, addToCache) {
if (typeof addToCache === 'undefined') { addToCache = false; }
if (typeof key === 'undefined' || key === '') { key = this.game.rnd.uuid(); }
if (typeof addToCache === 'undefined') { addToCache = false; }
var texture = new Phaser.RenderTexture(this.game, width, height, key);
src/loader/Cache.js
+17
View File
@@ -299,6 +299,23 @@ Phaser.Cache.prototype = {
},
/**
* Replaces a set of frameData with a new Phaser.FrameData object.
*
* @method Phaser.Cache#updateFrameData
* @param {string} key - The unique key by which you will reference this object.
* @param {number} frameData - The new FrameData.
*/
updateFrameData: function (key, frameData) {
if (this._images[key])
{
this._images[key].spriteSheet = true;
this._images[key].frameData = frameData;
}
},
/**
* Add a new sound.
*