Change gadget sizes between different OS doesn't work on Mac

Mac OSX specific forum
User avatar
fsw
Addict
Addict
Posts: 1572
Joined: Tue Apr 29, 2003 9:18 pm
Location: North by Northwest

Change gadget sizes between different OS doesn't work on Mac

Post by fsw »

Hi,
I adapt the window/gadget sizes between different OS (Linux, MacOS, Windows) to their respective font sizes.
The way I do that is to measure the width and height of the GUI font like this:

Code: Select all

      StartDrawing(CanvasOutput(CanvasGadget(#PB_Any, 0, 0, 0, 0)))
        FontWidth = TextWidth("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789~!@#$%^&*()_+[]\{}|;:,./<>?'")
        FontHeight = TextHeight("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789~!@#$%^&*()_+[]\{}|;:,./<>?'")
      StopDrawing()
The results of the standards fonts with the code above:
On Linux (ManjaroBox) the reported width is 897, the height is 19.
On MacOS (Mavericks) the reported width is 578, the height is 15.
On Windows 7 the reported width is 677, the height is 16.

Depending on the original OS (font size) a resize factor is calculated.
(WidthFactor = TextWidth / TextWidthOfOriginalOsWhereTheGuiWasDesigned)
The positions of the gadgets and the width/height of the windows/gadgets are multiplied by the factor.
(all gadgets are treated the same)

It works fabulous between Linux and Windows, but on MacOS it's really bad because the width/height of the gadgets do not match the width/height that is set.

On MacOS:
The gadgets are not wide enough to fit the text.
Anyhow, to get it somewhat OK on MacOS I have to multiply the calculated factor by 1.5 which seems odd.
However, the ComboBoxGadget height is smaller than the set height and the StringGadget height is too big (bigger than buttons with the same set height). The panel has also some issues and I assume other gadgets as well. Didn't look at all gadgets...


IMHO the gadgets that look the most homogenuous along the board are the ones on Linux drawn by GTK3 (which is a real surprise for me), even though the original OS - where the GUI was designed - was Windows 7.
(Windows 7 looks OK as well)

Why are the gadgets on MacOS so crooked?
Is my solution OK?
Or is there is a better way to fix it?

Interestingly when the built-in XML gui commands of PureBasic are used to draw gadgets, the gadgets seem to fit the font nicely; what library is used there?
Maybe the best way to fix differences between OS font sizes is to use the built-in XML gui commands of PureBasic, but drawing busy user interfaces is very cumbersome and error prone.

I am to provide the public with beneficial shocks.
Alfred Hitshock
wilbert
PureBasic Expert
PureBasic Expert
Posts: 3870
Joined: Sun Aug 08, 2004 5:21 am
Location: Netherlands

Re: Change gadget sizes between different OS doesn't work on

Post by wilbert »

For some gadgets you could do it like this ...

Code: Select all

If OpenWindow(0, 0, 0, 222, 200, "", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ButtonGadget(0, 10, 10, 20, 20, "This won't fit")
  CocoaMessage(0, GadgetID(0), "sizeToFit")
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf
With your current solution, maybe embedding a font and using the same font on all OS might help.
Windows (x64)
Raspberry Pi OS (Arm64)
User avatar
fsw
Addict
Addict
Posts: 1572
Joined: Tue Apr 29, 2003 9:18 pm
Location: North by Northwest

Re: Change gadget sizes between different OS doesn't work on

Post by fsw »

Hello Wilbert,
thank you for your suggestion.
wilbert wrote:For some gadgets you could do it like this ...
I think I know what you mean.

On a ComboBox I would have to do this:

Code: Select all

If OpenWindow(0, 0, 0, 222, 200, "", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ComboBoxGadget(0, 10, 10, 1, 1)
  ; add all needed gadget items and then:
  AddGadgetItem(0, 1, "This won't fit")
  AddGadgetItem(0, 2, "This fits")
  SetGadgetState(0, 0)  ; set the widest text
  CocoaMessage(0, GadgetID(0), "sizeToFit") ; size to fit
  SetGadgetState(0, -1) ; reset the combobox to "no text"
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf
This seems to work with ComboBoxes.

wilbert wrote:With your current solution, maybe embedding a font and using the same font on all OS might help.
I've never done this and can imagine that if the font looks alien to the "other" OS it will look very odd.


Thanks again for your "sizeToFit" suggestion, will explore further.

BTW: It's just odd to me that on MacOS the reported text width is sooo wrong...

I am to provide the public with beneficial shocks.
Alfred Hitshock
User avatar
fsw
Addict
Addict
Posts: 1572
Joined: Tue Apr 29, 2003 9:18 pm
Location: North by Northwest

Re: Change gadget sizes between different OS doesn't work on

Post by fsw »

Did some tests with "sizeToFit".
The idea behind "sizeToFit" seems OK but only on first look.

If "sizeToFit" is used:
Buttons that are on the same row will have different width, because of different text width.
If the text widths of the buttons are too different, the user interface will look very... unprofessional.

I am to provide the public with beneficial shocks.
Alfred Hitshock
User avatar
Danilo
Addict
Addict
Posts: 3037
Joined: Sat Apr 26, 2003 8:26 am
Location: Planet Earth

Re: Change gadget sizes between different OS doesn't work on

Post by Danilo »

fsw wrote:If "sizeToFit" is used:
Buttons that are on the same row will have different width, because of different text width.
If the text widths of the buttons are too different, the user interface will look very... unprofessional.
What about resizing all buttons to the largest required width, if you want it all the same size?

Code: Select all

If OpenWindow(0, 0, 0, 222, 200, "", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ButtonGadget(0,0,0,1,1,"Button 1")
  ButtonGadget(1,0,0,1,1,"Button 2 here")
  ButtonGadget(2,0,0,1,1,"Button 3")
  
  requiredWidth = 0
  For i = 0 To 2
      btnWidth = GadgetWidth(i,#PB_Gadget_RequiredSize)
      If btnWidth > requiredWidth
          requiredWidth = btnWidth
      EndIf
  Next
  For i = 0 To 2
      ResizeGadget(i,requiredWidth*i,0,requiredWidth,25)
  Next
  ResizeWindow(0,#PB_Ignore,#PB_Ignore,requiredWidth*3,#PB_Ignore)
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf
You need a layout manager to handle this automatically.
davido
Addict
Addict
Posts: 1890
Joined: Fri Nov 09, 2012 11:04 pm
Location: Uttoxeter, UK

Re: Change gadget sizes between different OS doesn't work on

Post by davido »

@fsw,

Did you try the Dialog library. This seems to work quite well, for me.
DE AA EB
User avatar
fsw
Addict
Addict
Posts: 1572
Joined: Tue Apr 29, 2003 9:18 pm
Location: North by Northwest

Re: Change gadget sizes between different OS doesn't work on

Post by fsw »

Danilo wrote:What about resizing all buttons to the largest required width, if you want it all the same size?

Code: Select all

If OpenWindow(0, 0, 0, 222, 200, "", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  ButtonGadget(0,0,0,1,1,"Button 1")
  ButtonGadget(1,0,0,1,1,"Button 2 here")
  ButtonGadget(2,0,0,1,1,"Button 3")
  
  requiredWidth = 0
  For i = 0 To 2
      btnWidth = GadgetWidth(i,#PB_Gadget_RequiredSize)
      If btnWidth > requiredWidth
          requiredWidth = btnWidth
      EndIf
  Next
  For i = 0 To 2
      ResizeGadget(i,requiredWidth*i,0,requiredWidth,25)
  Next
  ResizeWindow(0,#PB_Ignore,#PB_Ignore,requiredWidth*3,#PB_Ignore)
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf
You need a layout manager to handle this automatically.
That's a good idea Danilo.
Implementing it into my GUI library should be easy.

Thank you for your help.

I am to provide the public with beneficial shocks.
Alfred Hitshock
User avatar
fsw
Addict
Addict
Posts: 1572
Joined: Tue Apr 29, 2003 9:18 pm
Location: North by Northwest

Re: Change gadget sizes between different OS doesn't work on

Post by fsw »

davido wrote:@fsw,

Did you try the Dialog library. This seems to work quite well, for me.
Yes I did, thank you for your input.

Here my thought on doing this with Dialogs:
fsw wrote: Maybe the best way to fix differences between OS font sizes is to use the built-in XML gui commands of PureBasic, but drawing busy user interfaces is very cumbersome and error prone.
The current project has 45 different gadgets residing on a PanelItem beautified by frames and stuff and on window resize all are kept on a proper position with ListIconGadgets changing their size so they can show even more data.

Question to self:
Should I look into changing my GUI library to use the dialogs?


Thank you all for your inputs.
These are all very good suggestions.

I am to provide the public with beneficial shocks.
Alfred Hitshock
Post Reply