Center BitmapText

[mariogarranz]

My solution to this was to simply extend Phaser.BitmapText with an anchor point.

 

3 lines of code, problem solved.



I tried to merge this with the official build, but Rich does not want to mix the sprite "anchor" concept, because BitmapText is a group of multiple sprites and that may cause some misunderstanding, and he's probably right. So I use it just for myself, and I'm happy with it

[lucbloom]

My solution to this was to simply extend Phaser.BitmapText with an anchor point.

 

3 lines of code, problem solved.

I tried to merge this with the official build, but Rich does not want to mix the sprite "anchor" concept, because BitmapText is a group of multiple sprites and that may cause some misunderstanding, and he's probably right. So I use it just for myself, and I'm happy with it

 

Regardless of implementation concept, all objects that have a clear width & height should have an anchor point, *especially* when the TTF counterpart *does* have one.

 

If you use it, and I use it, and I've seen other people use it, it's probably u useful feature.

I don't see what there is to confuse? You'd use a property on an object the same way and get the same results for 2 kinds of objects. For me, this is the opposite of confusing. It would be confusing if I'd have to set one property on a TTF object and do something else on a BM font label object to get the same thing.

 

PS: Would you mind positing your solution?

[mariogarranz]

Regardless of implementation concept, all objects that have a clear width & height should have an anchor point, *especially* when the TTF counterpart *does* have one.

 

If you use it, and I use it, and I've seen other people use it, it's probably u useful feature.

I don't see what there is to confuse? You'd use a property on an object the same way and get the same results for 2 kinds of objects. For me, this is the opposite of confusing. It would be confusing if I'd have to set one property on a TTF object and do something else on a BM font label object to get the same thing.

 

PS: Would you mind positing your solution?

Yeah sure, my solution is as simple as this:

 

Phaser.BitmapText.prototype.anchor = new Phaser.Point();Phaser.BitmapText.prototype.update = function(){this.pivot.x = this.anchor.x*this.textWidth;this.pivot.y = this.anchor.y*this.textHeight;};

Just took what we had in Phaser previous to version 2 and added it back, with a very little change in width and height source variables, because they are different in Phaser 2.

So I have this inside a file BitmapText.js that I just include in my games so I can update Phaser without losing this funcionality.

Hope it helps some of you guys

[mariogarranz]

A small update on my previous post.

 

I didn't notice that using 

Phaser.BitmapText.prototype.anchor = new Phaser.Point();

 

would create a single object for the whole prototype. This means that if you change the anchor point of any of your BitmapText objects, you are also changing the anchor point for the rest of them, kind of a "static" variable. I had used this solution before with non-object variables, such as numbers, but because Phaser.Point is an object, every instance of BitmapText will have an anchor value as a refernce to the prototype one, not as an independent value.

I looked for a simple way to solve this, but the simplest solution I could find was to overwrite the own Phaser.js code to add the anchor point there.

If anyone has a better idea on how to do this easy without modifying Phaser source code I would be glad to hear it, because I don't like this approach.

[esteban.guelvenzu]

 

A small update on my previous post.

 

I didn't notice that using 

Phaser.BitmapText.prototype.anchor = new Phaser.Point();

 

would create a single object for the whole prototype. This means that if you change the anchor point of any of your BitmapText objects, you are also changing the anchor point for the rest of them, kind of a "static" variable. I had used this solution before with non-object variables, such as numbers, but because Phaser.Point is an object, every instance of BitmapText will have an anchor value as a refernce to the prototype one, not as an independent value.

I looked for a simple way to solve this, but the simplest solution I could find was to overwrite the own Phaser.js code to add the anchor point there.

If anyone has a better idea on how to do this easy without modifying Phaser source code I would be glad to hear it, because I don't like this approach.

 

 

Mario, I like the way you implemented the anchor, I just added an if:

Phaser.BitmapText.prototype.update = function(){	if (this.anchor != null){		this.updateTransform();		this.pivot.x = this.anchor.x*this.textWidth;		this.pivot.y = this.anchor.y*this.textHeight;	}};

that way if you don't define an anchor, then the pivot is the default one, and the anchor variable belong tho the object, not the class.