Адаптивный интерфейс на Qt+Qml для Android

Не так давно мне стало интересно писать мобильные приложения используя qt, и еще в первый же день появился вопрос, как сделать приложение адаптивным к любому устройству.

Потратив несколько часов на гугление, понял, что на русскоязычном сообществе не хватает материала на эту тему, и поэтому в этой статье предложу вам примитивный, но очень рабочий вариант, чтобы вы не тратили на этот вопрос много времени как я.

Основная идея

Вся идея — получить разрешение устройства с помощью объекта QScreen, прописываем это в main.cpp:

    ...
    #include <QGuiApplication>
    #include <QScreen>
    ...
    QGuiApplication app(argc, argv);
    QScreen *screen = app.primaryScreen();
    int width = screen->size().width();
    int height = screen->size().height();
    ...

Далее создаем свойства для ширины и высоты, это проделываем в главном файле интерфейса main.qml:

    property int swidth: 0
    property int  sheight: 0
    width: swidth
    height: sheight

Любым удобным способом записываем в них значение определенных размеров экрана в том же main.qml:

Connections {
        target: appCore
        onSendResolution: {
            swidth = width
            sheight = height
        }
    }

А после очень просто делим все наши размеры на коэффициенты:

    Button {
        id: startbutton
        x:swidth/2.76
        y:sheight/3.13
        width: swidth/3.6
        height: sheight/8.66
    }

Таким образом, все позиции и размеры элементов будут зависеть от пиксельных размеров экрана, и приложение будет одинаково выглядеть на любых устройствах.

Минусом будет то, что размеры придется так указывать всем элементам, и нужно будет решить проблему размера текста, потому что с ним все не так гладно, если у устройства будут нестандартные размеры. Однако в остальном такой способ очень прост для новичка, и этого будет достаточно для первого релиза.

Надеюсь, эта статья помогла новичкам в qt, блуждающим по рунету в поисках решений адаптивного интерфейса.