Recent

Author Topic: caption does not fit in the button  (Read 12055 times)

Hansvb

  • Hero Member
  • *****
  • Posts: 918
caption does not fit in the button
« on: August 11, 2016, 07:21:53 pm »
On my pc the caption on the buttons is just fine. When i run my tool on an other pc with different screen settings (i think) the caption doesnt fit any more. It is to large for the buttons. How to prefent this?

howardpc

  • Hero Member
  • *****
  • Posts: 4144
Re: caption does not fit in the button
« Reply #1 on: August 11, 2016, 07:30:34 pm »
Autosize:=True;

Thaddy

  • Hero Member
  • *****
  • Posts: 19268
  • Glad to be alive.
Re: caption does not fit in the button
« Reply #2 on: August 11, 2016, 07:43:50 pm »
@howardpc:
You mean to give the recipe for disaster ;) This will screw up a carefully aligned user interface.
@hansvb:
Your hunch is right. The other PC has probably a different setting for DPI or the user has opted for a different font size.
Try to design your UI with the DPI settings, font size and localization (if applicable) in mind. That is more work than the above suggestion (autosize:=true) but has a likely chance that your user interface keeps a consistent layout.
For a single button and without using anchors it is more or less ok, but...

Note that DPI/Font settings are usually inherited from the mainform.

« Last Edit: August 11, 2016, 08:01:32 pm by Thaddy »
objects are fine constructs. You can even initialize them with constructors.

FTurtle

  • Sr. Member
  • ****
  • Posts: 292

Thaddy

  • Hero Member
  • *****
  • Posts: 19268
  • Glad to be alive.
Re: caption does not fit in the button
« Reply #4 on: August 11, 2016, 10:18:07 pm »
For reading:

http://wiki.freepascal.org/Autosize_/_Layout
http://wiki.freepascal.org/Anchor_Sides

Yes these wiki entries are insightfull, but still lack explanation of the pitfalls regarding fonts and dpi.
The situation that OP describes indicates that the user either as selected a different system dpi setting or changed the default font size or even fonts system wide or both. Let alone internationalization.
Lazarus respects the system UI settings for e.g. menu, dialogs and caption by default unless set explicitly (imo bad idea, normally: your application will quickly look amateurish and out of place)
Changing the default font size from normal to large in the system UI settings will wreak havoc with your application unless you planned for that .
objects are fine constructs. You can even initialize them with constructors.

lainz

  • Hero Member
  • *****
  • Posts: 4743
  • Web, Desktop & Android developer
    • https://lainz.github.io/
Re: caption does not fit in the button
« Reply #5 on: August 12, 2016, 12:16:20 am »
This article is about DPI:

http://wiki.lazarus.freepascal.org/High_DPI

BTW this article does not cover i18n. Also i'm reading that there are "new" stuff not covered by the article like TCustomForm.DesignTimeDPI and TApplication.LayoutAdjustmentPolicy.
( http://wiki.lazarus.freepascal.org/Autosize_/_Layout#DPI_auto-adjustment_and_absolute_layout_auto-adjustment ).

Is easy to use, the code in the article should be replaced (I say, I've created the article but it's now old).

Just try:

Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormCreate(Sender: TObject);
  2. begin
  3.   //Self.DesignTimeDPI:=120; // Set this only if you designed the form under a different monitor scaling, default is 96
  4.   Self.AutoAdjustLayout(lapAutoAdjustForDPI, Self.DesignTimeDPI, Screen.PixelsPerInch, Self.Width, ScaleX(Self.Width, Self.DesignTimeDPI));
  5. end;

Or to do it for all forms (maybe not recommended because sometimes want to update the width and height and sometimes not, you decide).

The updated HighDPI function now should be:

Code: Pascal  [Select][+][-]
  1. uses
  2.   Forms, Controls, Graphics;
  3.  
  4. procedure HighDPI;
  5. var
  6.   i: integer;
  7. begin
  8.   for i := 0 to Screen.FormCount - 1 do
  9.     Screen.Forms[i].AutoAdjustLayout(lapAutoAdjustForDPI, Screen.Forms[i].DesignTimeDPI, Screen.PixelsPerInch, Screen.Forms[i].Width, ScaleX(Screen.Forms[i].Width, Screen.Forms[i].DesignTimeDPI));
  10. end;

In your LPR:

Code: Pascal  [Select][+][-]
  1. begin
  2.   RequireDerivedFormResource:=True;
  3.   Application.Initialize;
  4.   Application.CreateForm(TForm1, Form1);
  5.   HighDPI; // Call it here below all forms creation
  6.   Application.Run;
  7. end.  

Edit: I've updated the article adding this method.
« Last Edit: August 12, 2016, 12:31:15 am by lainz »

Bart

  • Hero Member
  • *****
  • Posts: 5727
    • Bart en Mariska's Webstek
Re: caption does not fit in the button
« Reply #6 on: August 12, 2016, 04:26:25 pm »
Am I a little confused?
DPI = dots per inch
HighDPI to me would suggest more dots per inch = less inches per dot, so if you draw something with AxB pixels it will be smaller on the screen.
And yet, the discussion is about a Windows setting, where a higher number (in percentage) means larger objects on the screen.  %) %)

