Nested lists in QT QML

[spirit]

here we go

import QtQuick 1.0
 
Rectangle {
    width: 360
    height: 360
 
    ListModel {
        id: model1
 
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
    }
    ListModel {
        id: model2
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
    }
 
    Component {
        id: delegate2
 
        Item {
            width: 100
            height: col.childrenRect.height
 
            Column {
                id: col2
 
                Text {
                    id: name1
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
            }
        }
    }
 
    ListView {
        id: outer
        model: model1
        delegate: listdelegate
    }
 
    Component {
        id: listdelegate
 
        Item {
            width: 100
            height: col.childrenRect.height
 
            Column {
                id: col
                Text {
                    id: t1
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
                Text {
                    id: t2
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
                ListView {
                    id: insidelist
                    model: model2
                    delegate: delegate2
                    height: contentItem.height
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
            }
        }
    }
}

import QtQuick 1.0

Rectangle {
    width: 360
    height: 360

    ListModel {
        id: model1

        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
    }
    ListModel {
        id: model2
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
    }

    Component {
        id: delegate2

        Item {
            width: 100
            height: col.childrenRect.height

            Column {
                id: col2

                Text {
                    id: name1
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
            }
        }
    }

    ListView {
        id: outer
        model: model1
        delegate: listdelegate
    }

    Component {
        id: listdelegate

        Item {
            width: 100
            height: col.childrenRect.height

            Column {
                id: col
                Text {
                    id: t1
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
                Text {
                    id: t2
                    text: name
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
                ListView {
                    id: insidelist
                    model: model2
                    delegate: delegate2
                    height: contentItem.height
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[Raghavendra R M]

Hi ! now the overlapping problem is solved...thank you
But again the nested lists are not working right?
i mean the output should have been 'inside' repeated 3 times under each 'name' right?
I'm sorry if i am disturbing you...but i am helpless...

[spirit]

import QtQuick 1.0
 
Rectangle {
    width: 360
    height: 360
 
    ListModel {
        id: model1
 
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
    }
    ListModel {
        id: model2
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
    }
 
    Component {
        id: delegate2
 
        Item {
            width: 100
            height: col2.childrenRect.height
 
            Column {
                id: col2
                anchors.left: parent.left
                anchors.right: parent.right
                Text {
                    id: name1
                    text: name
                }
            }
        }
    }
 
    ListView {
        id: outer
        model: model1
        delegate: listdelegate
        anchors.fill: parent
    }
 
    Component {
        id: listdelegate
 
        Item {
            width: 100
            height: col.childrenRect.height
 
            Column {
                id: col
                anchors.left: parent.left
                anchors.right: parent.right
                Text {
                    id: t1
                    text: name
                }
                Text {
                    id: t2
                    text: name
                }
                ListView {
                    id: insidelist
                    model: model2
                    delegate: delegate2
                    contentHeight: contentItem.childrenRect.height
                    height: childrenRect.height
                    anchors.left: parent.left
                    anchors.right: parent.right
                    clip: true
                }
            }
        }
    }
}

import QtQuick 1.0

Rectangle {
    width: 360
    height: 360

    ListModel {
        id: model1

        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
        ListElement {
            name: "name"
        }
    }
    ListModel {
        id: model2
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
        ListElement {
            name: "inside"
        }
    }

    Component {
        id: delegate2

        Item {
            width: 100
            height: col2.childrenRect.height

            Column {
                id: col2
                anchors.left: parent.left
                anchors.right: parent.right
                Text {
                    id: name1
                    text: name
                }
            }
        }
    }

    ListView {
        id: outer
        model: model1
        delegate: listdelegate
        anchors.fill: parent
    }

    Component {
        id: listdelegate

        Item {
            width: 100
            height: col.childrenRect.height

            Column {
                id: col
                anchors.left: parent.left
                anchors.right: parent.right
                Text {
                    id: t1
                    text: name
                }
                Text {
                    id: t2
                    text: name
                }
                ListView {
                    id: insidelist
                    model: model2
                    delegate: delegate2
                    contentHeight: contentItem.childrenRect.height
                    height: childrenRect.height
                    anchors.left: parent.left
                    anchors.right: parent.right
                    clip: true
                }
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[Raghavendra R M]

Its solved...!! Thanks a lot...:-) :-) :-)

[mhaugstrup]

Hi

Attempting to fix my similar issue from this older thread.

In the case referenced by the example code above - what should be altered if the inside models where to be unique for each entry in the outside list? Eg produce this output;:

model1:1

model2:1
model2:2
model2:3

model1:2

model3:1
model3:2
model3:3

Thanks!

Mikkel