Repeater 创建的项目具有不正确的几何形状

Question

我想连续显示四个可检查按钮：

import QtQuick 2.4
import QtQuick.Window 2.2
import QtQuick.Controls 1.2
import QtQuick.Layouts 1.1

Window {
    id: main
    visible: true
    width: 600; height: 350

    ColumnLayout {
        id: mainColumn

        anchors.fill: parent // takes all available width
        RowLayout {
            Repeater {
                id: rep
                model: ["first", "second", "third", "fourth"]
                Component.onCompleted: console.log(count)
                Button {
                    text: modelData
                    checkable: true
                    Layout.preferredWidth: mainColumn.width / rep.count // (!)
                }
            }
        }
        // more elements
    }
}

然后第四个按钮被切断（好像引入了额外的间距或按钮太宽）。

如果我使用 Row 而不是 RowLayout 和 width 而不是 Layout.preferredWidth，项目将正确显示。

他们为什么不 RowLayout？

Answer 1

Row 和 RowLayout 都有 spacing 属性。但是，如果您阅读 Row spacing 的文档，您会看到

The spacing is the amount in pixels left empty between adjacent items. The default spacing is 0.

而 RowLayout spacing 显示为

This property holds the spacing between each cell. The default value is 5.

所以，基本上，将 spacing: 0 添加到您的 RowLayout。