QML ListView 数据项被覆盖（新手）答案

【问题标题】：QML ListView data items overwritten (newbie)QML ListView 数据项被覆盖（新手）
【发布时间】：2023-03-26 17:00:01
【问题描述】：

问题：

我缺少什么 - 显示项目应该在不同的行上？
为什么下面的两种 delgate 用法会给出不同的结果？
我应该阅读哪些内容才能理解这一点？

谢谢。

import QtQuick 2.15

import QtQuick.Layouts 1.15

import QtQuick.Window 2.15

Window {

    width: 640
    height: 480
    visible: true
    title: qsTr("ListView Overwrite")

    ListModel {
        id: dataSource_1
        ListElement { name: "rock" }
        ListElement { name: "paper" }
        ListElement { name: "scissors" }
    }

    Component {
        id: delegateItem
        Item {
            Text { text: name }
        }
    }

    ListView {
        model: dataSource_1
        //delegate: Text { text: name } // only "rock" displayed
        delegate: delegateItem  // rock, paper, scissors displayed, overwritten
    }
}

【问题讨论】：

标签： listview model delegates qml

【解决方案1】：

您的问题的一个很好的解释可以在Item.implicitHeight的文档中找到：

大多数项目的默认隐式大小为 0x0，但有些项目具有无法覆盖的固有隐式大小，例如图像和文本。

您没有为 ListView 指定大小，因此它当前的隐式大小为 0x0。

这意味着纸/剪刀代表被认为在视图之外并且不会被渲染。

例如，给ListView 指定一个明确的高度，或者简单地指定anchors.fill: parent。

对于使用基于“组件”的解决方案相互堆叠的代表来说，这是同样的问题。这里的问题是Text 包裹在没有指定大小的Item 周围，因此每个委托的隐式高度等于0。删除 Item 包装器，您的文本将被正确定位，因为 Text 具有固有的 implicitHeight。

【讨论】：

请注意，不需要这种基于“组件”的解决方案，您使用delegate: Text {...} 的原始解决方案很好！
我没有名声，所以不能赞成这个答案。如果我能的话我会的。感谢您告诉我确切的问题——ListView 上没有高度——并提供解决方案。指定高度解决了我的问题。
很高兴为您提供帮助！即使您还不能为答案投票，您也可以接受您的问题的答案