How do I set the text position to be the same in all browser

0 favourites
  • 2 posts
From the Asset Store
This is a single chapter from the Construct Starter Kit Collection and the Student Workbook from the Workshop.
  • Is there a way to set a text object to be in the exact same position in all browsers? I'm trying to center a text object in a circle, and when testing in different browsers, namely chrome and safari, the text is moving.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Hey Minjaware,

    It sounds like you might be using the standard Text object. If so, that might be the issue.

    Sprite Fonts vs Standard Text

    If you use a Sprite Text object instead of standard Text object you should be able to get exactly the same result across all browsers. By contrast, the standard text object may not always get rendered as the same font from browser to browser, much less be rendered in exactly the same position.

    The unpredictability of font rendering across browsers is not a bug in C2, as far as I know, but is just a side effect of different browsers all using their own method for rendering text.

    By using a sprite font, you guarantee that C2 is directly responsible for rendering the text, directly from bitmap images, and so it will appear consistent everywhere.

    Using Sprite Fonts

    While it is a bit less convenient to work with Sprite Fonts, there are a few community made tools that make using them much easier.

    Sprite Font Generator - v2

    Sprite Font Generator is a freeware stand-alone font to sprite font conversion tool. It also generates all the JSON code needed by C2 to space and size sprite font characters, and it has a graphical interface.

    Sprite font +

    Sprite font + is a plugin for C2 that can take the JSON code for sprite fonts as a parameter, and will display (in the editor) the correctly sized and spaced character as they will appear at runtime.

    Tutorial, for Sprite font +

    Tutorial showing how to use "Sprite Font Generator" with "Sprite font +"

    Hope this helps out.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)