QML自适应常用布局(一)

importQtQuick 2.6
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    property int headerHeight: 60
    property int footerHeight: 35

    Grid {
        id: grid_wrapper
        width: parent.width
        height: parent.height
        rows: 3

        Rectangle {
            width: parent.width
            height: headerHeight
            border {
                width: 1
                color: '#ff0000'
            }

        }
        Grid {
            id: grid_wrapper2
            width: parent.width
            height: parent.height - (headerHeight + footerHeight)
            columns: 2
            Rectangle {
                id: rect_left
                width: parent.width * 0.2
                height: parent.height
                border {
                    width: 1
                    color: '#00ff00'
                }

            }

            Rectangle {
                id: rect_right
                width: parent.width * 0.8
                height: parent.height
                border {
                    width: 1
                    color: '#00ff00'
                }

            }

        }

        Rectangle {
            width: parent.width
            height: headerHeight
            border {
                width: 1
                color: '#00ff00'
            }

        }
    }
}
posted @ 2019-07-09 19:57  不随。  阅读(102)  评论(0编辑  收藏  举报  来源