The International Simutrans Forum

Development => Extension Requests => Topic started by: Václav on May 13, 2013, 03:39:16 PM

Title: Button width based on text length
Post by: Václav on May 13, 2013, 03:39:16 PM
I found (and may be I am not alone) that in some languages, texts of some buttons are longer than is width of button. And translations of some buttons may be a bit problematic because finding of most suitable translation (with good length) is almost impossible.

I think this would be corrected but I don't know if C++ has utilities to do that - take (part of) image and re-draw it in width computed from text's length ... and add else image to front and rear of text part, if needed.
Title: Re: Button width based on text length
Post by: An_dz on May 13, 2013, 04:16:51 PM
That's not much of the problem, this certainly can be coded, the problem is consistency. If you enlarge a button the whole window may need to be realigned and/or tweaked. Having multiple buttons with different widths looks horrible and unprofessional too so all buttons need width equal the biggest one.

The only viable way seems to find where most language have difficulty and enlarge in these key areas.
Title: Re: Button width based on text length
Post by: Václav on May 13, 2013, 07:50:17 PM
Don't forget that some buttons may be very short in this way - while there should be some margin between text and both ends of button. So full length of buttons could be the same or lesser. And I think that this situation is similar in most languages. But I am not sure.

I am only worried about that result may be similar to attached images. You can see that difference between text lengths is negligible - but margin between text and ends is much greater in case of the second one.
Title: Re: Button width based on text length
Post by: An_dz on May 13, 2013, 10:42:38 PM
Simutrans code already centralize text in buttons.
Title: Re: Button width based on text length
Post by: Václav on May 14, 2013, 01:03:54 PM
Oh, no.

Text in those two images is centered.
I spoke about margin between text and left and right side of image, itself.

But on the second one it is not visible due to transparent underground.

What I spoke is that if you would have text with ten letters (for example), that margin will be wide of one letter.
MxxxxxxxxxxM
but if you would have text with twelve letters, margin will be wide of two letters.
MMxxxxxxxxxxxxMM

... and so on ...
Title: Re: Button width based on text length
Post by: Max-Max on May 29, 2013, 03:54:51 PM
I have noticed a similar "problem" when it comes to resizeable GUI.
My plan is to add the possibility to have the text truncated if it overflows, like Windows does.

[ This is a button ]

if we make the button, label or whatever boundary we use, smaller we will have

[ This is a ] button <--- overflowing

My plan is to display it like

[ This is... ] and have the tooltip to display the full text (together with the original tooltip)

Would this solution work for you?
Title: Re: Button width based on text length
Post by: Fabio on May 30, 2013, 04:58:44 PM
nice idea.
a new line char \n should trigger truncation and be used to show tooltips anyway.
Title: Re: Button width based on text length
Post by: prissi on May 30, 2013, 08:41:09 PM
Sorry Fabio, you are too short for me. Please elaborate a little further. The actual idea was, if the text does not fit, to show a truncated text with a tooltip.
Title: Re: Button width based on text length
Post by: Fabio on May 30, 2013, 10:14:36 PM
Quote from: prissi on May 30, 2013, 08:41:09 PM
Sorry Fabio, you are too short for me.
I hate writing with my smartphone ;)

Quote from: prissi on May 30, 2013, 08:41:09 PM
Please elaborate a little further. The actual idea was, if the text does not fit, to show a truncated text with a tooltip.
So far I got it, and I like it.
What I suggested is a further exploit in order to create tooltips for buttons.
This could be achieved with translation. Translating a button text, you could use a new line char (\n) in order to force truncation.

E.g.
[ This is a  ] button <--- overflowing
[ This is... ] ---> "This is a button" tooltip
Exploit:
[ Start      ] <--- NOT overflowing
                    Translation: "Start\n selected vehicle"
