How do I get the correct text height?

0 favourites
  • 12 posts
From the Asset Store
Change delay, create new lines, "backspace" the text
  • Hello!

    I have issues getting the correct text height.

    The result is that letters like g, j, q, y are cut and that the text is not centered correctly inside the buttons.

    Is it true that the height of letters like g, j, q, y, which pass the imaginary bottom y-line of the letters (red line), are not correctly calculated? It seems to me that Text.TextHeight is only calculated from that imaginary line to the top (red arrows).

    It's a bit hard to describe what I mean so I tried to skatch it. How can I calculate the pixel height between the violet arrows?

    This is the function that I'm using to create buttons.

  • textheight does give you the full height - from top to the bottom of those letters you mentioned.

    the problem you are having is that you can not calculate textheight with a text object in the same tick that you create it. (well, that is what my testing turned up - but I don't remember if I tried calculating textheight in the next top level event, which might work)

    what I ended up doing was placing a global, invisible text object off screen on the first layout so that there is an instance available that already exists, and use that to calculate textwidth and textheight for the buttons I make.

  • Thank you that's a good idea to pre-place a hidden text object. I will test that out.

  • Measuring text immediately should work in the C3 runtime. The workaround where you had to wait a tick was something that only needed to be done in the old C2 runtime.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads
  • very interesting... I am working on a project that did start in C2, but I moved it to C3 and it is using the C3 runtime. I was sure it was still requiring a tick before I could get textwidth or textheight, but I just tested it and it does work as Ashley said.

  • Ahh. Good to know. But how comes that letters like g j q y get cut in the bottom part when I set the Text objects size to "Text.TextWidth, Text.TextHeight"?

    I know I could just put Text.TextHeight+20 or something like that but I wanted to have a scalable system.

  • I did a test and it worked fine for me... I would have to see your project to look for a problem.

  • It's basically just the part in the second picture. But I uploaded a dumbed down version of the project where the issue still persists.

    drive.google.com/file/d/1tu3wghFCFtbmjTKpAjwt4I-Q2WwG8gL7/view

  • ok, after a lot of testing, there is definitely a bug. I was about to make a bug report when I saw one from yesterday that helped me further pin point what is happening...

    When the Text object has BBcode enabled, the text in the object gets shifted down. It does report the correct text height, but since the text is shifted down, it gets cut off in your case.

    So, until Ashley fixes the bug, you can turn off BBcode for your Text object and it will align the way you expect.

  • Thank you so much for your time and efforts!

    Okay I will do that. Is there a way how I can disable BBcode from within the events? I didn't find it yet.

    Edit: For now I achieved this by placing a Text object in the editor on the layer with BBcode disabled which gets destroyed on startup.

    And it works! Awesome. :D

  • For the record, setting the text size to TextWidth/TextHeight isn't necessarily going to fit the complete text in. Text metrics are actually super complicated. You have all sorts of different baselines (e.g. hanging, middle, alphabetic, ideographic...), different languages extend different distances above and below the line, certain unicode combinations can extend indefinitely in an upwards or downwards direction (e.g. z̻̗͜a̦̥̱͖̝͓͉l̡̤͕̟̝̟̻g͎̹o̡̫̲ text), and so on and on.

    So when you say "how tall is the text?" it's not actually particular clear what you are measuring. Which baselines are you going from? Does it include all ascenders and descenders? Do you want it to keep extending with things like zalgo text? How do you make sure it never cuts off any of the text with any possible combination of text, font and languages?

    This is compounded by the fact the web platform currently doesn't expose all the text metrics we need to answer all of these questions (as noted in this old issue about vertical text alignment).

    This issue appears to refer to BBcode altering the text size not being taken in to account in the calculated text height, which is a different type of problem - but even if that's fixed, it still won't mean that setting the text size to TextWidth/TextHeight allows all the text to be visible, because of everything I just mentioned. Basically you just have to add some padding - but unfortunately at the moment there's no way to know how much padding is needed exactly, and it's different depending on the text/font/languages you want to cover. So, you'll just have to guess...

  • Okay I see the problem now. It is way more complicated than I thought. The same goes for italic font. Some letters will be cut off at the end.

    So I guess it is never a good idea to set the text objects size exactly to the text size.

    Perhaps instead of guessing I could use some sort of percentage "buffer zone" around the text. That way it would be scalable.

    For now I will use something like

    Text: Set size to (Self.TextWidth+Self.TextWidth÷10, Self.TextHeight+Self.TextHeight÷10)

    which will make the actual size 10% larger.

    Thanks Ashley for the explanation!

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