QML Grid Layout dynamically create object
-
wrote on 28 Mar 2017, 15:17 last edited by haris123
I need to add some custom qml UI to GridLayout from java script.
Button{ text: "Add" onClicked: { createObject(); } } GridLayout{ id: splitView anchors.top:bt.bottom width: parent.width height:parent.height columns: 2 rows:2 } function createObject(){ var color = "red" if(splitView.children.length===0){ color = "yellow" } if(splitView.children.length===1){ color="blue"; } var component = Qt.createComponent("Control.qml"); var object = component.createObject(splitView) object._width=300; object._height=200; object._color=color; }
Where,
Control.qml
Item { property int _width; property int _height; property color _color; Rectangle{ width:300 height:300 color:_color } }
The component is creating but, each component is add over the zeroth row and column, it's not displaying on 0,1 or 1,0 or 1,1 position on each time Add button click.
-
wrote on 28 Mar 2017, 15:34 last edited by
This work for you?
Item { Button{ text: "Add" onClicked: { createObject(); } } GridLayout{ id: splitView width: parent.width height:parent.height columns: 2 rows:2 } function createObject(){ var color = "red" if(splitView.children.length===0){ color = "yellow" } if(splitView.children.length===1){ color="blue"; } var object = Qt.createQmlObject("import QtQuick 2.2; Rectangle{ width:300 height:300 color:\""+color+"\"}", splitView); } }
-
wrote on 28 Mar 2017, 15:52 last edited by
Thanks for the feedback, but how can I create object from different qml and add to gridLayout dynamically.
-
Thanks for the feedback, but how can I create object from different qml and add to gridLayout dynamically.
wrote on 28 Mar 2017, 16:21 last edited by@haris123 said in QML Grid Layout dynamically create object:
how can I create object from different qml
Like this:
component = Qt.createComponent("Sprite.qml"); sprite = component.createObject(appWindow, {"x": 100, "y": 100});
-
wrote on 29 Mar 2017, 05:16 last edited by
This also work, but the problem is the content doesn't resize automatically if I resize the Window. That's the ultimate purpose for using the GridLayout.
-
wrote on 29 Mar 2017, 07:07 last edited by
I think that is probably because you are using a fixed width and height on your items. Take a look at this http://doc.qt.io/qt-5/qml-qtquick-layouts-layout.html
-
wrote on 29 Mar 2017, 08:00 last edited by haris123
I solved the problem by by giving Layout.fillWidth property true on each time the object created. Also removed the fixed width and size.
object.Layout.fillWidth =true object.Layout.fillHeight =true
1/7