Resolution Independence (Qt, Android, iOS, BB10)

April 12, 2016 — Leave a comment

Qt High DPI

Since Qt 5.6 HighDPI is supported for all platforms. All details here:

Read more about Qt 5.6+ scalability:

Also new Qt Quick 2 Controls (qt.labs.controls in Qt 5.6) support High DPI :

Enable High DPI Support

To enable High DPI Support you must enable Qt::AA_EnableHighDpiScaling :

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
    QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling); // <--
    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine;
    return app.exec();

Device Pixel Ratio (Scaling Factor)

In Qt from display density (dpi) a scaling factor was calculated, where 160 dpi is scaling factor 1.

You can easy test this for your devices:

	qDebug() << qApp->primaryScreen()->devicePixelRatio();

For my two devices I got:

  • Android (PRIV), 540 dpi –> scaling factor: 3.5
  • iOS (iPhone 6S), 326 dpi –> scaling factor: 2.0

Use Pixels in QML

UI is defined in QML and all sizes, coordinates, … are in pixels. This is how Qt worked all the 20+ years.

Now with High DPI enabled the pixels are density-independent. Let’s take a look at the iPhone with Device Pixel Ratio 2.0

iPhone 6S has 750 x 1334 with 326 dpi. Let’s check the size:

	qDebug() << qApp->primaryScreen()->size();
	// we get: QSize(375, 667)

we get 375 x 667. So using a width of 120 will be calculated as 120 * 2.0 = 240 px

let’s compare this with other platforms:

Android Device Independent Pixels (dip / dp)

Android does it similar: Device Independent Pixels are 1:1 for 160 dpi (mdpi)

Android uses a set of generalized densities:

  • ldpi (low) ~120dpi –> scaling factor: 0.7
  • mdpi (medium) ~160dpi –> scaling factor: 1.0
  • hdpi (high) ~240dpi –> scaling factor: 1.5
  • xhdpi (extra-high) ~320dpi –> scaling factor: 2.0
  • xxhdpi (extra-extra-high) ~480dpi –> scaling factor: 3.0
  • xxxhdpi (extra-extra-extra-high) ~640dpi –> scaling factor: 4.0

Read more in detail here:

As you can see Android also has a baseline at 160 dpi, so it’s the same as with Qt.

iOS Points and Pixels

What about iOS ? Coordinates and sizes are defined in points.

And it’s the same as for Android and Qt: At a density of 160 dpi the scaling factor is 1.

Take a look at to compare all the sizes, pixels and points.

As you can see the iPhone 6 has 375 x 667 points for 750 x 1334 pixels – same as with Qt.

BlackBerry 10 Design Units (du)

Since OS 10.3 BlackBerry 10 also is resolution independent:

BB10 uses Design Units (du) and groups the devices:

  • BlackBerry Classic (720×720), 294 dpi –> 8 pixel per du
  • BlackBerry Z30 (720 x 1280), 295 dpi –> 8 pixel per du
  • BlackBerry Passport (1440 x 1440), 453 dpi –> 12 pixel per du

Coming from BlackBerry 10 development, you have to rethink / recalculate your dimensions.

There will be more articles about Icons, Images, Orientation, … stay tuned

← Back (Qt Quick Controls 2)

→ Next Article (Our first demo app)

⇐ Home (Overview / Topics)


No Comments

Be the first to start the conversation!

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s