如何在 qml 的中继器中使用工具分隔符？答案

【问题标题】：How to use toolseparator inside a repeater in qml?如何在 qml 的中继器中使用工具分隔符？
【发布时间】：2020-11-17 21:12:17
【问题描述】：

Toolseparator 在中继器中不起作用。我需要在每个内容之后的那一行下显示图像和文本，所以为了显示我使用工具分隔符但它不起作用的行，它只是通过仅显示行来覆盖所有内容。这是一个例子

Repeater {
  model: 10
  Row {
    leftPadding: 10
    spacing: 10
    Rectangle {
      height: 100
      width: 200
    }
    Text {
      text: "Username"
    }
    ToolSeparator {
      height: 25
      width: 335
      orientation: Qt.Horizontal
    }
  }
}

【问题讨论】：

您能否提供一个最小且完整的示例，该示例运行时不会出现错误（即为您的图像使用 http URL 或将其替换为矩形）并且格式正确？
可以用矩形替换图片

标签： qt qml

【解决方案1】：

朋友，你犯了一些错误。

如果你打算使用Repeater -- 通常你应该在一些定位组件中使用它（例如Column、Row）。所以在你的情况下，Repeater 应该在Row 内。顺便说一句，千万不要忽视查看官方 Qt 文档：Repeater Detailed Description； Using QML Positioner and Repeater Items。除此之外还有很棒的学习资源 QmlBook，例如它的Quick Starter。
如果你想在另一个下显示你的组件——你应该使用Column组件，而不是Row。

如果我对你的理解正确，你会得到这样的东西：

使用此代码作为参考：

 Column {
    spacing: 10

    Repeater {
      model: 4

      Rectangle {
        id: background
        height: 50
        width: 200
        color: "bisque"

        Text {
          id: text
          color: "chocolate"
          text: "Username " + modelData
          anchors.centerIn: parent
        }

        Rectangle {
          id: separator
          anchors {
            bottom: parent.bottom
            left: parent.left
            right: parent.right
          }
          height: 5
          color: "goldenrod"
        }
      }
    }
  }

【讨论】：