在QML中动态创建ListModel

时间:2014-07-30 05:09:20

标签: javascript runtime qml qt5

当我需要在运行时创建任何QML组件时,我可以使用该指南: http://qt-project.org/doc/qt-5/qtqml-javascript-dynamicobjectcreation.html

即。只需调用Qt.createComponent和component.createObject

但是我找不到如何在运行时创建ListModel?使用qml,而不是c ++。

你可以问,为什么我需要它。所以,我有一个嵌套的ListModel:有外部模型,它委托包含内部模型。因此,当我调用outer_model.append({})时,我必须为内部模型传递新创建的ListModel。我不能在外部委托中使用静态定义的内部模型,因为我无法在运行时访问此类模型。顺便说一句,它可以以某种方式访问​​吗?

P.S。也许在javascript中尝试管理模型是完全错误的想法?

3 个答案:

答案 0 :(得分:10)

我是一名编写QtQuick应用程序的JS开发人员,这是我尝试过的多种解决方案。

在QML中管理JavaScript模型的简短回答是它是一场噩梦。我建议你编写一个QAbstractListModel的小子类,它在内部使用QJsonArray作为它的数据源,这样就可以更容易地理解C ++中的数据结构以及它在QML中的用法。按照说明从C ++ here创建QML类型。

如果您仍希望在JavaScript中执行此操作,则另外一种方法如下:

function createNewList() {
    var newListModel = Qt.createQmlObject('import QtQuick 2.2; \
        ListModel {}', parent);
    return newListModel;
}

然而,即使使用 gc()

,这也存在严重的内存泄漏问题

如果你主要关心的是ListModel里面有ListModel,那么下面这个简单的东西对我有效(我认为在ListModels里面有一个对象数组和ListModel之间的隐式类型转换)

property ListModel items: ListModel {}

function addComplexItem() {
    items.append({
        "key": "People",
        "arr": [
            {
             "arrItemName": "John",
             "arrItemValue": 18,
            },
            {
             "arrItemName": "Kerry",
             "arrItemValue": 21,
            },
            {
             "arrItemName": "Mike",
             "arrItemValue": 19,
            }    
        ]});
}


// Usage
Component {
    id: viewDelegate

    Item {
        Text {
            text: "List of " + key
        }
        ListView {
            model: arr
            delegate: Rectangle {
                Text { 
                    text: arrItemName
                } 
            }
        }  
    }
}

答案 1 :(得分:6)

试试这个:

Component {
    id: someComponent
    ListModel {
    }
}

function createModel(parent) {
    var newModel = someComponent.createObject(parent);
    return newModel;
}

答案 2 :(得分:0)

我像这样进行初始化:

dataObject_m1.initSystem= function() { // QML calls when ready 
  console.log( "ModulData_1.js func initSystem()");

  dataObject_m1.statisticsSystem= Qt.createQmlObject("import QtQuick 2.5; ListModel{}", dataObject_m1.parent, "dynamic_source" );
  dataObject_m1.statisticsSystem.objectName = "ModelSystem";
  dataObject_m1.statisticsSystem.append( { name: qsTr("System"), number: "", val: ""});
  dataObject_m1.statisticsSystem.append( { name: "S3500", number: "", val: ""});
  dataObject_m1.statisticsSystem.append( { name: "S3550", number: "", val: ""});
  dataObject_m1.statisticsSystem.append( { name: "S3551", number: "", val: ""});
  dataObject_m1.statisticsSystem.append( { name: "S9999", number: "", val: ""});
}    

并更新数据:

 var updateSystem = function ( numberMap , valMap) {
     console.log ("ModuleData_1.js: updateSystem" );

   for (var num in (numberMap )) {
      var j = dataObject_m1.idMap[num];
      dataObject_m1.statisticsSystem.set( j, { val : Map[num]});
      console.log ("number(" + numberMap[val]+ ") [" + String(j) + "]= numbeMap["+val+"]" )
  }
 for (var valx in (valMap)) {
     var k = dataObject_m1.idMap[valx];
     dataObject_m1.statisticsSystem.set( k, { bad : valMap[valx]});
     console.log ("val(" + valMap[valx]+ ") [" + String(k) + "]= valMap["+valx+"]" )
  }
}

访问模型的功能:

 var statisticsModelSystem= function()  {
    console.log ("ModulData_1.js: get statisticsModelSystem" );
    if ( typeof(dataObject_m1.statisticsSystem) !== 'object')
        console.error(" statisticsSystem is undefined ")

    return dataObject_m1.statisticsSystem;
}