Qt on Android layouts all wrong

ProfRivkin

Using Qt 5.2 or 5.3 (Beta) for exactly the same fixed position widgets, laysout all wrong on Android.
The Widgets are crammed together on the left of the screen, overlapping. The font scales up at double the expected size yet the widgets do not.
Why is this?

Xander84

font size (pt) is scaled with the DPI, pixel size not, that happens on all system as far as I know.
My solution: scale everything to the DPI independent size manually..

ProfRivkin

But that defeats the purpose of being cross-platform. it would have the same UI in every environment. I dont have to have 1 UI file for Windows, 1 for Linux, 1 for Android, 1 for Mac an 1 for iOS. That is worthless. There should be a better way.
In any event, how would it ever be DPI independent? Every font is DPI dependent and every widget is DPI independent. Hence a big conflict,

Xander84

No I didn't mean to create separate UI files for each platform.
You can scale all objects and fonts within the same UI to be platform independent, that is at least what I do in my App and it works great.

I use a little different approach in my App but essentially it is like this example in QML (if you don't use QML you can use the QScreen class):
@
import QtQuick 2.2
import QtQuick.Window 2.0

Rectangle {
readonly property real dip: Screen.pixelDensity / (96 / 25.4) // DPI norm in mm

width: 360*dip
height: 360*dip

Text {
    text: "foo bar"
    font.pixelSize: 14*dip
}

}
@
Screen.pixelDensity is in millimeters (mm) and to calculate the DIP-value (device independent pixel) I use a DPI norm (96 DPI on my computer monitor). If you are familiar with Android development something like that is always used in layout files, Andoid uses 160 DPI as a norm and QML has number suffixes so I just multiply every size with the "dip" factor to have the same effect.
In the end this means if you have a 96 DPI screen the size for the Rectangle will be exactly 360 x 360 pixels, but if you have higher DPI values the size in pixels will also increase so the rect will have the same size on all devices and screens.

I hope that gives you some ideas, this is just a simple example but should clarify what I mean?

unless anybody has a better solution for platform independent sizes, I use it like this with QML apps.

ProfRivkin

This is not QML, this is C++ we are talking about. Ie real Qt Applications.
But if I read this correctly (since I never use QML I cant be sure) this is a style sheet information. Since there is no documentation on applicable styles and parameters, your infomation could be helpful, but is dip a defined value in the stylesheet system?
It seems silly to try and re-layout everything in code rather than the design mode of UI files.

Xander84

Yeah sorry I was just assuming nobody uses Qt widget layouts on mobile devices, just my opinion but I think it's a lot easier and faster with QML (among other things).
But this doesn't change the fact, you can do the same with "old" widgets, but not in the designer, only if you create the UI via code because .ui form layouts can't have any code attached as far as I know they are just "static" layouts.
I haven't used widget layouts for some time now, but as far as I remember there is a setupUi method in every controller c++ file (or moc file?) and you can apply the device independent scaling there if you need to.

Actually my code above was just an example in pure QML, in my app I use c++ for that like this (excerpt):
@
...
#if defined(Q_OS_ANDROID)
m_dipNorm = 160;
#elif defined(Q_OS_IOS)
m_dipNorm = 160; // TODO test different sizes
#else
m_dipNorm = 96; // desktop norm
#endif

QScreen *screen = qApp->primaryScreen();
m_dipScaleFactor = screen->physicalDotsPerInch() / screen->devicePixelRatio() / m_dipNorm;
@
So I use the m_dipScaleFactor value to scale essentially all sizes for layouts and margins etc. For font sizes I have another value with an extra font scale factor like android apps use dp or dip for sizes and sp or sip for scaleble font sizes.

I just don't know how to best integrate a dynamic factor into widget forms, maybe you have some ideas for that?

By the way one nice effect of this scaling stuff is that you can zoom the whole layout with this, in my app i can zoom in or out as I please, so the complete app changes size and margins, spacing between elements and font size. also font size can be scaled independently without layout size changes.