动态创建 ListModel 列表
Dynamically create list of ListModel
我想要一个 Swipeview,在一个 swipeview 中有一个小部件(按钮)列表。一切都必须动态创建,因为可以有一个或五个屏幕,或者一个或更多小部件。它可以通过抽屉添加(将来)。在抽屉上添加屏幕再添加一个屏幕。添加小部件在当前屏幕上添加一个小部件。我觉得应该和图片一样。我试图使它像 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
}
}
我不知道这是否是您需要的,但这是完全动态创建的示例 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"});
}
}
}
我想要一个 Swipeview,在一个 swipeview 中有一个小部件(按钮)列表。一切都必须动态创建,因为可以有一个或五个屏幕,或者一个或更多小部件。它可以通过抽屉添加(将来)。在抽屉上添加屏幕再添加一个屏幕。添加小部件在当前屏幕上添加一个小部件。我觉得应该和图片一样。我试图使它像 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
}
}
我不知道这是否是您需要的,但这是完全动态创建的示例 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"});
}
}
}