How to set value to dynamically loaded component?
-
I could load components dynamically, but can't set value to each component.
How to set value to each property of component from property of model ?import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.15 Item { ListModel{ id:model_params ListElement{ _type:"spin" _name:"paramA" _val:5 } ListElement{ _type:"spin" _name:"paramB" _val:34 } ListElement{ _type:"combo" _name:"paramC_COMBO" _val:1 _choice:[ ListElement{ _elem:"A" }, ListElement{ _elem:"B" } ] } } anchors.centerIn: parent width:parent.width height:parent.height-80 anchors.fill: parent GridView{ id:grid width:parent.width;height:parent.height anchors.fill: parent model:model_params cellWidth:parent.width/3 cellHeight:parent.height/10 reuseItems:true flow:GridView.FlowTopToBottom delegate:Component{ Loader{ width:parent.width sourceComponent: _type==="spin"?spinbox:combobox //how to set value to each property of component from property of model ? // } } } Component{ id:spinbox Row{ property string name:"dummyParamName" Label{ text:parent.name } SpinBox{ width:parent.width*0.5 } } } Component{ id:combobox ComboBox{ property string name:"dummyParamName" width:100 displayText: name model:["dummy1","dummy2"] } } }
-
@ynatynat I think the issue is that dynamically loaded components don't get direct access to what you might expect to be the
Loader
's parent context. They can access properties defined locally to theLoader
however and theLoader
itself can access the parent scope. Therefore, in order to pass model properties to the loaded components I think you need to introduce intermediate properties local to theLoader
:delegate:Component{ Loader{ width:parent.width // "Forward" the _name field from the model to loaded // components via this locally defined property. "name" is // accessible in the loaded components. property string name: _name ...
-
@Bob64
Thank you for your comment.
I can set name & val to each component .
But I couldn't set model of ComboBox from loader.
Do you know how to set?import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.15 Item { ListModel{ id:model_params ListElement{ _type:"spin" _name:"paramA" _val:5 _choice:"" } ListElement{ _type:"spin" _name:"paramB" _val:34 _choice:"" } ListElement{ _type:"combo" _name:"paramC_COMBO" _val:1 _choice:[ ListElement{ _elem:"A" }, ListElement{ _elem:"B" } ] } } anchors.centerIn: parent width:parent.width height:parent.height-80 anchors.fill: parent GridView{ id:grid width:parent.width;height:parent.height anchors.fill: parent model:model_params cellWidth:parent.width/3 cellHeight:parent.height/10 reuseItems:true flow:GridView.FlowTopToBottom delegate:Component{ Loader{ id:loader width:parent.width property string name:_name property int val:_val property var choice:_choice// <-ERROR " Can't assign to existing role '_choice' of different type [List -> String]" sourceComponent: _type==="spin"?spinbox:combobox onLoaded:{ console.log("Loaded") } } } } Component{ id:spinbox Row{ //property string name:"dummyParamName"//<--------Don't set property in each component Label{ text:name// <-Just [name] is able to acccessed from loader } SpinBox{ width:parent.width*0.5 value:val } } } Component{ id:combobox ComboBox{ //property string name:"dummyParamName"//<--------Don't set property in each component width:100 displayText: name// <-Just [name] is able to acccessed from loader model:choice// <-ERROR " Can't assign to existing role '_choice' of different type [List -> String]" } } }
-
@ynatynat I am not by any means an expert and someone might correct me, but I suspect that you cannot do what you have done there and nest a list of
ListElement
s in aListElement
. Have you tried using a straightforward list of strings as the options model for your combo?