[ Start...   ] ---> "Start selected vehicle" tooltip
Title: Re: Button width based on text length
Post by: Max-Max on August 03, 2013, 12:57:02 AM
The truncation has been Implemented and committed to the trunk. I have not done anything with the tooltip yet.
Title: Re: Button width based on text length
Post by: captain crunch on August 03, 2013, 01:40:40 AM
Quote from: Max-Max on August 03, 2013, 12:57:02 AM
The truncation has been Implemented and committed to the trunk.
What to do about these new features? (These dialogs are from pak64, but it looks similar in pak64.german f.e.)
Title: Re: Button width based on text length
Post by: kierongreen on August 03, 2013, 01:52:10 AM
There's quite a few others as well - I think it's just a little too sensitive
Title: Re: Button width based on text length
Post by: Ters on August 03, 2013, 08:30:41 AM
There might be a lot of labels that don't have the correct width, since they just overflowed anyway.
Title: Re: Button width based on text length
Post by: Max-Max on August 04, 2013, 01:37:56 PM
The cap function is implemented but I haven't adjusted all dialogues yet.
Picture #1 This is because the label size hasn't been adjusted. Before, the labels size didn't matter and the text Was Overflowing.

Picture #2, this isn't a label, It is direct drawn.It will be moved to a multiline label.
Title: Re: Button width based on text length
Post by: Fabio on August 04, 2013, 02:42:27 PM
with new GUI, couldn't labels with text exceeding length be extended to next line scaling up the dialog height?
Title: Re: Button width based on text length
Post by: Ters on August 04, 2013, 04:22:07 PM
Quote from: Fabio on August 04, 2013, 02:42:27 PM
[...] scaling up the dialog height?

Scaling the dialog itself is relatively easy, but how everything else should adjust is not trivial. I think it's the single most difficult thing to deal with when making GUIs (in general, not just related to Simutrans).
Title: Re: Button width based on text length
Post by: Max-Max on August 04, 2013, 07:19:49 PM
A label is a single line.
A flow text Control is doing precisely this, a fixed width and a dynamic height.
With use of panels (container) We can easily Constrain and arrange the layout the way we want.
Title: Re: Button width based on text length
Post by: Ters on August 04, 2013, 07:33:32 PM
Quote from: Max-Max on August 04, 2013, 07:19:49 PM
With use of panels (container) We can easily Constrain and arrange the layout the way we want.

If you pull that off, you deserve an award. I've never used a GUI system that allows me to create all the layouts I want, not even non-easily. And I don't think my desired layouts are unconventional either.
Title: Re: Button width based on text length
Post by: Max-Max on August 06, 2013, 06:34:35 PM
I have fixed the signal space dialogue. The depot isn't my fault ;)
Is there some other places where we see some odd truncated text (text ending oddly in ...)
Title: Re: Button width based on text length
Post by: kierongreen on August 06, 2013, 07:12:20 PM
Landscape settings on create a new game dialogue - also I've noticed the FPS counter sometimes (but not always) being truncated.
Title: Re: Button width based on text length
Post by: TurfIt on August 07, 2013, 09:17:19 PM
Quote from: Max-Max on August 06, 2013, 06:34:35 PM
The depot isn't my fault ;)

If you move stuff up a line (r6606) into the space reserved for other text, and it subsequently overlaps, then sorry, but it is your fault. Second column moved back down r6636.
As for all the overlapping/misaligned widget icons, missing scrollbar, etc., etc. - I trust fixing these are your priority?
Title: Re: Button width based on text length
Post by: Max-Max on August 07, 2013, 10:16:59 PM
A picture says more than 1000 words...
I have no idea what you are talking about, can you please post a picture showing the problems?

I compared 112.3 with my latest local theme copy and I noticed:
A bar is missing under the convoy images (I don't know what you call it).
At the very bottom I see what you mean when I compare the two versions.

But, misaligned widgets?!? Missing scrollbar?!? Where?!?

Quoteetc., etc.
It is a lot easier if you tell me what other things you mean.