Qt on Android: how to adapt to different screen sizes

Qt on Android: how to adapt to different screen sizes

How can I use Android apps developed by Qt to adapt to various screen sizes of Android smartphones?

Speaking of the screen size, there are mobile phone screens from 2.8 to 8.9, which is more painful for programmers. The Android project has taken this issue into consideration. resource files and comparison labels all have ldpi, mdpi, hdpi, and xhdpi versions. The Android framework automatically selects corresponding icons Based on the screen size, in this way, the application looks similar on screens of different sizes.

What about the Qt application? In fact, this mechanism is not very useful for Android (only App icons can be used for free), and everything has to be done by yourself. What should we do?

First, we need to understand DPI, and then the font size.

DPI and font size

DPI, dot per inch, that is, the number of points contained in each inch. Another concept is PPI, that is, the number of records per inch. In general, DPI is enough for professionals to handle ultra-high DPI scenarios. The use of PPI may be more accurate. In Qt, There is only DPI, so let's just talk about it.

The larger the value, the larger the pixel density, the larger the screen size can have a large resolution. For example, for some Android phones, the 3.7 inch screen can provide a resolution of 960x540, while for some phones, the 5 inch screen provides a resolution of 800x480. These two mobile phones with different screen sizes and resolutions, the 5-inch screen looks granular, while the 3.7-inch screen looks very delicate. This is the difference in pixel density.

On some screens, the horizontal DPI is different from the vertical DPI, that is, the pixel is not a square, which is more complicated ......

When writing an application, we should ideally set the size of the interface elements based on DPI + screen resolution.

QScreen class

In Qt, The QScreen class can obtain DPI-related information.

The group of attributes physicalDotsPerInch/physicalDotsPerInchX/physicalDotsPerInchY in QScreen indicates the physical DPI. LogicalDotsPerInch/logicalDotsPerInchX/logicalDotsPerInchY indicates logical DPI. Qt uses it to calculate the font size. We can use it to convert the pointSize of the font to pixelSize. Let's talk about it.

LogicalDotsPerInch is a simple average value of X and Y, which is enough in most cases. Of course, if you have the ultimate pursuit, ask logicalDotsPerInchX and logicalDotsPerInchY.

QFont class

QFont indicates the font. The font size can be expressed in two ways: pixelSize and pointSize. That is, the pixel size and the dot matrix size. If you use the pixel size to indicate the font size, the font size will not be affected by the DPI. on the computer, you can adjust the DPI of the monitor to observe the interface changes. However, this is not suitable for mobile scenarios that adapt to diversified screen sizes. When developing Android devices, we should use the pointSize of the font, which is also the default Processing Method of Qt applications.

No. The default value is pointSize!

Neither! And look down.

Controls in Qt

In Qt, QLabel, QPushButton, QListWidget, QTabelWidget, and other controls that can be used on Android devices can be used to display text. You can find a bunch of mobile phones with different sizes and use the QFont setPointSize () method to adjust the font dot matrix size and weigh the effect, you can decide how to set the font size of your application.

But there are still non-text scenarios. For example, if you are an image button, what should you do?

My answer is: Calculate the pixel size based on the dot matrix size of the font, and then use this to adjust the size of non-text controls. In this way, non-text elements such as text elements and images on the interface can be matched.

Calculation formula from pointSize to pixelSize: pixelSize = DPI * pointSize/72.

How to Use DPI for Qt applications

Look at a code snippet:

int main(int argc, char **argv){    QApplication a(argc, argv);    ...    QScreen *screen = a.primaryScreen();    QFont f = a.font();    int pixelSize = (f.pointSize() * screen->logicalDotsPerInch()) / 72;    /*    f.setPointSize(25);    a.setFont(f);    int newPixelSize = (f.pointSize() * screen->logicalDotsPerInch()) / 72;    */    ...}

In fact, it is very simple. If you set the font of QApplication, the font size of all the interface elements of your application will change. If you want to set the font of a Widget separately, you can call the setFont () method for it.

The code above also demonstrates the conversion from pointSize to pixelSize. Once you get the appropriate pixelSize, you can set the size of non-text interface elements based on it.

Qt obtains the screen resolution

We have mentioned that it is best to adjust the interface elements together with the resolution and DPI. DPI usage has been briefly introduced, with resolution left.

The size attribute of the QScreen class can return the pixel size of the screen. availableSize can return the available size of the application. The difference between the two is that availableSize removes the size occupied by the window manager (on the computer is the taskbar, on the Android mobile phone is the status bar and other areas ).

The following is a simple sample code:

#ifdef ANDROID    QSize iconSize(32, 32);    ...    QScreen *screen = qApp->primaryScreen();    QFont f = qApp->font();    int pixelSize = (f.pointSize() * screen->logicalDotsPerInch()) / 72;    QSize screenSize = screen->size();    if(screenSize.width() > 960 || screenSize.height() > 960)    {        iconSize *= ((qreal)pixelSize) / 20;    }#endif

We know how to set the Qt on Android app to adapt to a variety of screen sizes, but what is the effect of your app after it runs depends on how you use the content described above ......

Other articles in this series:

• Qt on Android: full process of Hello World
• Introduction to Qt 5.2 for Android development in Windows
• Analysis of the deployment process of Qt for Android
• Qt on Android: Output Qt debugging information to logcat.
• Qt on Android: Qt 5.3.0 released. Improvements for Android
• Qt on Android Episode 1)
• Qt on Android Episode 2)
• Qt on Android Episode 3)
• Qt on Android Episode 4)
• Compiling a pure C project using Qt for Android
• Compiling Android C language executable programs using Qt for Android in Windows
• Qt on Android: Android SDK Installation
• Qt on Android: http download and Json Parsing
• Set the app name for Qt on Android to Chinese
• Qt on Android: Enables full screen display of Qt Widgets and Qt Quick apps