Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Centering text on a rectangle not working  (Read 6272 times)

0 Members and 1 Guest are viewing this topic.

smguyk

  • Jr. Member
  • **
  • Posts: 79
    • View Profile
Centering text on a rectangle not working
« on: May 07, 2014, 04:55:18 pm »
I have an sf::RectangleShape inputFieldRect_ and an sf::Text inputFieldText_ and I want to center the text on the rectangle because the sf::Text's dimensions will vary because its string will have different lengths.

After setting inputFieldText_'s string with inputFieldText_.setString(s); (s is a an std::string that the user inputs) I am adjusting its position so that it's still in the center of inputFieldRect_.

This is my code for that but the text is too much to the left and a little too much to the bottom, so not perfectly centered:

sf::FloatRect rectBounds = inputFieldRect_.getGlobalBounds();
sf::FloatRect textBounds = inputFieldText_.getGlobalBounds();

inputFieldText_.setPosition(
  rectBounds.left + (rectBounds.width / 2) - (textBounds.width / 2),
  rectBounds.top + (rectBounds.height / 2) - (textBounds.height / 2)
);

Can someone please help me? I don't see the flaw.

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6286
  • Thor Developer
    • View Profile
    • Bromeon
Re: Centering text on a rectangle not working
« Reply #1 on: May 07, 2014, 05:21:20 pm »
Are you sure the bounding rects are what you expect them to be? For the text, you could draw a sf::RectangleShape that only visualizes the bounds to verify that.

And you don't change the origin somewhere?
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

G.

  • Hero Member
  • *****
  • Posts: 1592
    • View Profile
Re: Centering text on a rectangle not working
« Reply #2 on: May 07, 2014, 05:21:57 pm »
sf::Text localBounds left and top are not 0 and you might need to take that into account.

smguyk

  • Jr. Member
  • **
  • Posts: 79
    • View Profile
Re: Centering text on a rectangle not working
« Reply #3 on: May 07, 2014, 06:12:57 pm »
I don't change the origin anywhere.

I followed your advice and drew a red rectangle around the text, and took some screenshots to demonstrate it.
Ignore the white background, it's because I took a screenshot and cut out the relevant part (teal rectangle + black text).

This is right after I've created the rect and text:


The position hasn't been adjusted yet, but you can already see that the rect's right bounds are bigger than the actual font.

This is when I enter the first letter:


You can see for some reason the rect stays at its original position even though I've updated it.

This is when I enter another letter:


The rect finally moves, but its and the text's positions do not match.

This is after entering some more stuff:


Just like in the picture above, the bounding box is out of place.

I tried using different fonts, but they all have the problem of having weird bounding boxes...

Edit:

When I just change the string but not the text's position, the bounding box is like this:



It still has this gap on the right, but besides that it's perfect.
« Last Edit: May 07, 2014, 06:21:27 pm by smguyk »

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6286
  • Thor Developer
    • View Profile
    • Bromeon
Re: Centering text on a rectangle not working
« Reply #4 on: May 07, 2014, 06:24:47 pm »
Can you try with the latest revision from the GitHub master branch?

In case the problem persists, please show a minimal code example that draws the text and its bounds and shows this issue.

« Last Edit: May 07, 2014, 06:27:35 pm by Nexus »
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

smguyk

  • Jr. Member
  • **
  • Posts: 79
    • View Profile
Re: Centering text on a rectangle not working
« Reply #5 on: May 07, 2014, 06:40:03 pm »
Okay, but I'll have to comiple SFML tomorrow because I've never done it before and I suppose it's going to take some time

dabbertorres

  • Hero Member
  • *****
  • Posts: 506
    • View Profile
    • website/blog
Re: Centering text on a rectangle not working
« Reply #6 on: May 07, 2014, 09:25:54 pm »
It really doesn't take more than 5 minutes. You just need cmake!

smguyk

  • Jr. Member
  • **
  • Posts: 79
    • View Profile
Re: Centering text on a rectangle not working
« Reply #7 on: May 08, 2014, 12:41:49 pm »
Compiling doesn't work...

Nevermind then but thanks anyway

astr0wiz

  • Newbie
  • *
  • Posts: 4
    • View Profile
    • Email
Re: Centering text on a rectangle not working
« Reply #8 on: June 19, 2014, 03:10:50 pm »
Regarding the odd positioning of the bounding box, sample code would help a lot.  For the space on the right of the letters in the font, that is to be expected.

Fonts(well, most) are built with spacing on either side of the glyphs.  This is how we get little spaces between letters on the screen.  Font designers recommend spacing on the right, but one may build a font with spacing on the left, both left and right, or none at all.

So, if you really want a centered bit of text, you will need to make allowances for the inherent spacing.

jlomaka

  • Newbie
  • *
  • Posts: 1
    • View Profile
Re: Centering text on a rectangle not working
« Reply #9 on: November 06, 2020, 11:08:59 am »
In my case help this slightly modified solution, i just change this (textBounds.height / 2) to this textBounds.height

Code: [Select]
sf::FloatRect rectBounds = inputFieldRect_.getGlobalBounds();
sf::FloatRect textBounds = inputFieldText_.getGlobalBounds();

inputFieldText_.setPosition(
  rectBounds.left + (rectBounds.width / 2) - (textBounds.width / 2),
  rectBounds.top + (rectBounds.height / 2) - textBounds.height
);