QML 布局管理器之RowLayout

一.RowLayout讲解

RowLayout可以看作是只有一行的GridLayout，它的行为与Row类似，不同之处在它所管理的元素可以使用下列附加属性:
Layout.minimumWidth

Layout.minimumHeight

Layout.preferred Width

Layout.preferredHeight 

Layout.maximumWidth

Layout.maximumHeight

Layout.fillWidth

Layout.fillHeight

Layout.alignment

二.RowLayout使用示例

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Layouts 1.12

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("RowLayout Example")

    RowLayout {
        //横向布局填充整个窗口区域
        anchors.fill: parent
        anchors.margins: 10
        spacing: 10
        
        //横向布局区域居中显示
        Rectangle {
            color: "red"
            Layout.preferredWidth: 100
            Layout.preferredHeight: 100
        }

        //填充区域宽度和高度显示
        Rectangle {
            color: "green"
            Layout.fillWidth: true;
            Layout.fillHeight: true;
        }

        //横向布局区域剧中显示
        Rectangle {
            color: "blue"
            Layout.preferredWidth: 100
            Layout.preferredHeight: 100
        }
    }
}

 运行结果：