Widgets UI different Mac & Windows

SysTech

Hi All,

I'm wondering how people deal with this.

I have a small app developed on Windows using Widgets and I carefully laid out the buttons and fields to ensure it worked.

I got a request from the customer to see if I could make a mac version of the utility. I can compile it and run it but the window/control layouts while roughly the same, things don't fit. For example in windows I have a button that says:

Set LED Intensity

The button is fairly big and has lots of space to either side of the words. I compile for mac and this text doesn't fit in the button.

I'm just wondering how people handle this? Do you have different layouts somehow for each OS? Or do you do a bunch of #ifdefs in code and reset style sheets based on OS? What is the best way?

Charby

I think it really depends of your project needs, but Qt offers a wide range of solution :

one can use QWidget with native style if it is requested to keep a native look and feel for desktop application
or QML for modern UI for desktop and mobile when it is requested to have a unique UI along every OS - or QML using QtQuick.Controls with styling to try to mimic native (at least for desktop)
or even Canvas, or Qt3D...

If you haven't seen it already, have a look to this great presentation from Milian Wolff during the last CPP conference showing how Qt supports modern UI.

SGaist

Hi,

To add to @Charby, how did you do the layout of your UI ? By hand or using layouts ?

SysTech

@SGaist

I did this simple program by hand. I do realize layouts would help but the interesting point is that text doesn't fit where it used to fit under windows. Perhaps layouts fix that?

SysTech

@Charby

Thank you sir! I will check out the presentation.

I have mainly used Widget and have not ventured yet into QML but perhaps it is time to learn.

Thanks!

SGaist

Each platform has it's own font and font size recommendation. If you have the sizes of every button by hand, you can expect some things to be wrong from one platform to the other.