Размер элементов в QML

Я новичок в QML. Как я понимаю, все элементы имеют связанную ширину и высоту, которая определяет их размер. Если пользователь изменяет разрешение экрана, конечный результат выглядит странно. Есть ли способ динамически управлять размером элементов на основе разрешения экрана?

1 ответов


вместо использования фиксированных значений вы можете умножить height и width корневого элемента по факторам, которые определяют размер ваших элементов пропорционально размеру корневых элементов. Кроме того, вы можете использовать якоря QML. С помощью этого вы можете создать полностью масштабируемые GUIs:

import QtQuick 1.0

Item {
    id: root

    // default size, but scalable by user
    height: 300; width: 400

    Rectangle {
        id: leftPanel

        anchors {
            top: parent.top
            left: parent.left
            bottom: parent.bottom
        }
        width: root.width * 0.3
        color: "blue"
    }

    Rectangle {
        id: topPanel

        anchors {
            top: parent.top
            left: leftPanel.right
            right: parent.right
        }
        height: root.height * 0.2
        color: "green"
    }


    Rectangle {
        id: contentArea

        anchors {
            top: topPanel.bottom
            left: leftPanel.right
            right: parent.right
            bottom: root.bottom
        }
        color: "white"

        Text {
            text: "Hi, I'm scalable!"
            anchors.centerIn: parent
            font.pixelSize: root.width * 0.05
        }
    }
}

Я не знаю, как получить разрешение экрана с чистым QML, который доступен во всех средах.

для определения разрешения экрана на мобильных устройствах вы можете использовать элемент экрана QML.

в настольных приложениях вы можете получить разрешение экрана на C++ (например, с QDesktopWidget) и доступно в QML.