QmlListView重疊-有解無憂

我的 qml 檔案中有這個 ListView

ListView {
                    id: listView
                    anchors.left: parent.left
                    anchors.right: parent.right
                    anchors.top: parent.top
                    anchors.bottom: parent.bottom

                    anchors.topMargin: 100
                    anchors.bottomMargin: 20
                    anchors.rightMargin: 20
                    anchors.leftMargin: 20


                    layoutDirection: Qt.LeftToRight
                    snapMode: ListView.SnapToItem
                    orientation: ListView.Horizontal
                    clip: true

                    model: ListModel
                    {
                        id: listmodel1
                    }

                    delegate: Item {
                        height: 50
                        Column {

                            Image {
                                source: link
                                sourceSize.height: 300
                                sourceSize.width: 100
                                fillMode: Image.PreserveAspectCrop
                            }


                            Text {
                                x: 5
                                color: 'white'
                                text: name
                                font.bold: true
                                anchors.horizontalCenter: parent.horizontalCenter
                                wrapMode: Text.WordWrap
                            }

                            spacing: 5
                        }
                    }


                }

我使用這個函式向它添加元素，我基本上接受輸入，運行一些抓取鏈接和標題 bla bla bla 并使用信號將其發回。我想也許問題在于添加它們的方式？

function onSetName(name,link)
    {
        console.log(link)
        var data={'name' : name ,'link': link}
        listView.model.append(data)
    }

它運行良好（添加元素部分）但所有專案重疊導致這個混亂

提前致謝

uj5u.com熱心網友回復：

您的委托項沒有寬度。由于這是一個水平串列視圖，您的代表的寬度為 0，因此它們彼此重疊。

最簡單的例子是：

delegate: Item {
  height: 50
  width: 100

  Column {
    ...
  }
}

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/402457.html

標籤：

上一篇：SwiftUI按作業層次結構排序串列

下一篇：如何過濾熊貓資料框以選擇列串列