[SOLVED] Creating ListModels for Nested ListViews



  • The listed code with nested ListView works as expected. Here the ListModels are statically created. In my requirement, initially both the ListModels (rootModel & childModel) are empty. The list element details are there in a json file. The file is read in javascript and list elements are appended. For each rootModel element childModel would be different. rootModel can be created easily, but how to create dynamically changing childModel for all rootElement?

    import QtQuick 2.2
    import QtQuick.Window 2.1
    import QtQuick.Layouts 1.1
    
    Window {
        visible: true
        width: 360
        height: 360
    
        ListModel {
            id: rootModel
    
            ListElement { rootText: "root-1" }
            ListElement { rootText: "root-2" }
        }
    
        ListView {
            id: rootListView
    
            anchors.fill: parent
            model: rootModel
            delegate: rootDelegate
        }
    
        Component {
            id: rootDelegate
    
            Item {
                width: 360
                height: 70
    
                RowLayout {
                    anchors.fill: parent
                    Rectangle {
                        id: rect1
                        width: parent.width / 2
                        height: 20
                        color: "lightgray"
                        anchors.left: parent.left
                        Text {
                            id: text1
                            text: rootText
                        }
                    }
                    Rectangle {
                        id: rect2
                        width: parent.width / 2
                        height: 60
                        color: "lightblue"
                        anchors.right: parent.right
    
                        ListModel {
                            id: childModel
    
                            ListElement { childText: "child-1" }
                            ListElement { childText: "child-2" }
                            ListElement { childText: "child-3" }
                        }
    
                        ListView {
                            id: childListView
                            anchors.fill: parent
    
                            model: childModel
                            delegate: Text { text: childText }
                        }
                    }
                }
            }
        }
    }
    

    Solved by creating array of list models and changing model of listView dynamically according to list view index.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.