QML 中流中的列数

Question

在我的 Qt 5.9 QML 应用程序中，我想显示 Rectangles with a fixed width in a Flow。为了保持布局居中，我尝试动态调整其填充。要计算正确的值，虽然我需要知道当前的列数，比如 colCount。有办法得到吗？

这是我想使用伪变量 colCount:

执行的代码示例

import QtQuick 2.7
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

ApplicationWindow {
    visible: true
    width: 800
    height: 600
    title: qsTr("Example")

    Flow {
        anchors.fill: parent
        leftPadding: parent.width > 200*colCount ? 0.5*(parent.width - 200*colCount) : 0
        spacing: 0

        Rectangle {
            width: 200
            height: 200
            color: "red"
        }

        Rectangle {
            width: 200
            height: 200
            color: "blue"
        }
    }
}

Answer 1

posting 的魔力 :) 在我设法解决这个问题后不久，我post 为可能需要它的人提供了解决方案。

有一个属性 childrenRect.width 继承自 Item 可以派上用场。所以列数 colCount 可以计算为 childrenRect.width / w，其中 w 是 child 的宽度（它对于 FLOW 的所有 children 应该是相同的才能使这个工作。

在问题的代码示例中：

import QtQuick 2.7
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

ApplicationWindow {
    visible: true
    width: 800
    height: 600
    title: qsTr("Example")

    Flow {
        anchors.fill: parent
        leftPadding: parent.width > childrenRect.width ? 0.5*(parent.width - childrenRect.width) : 0
        spacing: 0

        Rectangle {
            width: 200
            height: 200
            color: "red"
        }

        Rectangle {
            width: 200
            height: 200
            color: "blue"
        }
    }
}

QML 中流中的列数

Number of columns in a Flow in QML

qt

qml

qt5

qtquick2