Bart

Thaddy

  • Hero Member
  • *****
  • Posts: 19268
  • Glad to be alive.
Re: caption does not fit in the button
« Reply #7 on: August 12, 2016, 04:40:52 pm »
Am I a little confused?
DPI = dots per inch
HighDPI to me would suggest more dots per inch = less inches per dot, so if you draw something with AxB pixels it will be smaller on the screen.
And yet, the discussion is about a Windows setting, where a higher number (in percentage) means larger objects on the screen.  %) %)

Bart
In the case of  e.g. 120 dpi as opposed to 96 dpi or something like that: used with  fontsizes in pixels it is as you'd expect.

Here's a nice write up by both Warren Postma with additions by David Hefferman.
http://stackoverflow.com/questions/8296784/how-do-i-make-my-gui-behave-well-when-windows-font-scaling-is-greater-than-100

Although Lazarus has more features that may help you, the general content of their contribution also hold true for Lazarus.
Also note that fonts are scaled either in pixels or in units. Difference between negative and positive font values. Which again makes a HUGE difference.
« Last Edit: August 12, 2016, 05:15:41 pm by Thaddy »
objects are fine constructs. You can even initialize them with constructors.

Hansvb

  • Hero Member
  • *****
  • Posts: 918
Re: caption does not fit in the button
« Reply #8 on: August 19, 2016, 09:16:25 pm »
I tried the solution from lainz. The captions fit in the buttons because the buttons grow large and don't fit in the panel any more. How tho keept the buttons to the Original size?

lainz

  • Hero Member
  • *****
  • Posts: 4743
  • Web, Desktop & Android developer
    • https://lainz.github.io/
Re: caption does not fit in the button
« Reply #9 on: August 19, 2016, 11:34:18 pm »
I tried the solution from lainz. The captions fit in the buttons because the buttons grow large and don't fit in the panel any more. How tho keept the buttons to the Original size?

That's not the idea. It should grow and the panel too.

Hansvb

  • Hero Member
  • *****
  • Posts: 918
Re: caption does not fit in the button
« Reply #10 on: August 22, 2016, 12:45:41 pm »
I think the panel grows, but next to it there is a DBgrid. The panel align = alLeft. The DBgrid align = alClient. The dbgrid does not move when the panel grows.

Handoko

  • Hero Member
  • *****
  • Posts: 5545
  • My goal: build my own game engine using Lazarus
Re: caption does not fit in the button
« Reply #11 on: August 22, 2016, 01:20:17 pm »
I agree with what Thaddy said. I still remember on my early days learning GUI programming using Lazarus (or perhaps Delphi - not very sure), I found the autosize property. It sounds great, so I enabled autosize on all the visual components. The results? A total mess. So I never use it anymore.

Autosize still can be used I think, if planned carefully and may be combined with anchors and constraints.

The best IMHO, is to try the program on different resolutions. It is very important especially when writing program for other people to use.

Quote
I think the panel grows, but next to it there is a DBgrid. The panel align = alLeft. The DBgrid align = alClient. The dbgrid does not move when the panel grows.

Try anchors.
« Last Edit: August 22, 2016, 01:23:06 pm by Handoko »

Hansvb

  • Hero Member
  • *****
  • Posts: 918
Re: caption does not fit in the button
« Reply #12 on: August 22, 2016, 07:04:24 pm »
When i remove the align and use achors then the panel grows.

I must keep this in mind. For now i have to change to much to make it read able. Next time i must think of this at the start of a program.
 

Handoko

  • Hero Member
  • *****
  • Posts: 5545
  • My goal: build my own game engine using Lazarus
Re: caption does not fit in the button
« Reply #13 on: August 22, 2016, 07:13:01 pm »
Align still has its good use too in some cases. I used it but I forget when should we use it.

Aligns, Anchors, Constraints and (perhaps) Autosize are your best friends if you want to design good UI applications. And yes, we should think of this at the start.

JuhaManninen

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 4715
  • I like bugs.
Re: caption does not fit in the button
« Reply #14 on: August 22, 2016, 07:32:42 pm »
Autosize still can be used I think, if planned carefully and may be combined with anchors and constraints.

Yes, especially anchors. Delphi does not have them, all Lazarus users may not yet know how to use them.
Mostly Lazarus trunk and FPC 3.2 on Manjaro Linux 64-bit.

 

TinyPortal © 2005-2018