Listview delegate ListView
-
How to use listview inside list view ? It's does not work. I don't see Text value in listview.
ListView { id: fixtureList width: parent.width height: parent.height - (header.height + tabBar.height) * dp anchors.top: header.bottom anchors.left: parent.left focus: true clip: true model: ListModel{} delegate: ListView { id: dataList model: detail delegate: Rectangle { color: "#ffffff" Text { id: startHours text: qsTr("Hmmm") anchors.centerIn: parent color: "black" } } Component.onCompleted: { console.log(model.date) } } section { property: "name" criteria: ViewSection.FullString delegate: Rectangle { color: "#d2d4c7" width: parent.width height: 50 * dp Text { text: section anchors.left: parent.left anchors.leftMargin: 40 anchors.top: parent.top anchors.topMargin: 10 font.pixelSize: 17 font.family: fontRegular.name } } } } -
@jsulm maybe you can help me
@NullByte No, I'm not a QML expert
-
How to use listview inside list view ? It's does not work. I don't see Text value in listview.
ListView { id: fixtureList width: parent.width height: parent.height - (header.height + tabBar.height) * dp anchors.top: header.bottom anchors.left: parent.left focus: true clip: true model: ListModel{} delegate: ListView { id: dataList model: detail delegate: Rectangle { color: "#ffffff" Text { id: startHours text: qsTr("Hmmm") anchors.centerIn: parent color: "black" } } Component.onCompleted: { console.log(model.date) } } section { property: "name" criteria: ViewSection.FullString delegate: Rectangle { color: "#d2d4c7" width: parent.width height: 50 * dp Text { text: section anchors.left: parent.left anchors.leftMargin: 40 anchors.top: parent.top anchors.topMargin: 10 font.pixelSize: 17 font.family: fontRegular.name } } } }@NullByte your ListView delegate has no height and no width, give it some
also your original ListModel is empty, that doesn't help either. -
@NullByte your ListView delegate has no height and no width, give it some
also your original ListModel is empty, that doesn't help either.@J-Hilk
My listview code and append model JS function. I set width and height but I see only first listview section. I have no idea how to do it
ListView { id: fixtureList width: parent.width height: parent.height - (header.height + tabBar.height) * dp anchors.top: header.bottom anchors.left: parent.left focus: true clip: true model: ListModel{} delegate: ListView { id: dataList width: fixtureList.width height: children.height model: detail delegate: Rectangle { width: parent.width height: 100 * dp color: "#ffffff" Text { id: startDate text: date anchors.centerIn: parent color: "black" Component.onCompleted: { console.log(date) } } } } section { property: "name" criteria: ViewSection.FullString delegate: Rectangle { color: "#d2d4c7" width: parent.width height: 50 * dp Text { text: section anchors.left: parent.left anchors.leftMargin: 40 anchors.top: parent.top anchors.topMargin: 10 font.pixelSize: 17 font.family: fontRegular.name } } } }function setData() { var matchData for(var i = 0; i < fixtureData.length; i++) { fixtureList.model.append({id: fixtureData[i].id, name: fixtureData[i].name, image: fixtureData[i].category.image}) for(var k = 0; k < fixtureData[i].matchdata.length; k++) { if(fixtureData[i].matchdata[k] !== undefined || fixtureData[i].matchdata[k] !== null) { fixtureList.model.append({detail: fixtureData[i].matchdata[k], properties: fixtureData[i].matchdata[k].properties}) } } } } -
@J-Hilk
My listview code and append model JS function. I set width and height but I see only first listview section. I have no idea how to do it
ListView { id: fixtureList width: parent.width height: parent.height - (header.height + tabBar.height) * dp anchors.top: header.bottom anchors.left: parent.left focus: true clip: true model: ListModel{} delegate: ListView { id: dataList width: fixtureList.width height: children.height model: detail delegate: Rectangle { width: parent.width height: 100 * dp color: "#ffffff" Text { id: startDate text: date anchors.centerIn: parent color: "black" Component.onCompleted: { console.log(date) } } } } section { property: "name" criteria: ViewSection.FullString delegate: Rectangle { color: "#d2d4c7" width: parent.width height: 50 * dp Text { text: section anchors.left: parent.left anchors.leftMargin: 40 anchors.top: parent.top anchors.topMargin: 10 font.pixelSize: 17 font.family: fontRegular.name } } } }function setData() { var matchData for(var i = 0; i < fixtureData.length; i++) { fixtureList.model.append({id: fixtureData[i].id, name: fixtureData[i].name, image: fixtureData[i].category.image}) for(var k = 0; k < fixtureData[i].matchdata.length; k++) { if(fixtureData[i].matchdata[k] !== undefined || fixtureData[i].matchdata[k] !== null) { fixtureList.model.append({detail: fixtureData[i].matchdata[k], properties: fixtureData[i].matchdata[k].properties}) } } } }@NullByte
I still can't work with that 🤷♂️here's a minimal working compile-able example:
Window { visible: true width: 640 height: 480 title: qsTr("Hello World") color: "white" id: win ListView { id: fixtureList anchors.fill: parent focus: true clip: true model: 20 delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: 10 clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 color: dataList.id % 2 ? "darkred" : "steelblue" Text { id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" } } } } } -
@NullByte
I still can't work with that 🤷♂️here's a minimal working compile-able example:
Window { visible: true width: 640 height: 480 title: qsTr("Hello World") color: "white" id: win ListView { id: fixtureList anchors.fill: parent focus: true clip: true model: 20 delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: 10 clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 color: dataList.id % 2 ? "darkred" : "steelblue" Text { id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" } } } } }@J-Hilk
Thanks so much.
It's not work. I see two listview section one is empty another one is true. And second listview (dataList) delagete is not running.ListView { id: fixtureList width: parent.width height: (parent.height - (header.height + tabBar.height * dp) * dp) anchors.top: header.bottom anchors.left: parent.left focus: true clip: true model: ListModel{} delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: detail clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 * dp color: dataList.id % 2 ? "darkred" : "steelblue" Text { // not showing. id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" Component.onCompleted: { console.log(id) // Cannot print. } } } } section { property: "name" criteria: ViewSection.FullString delegate: Rectangle { color: "#d2d4c7" width: parent.width height: 50 * dp Text { text: section anchors.left: parent.left anchors.leftMargin: 40 anchors.top: parent.top anchors.topMargin: 10 font.pixelSize: 17 * dp font.family: fontRegular.name } } } } -
dataList delegate is not running/work
delegate: Rectangle { width: parent.width height: 100 * dp color: dataList.id % 2 ? "red" : "blue" Text { // not showing. id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" Component.onCompleted: { console.log("I'm here ") // not print } } Component.onCompleted: { console.log("I'm here 1") // not print } } -
@SGaist have any idea ?
-
@NullByte
I still can't work with that 🤷♂️here's a minimal working compile-able example:
Window { visible: true width: 640 height: 480 title: qsTr("Hello World") color: "white" id: win ListView { id: fixtureList anchors.fill: parent focus: true clip: true model: 20 delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: 10 clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 color: dataList.id % 2 ? "darkred" : "steelblue" Text { id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" } } } } }@J-Hilk said in Listview delegate ListView:
@NullByte
I still can't work with that 🤷♂️here's a minimal working compile-able example:
Window { visible: true width: 640 height: 480 title: qsTr("Hello World") color: "white" id: win ListView { id: fixtureList anchors.fill: parent focus: true clip: true model: 20 delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: 10 clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 color: dataList.id % 2 ? "darkred" : "steelblue" Text { id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" } } } } }It's solved. Thanks for help.
Problem is my model is to be wrong.
-
@J-Hilk said in Listview delegate ListView:
@NullByte
I still can't work with that 🤷♂️here's a minimal working compile-able example:
Window { visible: true width: 640 height: 480 title: qsTr("Hello World") color: "white" id: win ListView { id: fixtureList anchors.fill: parent focus: true clip: true model: 20 delegate: ListView { id: dataList width: fixtureList.width * 2 / 3 // Allow right 1/3 to scroll main ListView height: fixtureList.height / 5 //limit to 5 Entrys(dataLists) per mainview(fixtureList) model: 10 clip: true property int id: index delegate: Rectangle { width: parent.width height: 100 color: dataList.id % 2 ? "darkred" : "steelblue" Text { id: startDate text: "SubList %1 entry %2".arg(dataList.id).arg(index) anchors.centerIn: parent color: "black" } } } } }It's solved. Thanks for help.
Problem is my model is to be wrong.
@NullByte Great that you managed to find the issue 😁,
good luck!
