Qt Quick Controls 2 Scaling

Question

I'm developing the application that should run on the mobile and desktop platforms. The problem that I found that sizes of controls is vary on different screens: in high density screens controls is too small and in low density screens is rather big.

I can calculate the scale factor for each screen (ie use Android's Density-independent Pixels) and use it to define item sizes, margins, etc in dp :

ApplicationWindow {
    ...
    property real dp: Screen.pixelDensity * 10 * 2.54 / 160
    Item {
        width: 50*dp
        height: 50*dp
        ...
        Label {
            font.pixelSize: 16*dp
            ...
        }
    }
}

It work well but it seems that sizes of standard controls in Qt Quick Controls 2 is defined in pixels, so they doesn't scale. The only way that I see is to redefine all controls in Qt Quick Controls 2 using dp instead of pixels.

So I'm looking for method to scale standard controls without redefining them all.

UPD1. I've tried High-DPI Support, it makes situation better but still there is some issue. Here is some some parameters of primary screen ( see paramter description here ) from different devices before and after applying High-DPI Support:

// samsung tab t-280 without high dpi support
devicePixelRatio 1
geometry QRect(0,0 800x1280)
logicalDotsPerInch 95.85
physicalDotsPerInch 216.458
physicalSize QSizeF(94, 150) (7')

// samsung tab t-280 with high dpi support
devicePixelRatio 1.33125
geometry QRect(0,0 601x962)
logicalDotsPerInch 72
physicalDotsPerInch 162.648
physicalSize QSizeF(94, 150) (7')


// xiaomi redmi 2 without high dpi support
devicePixelRatio 1
geometry QRect(0,0 720x1280)
logicalDotsPerInch 144
physicalDotsPerInch 315.48
physicalSize QSizeF(58, 103) (4.6')

// xiaomi redmi 2 with high dpi support
devicePixelRatio 2
geometry QRect(0,0 360x640)
logicalDotsPerInch 72
physicalDotsPerInch 157.74
physicalSize QSizeF(58, 103) (4.6')


// macbook pro retina 13' without high dpi support
devicePixelRatio 2
geometry QRect(0,0 1280x800)
logicalDotsPerInch 72
physicalDotsPerInch 113.5
physicalSize QSizeF(286.449, 179.031) (13')

// macbook pro retina 13' with high dpi support
devicePixelRatio 2
geometry QRect(0,0 1280x800)
logicalDotsPerInch 72
physicalDotsPerInch 113.5
physicalSize QSizeF(286.449, 179.031) (13')


// generic 20' display without high dpi support
devicePixelRatio 1
geometry QRect(0,0 1280x1024)
logicalDotsPerInch 72
physicalDotsPerInch 72
physicalSize QSizeF(451.556, 361.244) (22.6')

// generic 20' display with high dpi support
devicePixelRatio 1
geometry QRect(0,0 1280x1024)
logicalDotsPerInch 72
physicalDotsPerInch 72
physicalSize QSizeF(451.556, 361.244) (22.6')


// asus zenbook 13' without high dpi support
devicePixelRatio 1
geometry QRect(0,0 1366x768)
logicalDotsPerInch 96
physicalDotsPerInch 71.9833
physicalSize QSizeF(482, 271) (21.6'!)

// asus zenbook 13' with high dpi support
devicePixelRatio 1
geometry QRect(0,0 1366x768)
logicalDotsPerInch 96
physicalDotsPerInch 71.9833
physicalSize QSizeF(482, 271) (21.6'!)

It seems that situation becomes better for some Hight-DPI displays (Samsung tablet and Xiaomi Phone). DPI of both devices become near 160 after High-DPI support applying.

But DPI of Retina display and low-density displays doesn't change and items on the screen looks bigger than it should be. So it solves only half of original problem. Maybe somebody knows how to manually set scale factor for all Qt application at runtime?

Answer 1

Seems like since Qt version 5.6 there might be a better solution for platform idependant scaling.

High-DPI Support in Qt Quick Controls 2 https://doc.qt.io/qt-5/qtquickcontrols2-highdpi.html

I hope that helps.

Answer 2

I had the same problem and found the answer from jpnurmi most helpful: add

qputenv("QT_SCALE_FACTOR", "3"); 

in main() before creating the application instance. A factor of 0.75 worked very well for me for Retina displays, where the controls were actually too big.