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 (i.e. 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?

I asked that myself years ago and in the end I used a similar approach then yours with custom dip and sip calculations... I still dont think there ist any standard for it build in Qt or QML — Xander
So you redefine all Qt Quick Controls 2 items using dip and sip? Or you don't use Qt Quick Controls 2 at all? — Kamil Zaripov
Well essentially yes, I use dp whenever I define size or position of visual QML items and sp with font size. It sounds stupid, but it works and ist easy zu implement. But I used a global C++ class and registered that as the QML context object. If you want I can post that class as an answer, since it is in my private repository. — Xander
I think that you don't understand the issue. I also use dp (dip) and sp (sip) to define item sizes and font sizes and I don't see any problem with it. Issue connected with Qt Quick Controls 2 Items such as ComboBox or Button. Sizes of this Items is defined in pixels. You can see it here. So they don't scale display from display. And this is the issue. — Kamil Zaripov
In order to set a specific scale factor by hand, try for example qputenv("QT_SCALE_FACTOR", "3"); in main() before creating the application instance. — jpnurmi

Xander Xander · Accepted Answer · 2017-02-08T15:21:31

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.

Qt Quick Controls 2 Scaling

2 Answers