Fix too wide text rendering on buttons

[a1exsh]

In German, for example both "Neustart" (Restart) and "Ablehnen" (Decline) don't fit into the button width.

⇒

Ideally, the translation could be improved, but at least it looks less weird when it doesn't fit. :)

🎅 🎁

[ihhub]

Hi @zenseii , does this change correlate with your pull request?

[a1exsh]

@ihhub @zenseii ah, I wasn't aware of existing PRs in this area.

For example, there is at least this further instance in the German translation that doesn't fit nicely:

Do you have it in scope of your changes?

[ihhub]

Hi @a1exsh , let's wait for @zenseii reply. He is the one working on all sorts of buttons at the moment.

[zenseii]

Hi, @a1exsh ! I'm a bit busy these days but will hopefully have time tomorrow to look more into your PR. Currently I have 2 PRs up that solve this problem in a different way in one way by making the actual button backgrounds expand to the necessary width automatically, and in the other PR I'm working on making the button font cram closer when the text width reaches a threshold.

The function to automatically expand buttons is getTextAdaptedButton(), and I'm going to expand the areas where we use them. Currently it's used for places like the campaign screen, well and guilds and maybe other places I'm forgetting about.

Later I need to look into making buttons expand in the vertical direction too for both larger buttons, so that they can increase in both width and height, and for pure horizontal buttons like in the hero screen and high score screen, though the latter is complex due to the non-uniform background of the high score screen.

[ihhub]

Hi @zenseii and @a1exsh , I am actually thinking that we should combine both approaches. We can expand buttons up to certain limits but not exceed them. What do you think?

[zenseii]

Hi @zenseii and @a1exsh , I am actually thinking that we should combine both approaches. We can expand buttons up to certain limits but not exceed them. What do you think?

Yep, that sounds like the best possible approach to have.

[a1exsh]

Hi @zenseii and @a1exsh , I am actually thinking that we should combine both approaches. We can expand buttons up to certain limits but not exceed them. What do you think?

Makes sense. I'd also keep the code for truncation, just in case a translation is updated and doesn't fit once again, as a fallback to avoid the two-line rendering as on the screenshot.

[Districh-ru]

Hi, all!
For the tall buttons (e.g. main menu) if the translated text is taller than the button it will be truncated to one line.
I suggest to add a TODO: Implement text truncating to the specified number of lines.

[a1exsh]

For the tall buttons (e.g. main menu) if the translated text is taller than the button it will be truncated to one line.

That's true. At the same time, the tall buttons have more space and less likely to trigger this. It's a fallback mainly for single-line buttons.
Have you seen a translation that cuts it too short in the main menu or it's theoretical?

[Districh-ru]

That's true. At the same time, the tall buttons have more space and less likely to trigger this. It's a fallback mainly for single-line buttons. Have you seen a translation that cuts it too short in the main menu or it's theoretical?

I have not seen such translations, but theoretically it is possible, so I suggest adding only a TODO comment.

[zenseii]

For the tall buttons (e.g. main menu) if the translated text is taller than the button it will be truncated to one line.

That's true. At the same time, the tall buttons have more space and less likely to trigger this. It's a fallback mainly for single-line buttons. Have you seen a translation that cuts it too short in the main menu or it's theoretical?

The Polish translation has many such issues in the main menu. A typical issue in such areas are the two campaign buttons.

[a1exsh]

For the tall buttons (e.g. main menu) if the translated text is taller than the button it will be truncated to one line.

That's true. At the same time, the tall buttons have more space and less likely to trigger this. It's a fallback mainly for single-line buttons. Have you seen a translation that cuts it too short in the main menu or it's theoretical?

The Polish translation has many such issues in the main menu. A typical issue in such areas are the two campaign buttons.

Ah, indeed. Didn't realize it can go up to 3 lines on the tall buttons, but even that isn't always enough:

Do we address it in your PR or that needs extra effort?

[zenseii]

@a1exsh

Ah, indeed. Didn't realize it can go up to 3 lines on the tall buttons, but even that isn't always enough

Do we address it in your PR or that needs extra effort?

My PR will be just one part of addressing this, but it's not the most important one. Here are the steps for how I currently envision addressing this:

1. Change to StandardWindow object for the New Game menu so that its width can be extended.
2. Extend the width of these buttons according to the text width.
3. Automatically extend the width of the New Game dialog according to the width required by the buttons.
4. Cram the texts' letters closer in case the button width exceeds a threshold that we specify for it. This will make it look more aesthetically pleasing. For reference check the current Spanish Cancel button which should have the letters crammed closer to each other since it is very wide.

The current problem with the New Game menu buttons is the width. In the future I want to have the possibility to automatically resize the height of buttons too, but in this specific case it should be fine because the current possibility of having 3 lines should already be enough.

As for this PR, I believe it serves the purpose of a safeguard in case the translator doesn't check well enough the current button.

[zenseii]

@a1exsh. I've tested how this currently works and as I said it could work as a final measure in case a text doesn't fit. However, I've since addressed all the buttons which currently had too wide texts in languages (that I could find), by updating them to the auto-adjustable buttons.

There is also an issue where this solution cuts text that is shown fully on other buttons, like Kampania here:

Still, as I mentioned before, these buttons will be auto-adjustable too. In fact I have that among my (several) goals for the next release.

One limitation with this PR's solution is that it naturally can't help with auto-adjustable buttons like the ones on the campaign screen:

To solve these my plan is as mentioned to make the letters go closer once the text's width exceeds a certain threshold. Of course, in the meantime it would have been better if a translator could make abbreviations for these strings, since ultimately they have to check if their translations fit within the UI in many other places too, like the creature info dialog.