Динамически создавать список ListModel

Question

Я хочу иметь Swipeview, внутри swipeview список od widgets (buttons). Все должно создаваться динамически, потому что может быть один экран или пять, или один виджет или больше. Он может быть добавлен через ящик (в будущем). Добавление экрана в ящик добавляет еще один экран. Добавить виджет добавляет один виджет на текущий экран. Я думаю, это должно быть как на изображении. Я пытался сделать это как here. Моя попытка:

main.qml

ApplicationWindow { 
visible: true 
Item { 
    id: root 

    ListModel { 
     id: listoflists 
    } 

    ListView { 
     id: listview 
    } 

    function addlist() { 
     CreateObject.create("listofwidgets.qml", root, itemAdded); 
    } 

    function listadded(obj, source) { 
     listoflists.append({"obj": obj, "source": source}) 
    } 

    function addview() { 
     CreateObject.create("view.qml", root, itemAdded); 
    } 

    function viewadded(obj, source) { 
     listoflists.append({"obj": obj, "source": source}) 
    } 

} 

Component { 
    id: modelDelegate 
     Text { 
      text: name 
     } 
} 

SwipeView { 
    id: view 
    currentIndex: 0 

} 

PageIndicator { 
    id: indicator 

    count: view.count 
    currentIndex: view.currentIndex 

    anchors.bottom: view.bottom 
    anchors.horizontalCenter: parent.horizontalCenter 
} 

Button { 
    width: parent.width 
    height: 20 
    text: "add screen" 

    onClicked: { 
     addlist() 
     addview() 
    } 
} 

Button { 
    width: parent.width 
    height: 20 
    text: "add widget" 

    onClicked: { 
     listoflist.get(view.currentIndex).addwidget() 
    } 
} 
} 

listofwidgets.qml

Item { 
id: root2 

ListModel { 
    id: listofwidgets 
} 

function addwidget() { 
    CreateObject.create("widget.qml", root2, widgetadded); 
} 

function widgetadded(obj, source) { 
    listofwidgets.append({"obj": obj, "source": source}) 
} 

} 

widget.qml

ListElement { 
    name: "" 
} 

view.qml

Item { 
id: view.currentIndex 

ListView { 
    model: listoflists.get(view.currentIndex) 
    delegate: modelDelegate 

} 
} 

Answer 1

Я не знаю, если это то, что вам нужно, но вот пример совершенно динамически созданного SwipeView:

import QtQuick 2.7 
import QtQuick.Window 2.2 
import QtQuick.Controls 2.0 
import QtQuick.Layouts 1.3 

Window { 
    width: 400 
    height: 600 
    visible: true 

    ColumnLayout { 
     anchors.fill: parent 
     spacing: 2 
     Rectangle { 
      Layout.preferredHeight: 50 
      Layout.fillWidth: true 
      Row { 
       Button { 
        text: "Add screen" 
        onClicked: addScreen(); 
       } 
       Button { 
        text: "Add widget" 
        onClicked: addWidget(); 
       } 
      } 
     } 

     SwipeView { 
      id: swipe 
      Layout.fillWidth: true 
      Layout.fillHeight: true 
     } 
    } 

    Component { 
     id: screenComponent 
     Rectangle { 
      property alias view: view 
      color: Qt.rgba(Math.random(),Math.random(),Math.random(),1) 
      ListView { 
       id: view 
       spacing: 2 
       anchors.fill: parent 
       model: ListModel {} 
       delegate: widgetComponent 
      } 
     } 
    } 
    Component { 
     id: widgetComponent 
     Button { 
      text: name + "_" + index 
     } 
    } 

    function addScreen() 
    { 
     var page = screenComponent.createObject(swipe); 
     swipe.addItem(page); 
     swipe.currentIndex = swipe.count - 1; 
    } 

    function addWidget() 
    { 
     var page = swipe.currentItem; 
     if(page) { 
      page.view.model.append({name: "widget"}); 
     } 
    } 
}