Почему мои вложенные ListViews показывают только один элемент внешней модели?

Question

Я следую шаблону кода моего недоступного предшественника - использую вложенный ListView для реализации TreeView-подобного интерфейса.Я бы предпочел не использовать TreeView, просто чтобы сохранить одни и те же шаблоны в коде, а не вводить больше шаблонов.Но я не могу заставить основы работать с очень простым фрагментом кода!

Я пытался найти исчерпывающий справочник по QML / QtQuick, но мои поиски в основном указывают на людей, спрашивающих, почему нетодин.Я считаю, что сам борюсь с QML, а не работаю с ним, что является верным признаком того, что мне нужно попасть в книгу.Итак, вопрос 2: что мне читать?

import QtQuick 2.11
import QtQuick.Window 2.11
import QtQuick.Controls 1.4

Window {
    id: theWindow
    visible: true
    width: 640
    height: 480

    ListModel {
        id: outerModel
        ListElement{ display: "One" }
        ListElement{ display: "Two" }
        ListElement{ display: "Three" }
    }
    ListModel {
        id: innerModel
        ListElement{ display: "A" }
        ListElement{ display: "B" }
    }
    Column{
        ListView {
            model: outerModel
            height: 100
            width: 200
            delegate: Column {
                Text {
                    text: display
                }
                ListView {
                    model: innerModel
                    height: 100
                    width: 200
                    delegate: Text {
                        text: display
                    }
                } // ListView inner
            } //delegate Column
        } // ListView outer
    } // Column
} // Window

Я ожидаю, что результат будет похож на:

One
A
B
Two
A
B
Three
A
B

Но я получаю только

One
A
B

Answer 1

Проблема заключается в фиксированной высоте 100 пикселей на обоих ваших ListViews.

Удалите первую обертку Column и установите динамическую высоту внутренней ListView на основе содержимого:

ListView {
    model: outerModel
    height: parent.height // <====
    width: 200
    delegate: Column {
        Text {
            text: display
        }
        ListView {
            model: innerModel
            height: contentHeight // <====
            width: 200
            delegate: Text {
                text: display
            }
        }
    }
}

(или реализовать фактическое TreeView:))