Jump to content

Text Metrics before rendering


Recommended Posts


I was wondering if there is a Pixi way to get the text metrics for a string before having to render it.  It looks like one has to do updateText() to get the width to be correct but doesn't this render?

Also, I looked at the PIXI.Text.prototype.updateText() method in the v2.0 pixi and it does the call to the canvas measureText().width to get the width after it sets the font into the context but before the styles are applied.  Is this ok or should the measureText() call come after the styles are applied to the context.  

Also, I see this.context.font set twice, once at the top of the method and then later after the test for isCocoonJS.  Is this correct?




Link to comment
Share on other sites


Personally, I am retreiving the context indeed, and get the metrics from there every time i update any text option that could affect its dimension (text itself, strokek thickness, ...).

Note: I have a some kind of GameObject wrapper, around any pixi object (DisplayObjectContainer, since it's the main parent of the pixi object structure) btw, as an abstraction layer for my games.

Example (ugly an not optimized):

var gameObjectText = new GameObject ("testText"),    pixiObjectContainer =gameObject.getPixiContainer();gameObject.size.width = pixiObjectContainer.context.measureText(pixiObjectContainer.text).width;gameObject.size.height = pixiObjectContainer.context.measureText(pixiObjectContainer.text).height;

I don't know if this is what you are looking for, but with this you are able to get the dimensions of the html5/canvas text before PIXI actually updates the width/height properties of the PIXI.Text object.

The problem i have now though, is that it seems not to retrieve the right amount of pixels, cause i am trying with this, to align a "one line text" (and PIXI doesn't allow it) but the positioning is always incorrect...

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...