Solved Change property of Dynamic Item in grid
-
Yes of course
this is where i create it
Grid { id: grid anchors.fill: parent rows: 4 columns: 2 spacing: 50 flow: Grid.LeftToRight Component.onCompleted: { var c = Qt.createComponent("Bundle_content.qml") var i = 0 Constants.users["user"]["bundles"].forEach( function (info) { var o = c.createObject(grid) o.width = 300 o.height = 300 o.text = info["title"] o.pic = info["image"] o.v = info["title"] o.index = i i = i + 1 }) } }
and this is the component :
Item { id: i width: 300 height: 300 property alias pic: image1.source property alias text: text1.text property int index: 0 property var v: { } Rectangle { id: rectangle color: "#00000000" anchors.fill: parent Rectangle { id: rectangle1 x: 315 y: 212 width: 247 height: 217 radius: 0 gradient: Gradient { GradientStop { position: 0 color: rectangle1.gradcolor1 } GradientStop { position: 1 color: rectangle1.gradcolor2 } } border.color: "#00000000" anchors.leftMargin: 27 anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter property color gradcolor1: "transparent" property color gradcolor2: "transparent" anchors.left: parent.left Rectangle { id: rectangle2 color: "#ffffff" anchors.rightMargin: 10 anchors.leftMargin: 10 anchors.bottomMargin: 10 anchors.topMargin: 10 anchors.fill: parent } Image { id: image1 anchors.rightMargin: 5 anchors.leftMargin: 5 anchors.bottomMargin: 5 anchors.topMargin: 5 fillMode: Image.PreserveAspectCrop property bool rounded: true property bool adapt: true anchors.fill: parent layer.enabled: rounded } } Text { id: text1 x: 308 y: 264 width: 145 height: 36 text: qsTr("Error") font.bold: true anchors.horizontalCenterOffset: 1 horizontalAlignment: Text.AlignHCenter font.pixelSize: 25 anchors.horizontalCenter: parent.horizontalCenter } }
so i want to change gradcolor1 and 2 outside of the component (where the grid is ) but i can't access a particulary one .
-
Use the children property of item. e.g
for(var i=0;i<grid.children.length;i++){ grid.chidren[i].color="blue" }
MouseArea not required for every item of grid.
-
Alright great news,
I want it to be trigger when i click on of the Items, but it needs to access grid which isn't in the same file .
If i do a function and try to call it in the children it doesn't work (not recognized).Here is an easy way to do that ?
Thank you.
-
What do you mean by not in same file ? Can you give me the sample code please ?
-
the two code i sent just up .
It's from two different files (.qml)
i useQt.createComponent("Bundle_content.qml")
to create in the current file a component from another file so Bundle_content.qml
-
Objects created from Button_Component.qml becomes child of Grid. Why do you want to access the parent grid inside the child objects ? Do you want to change something in grid ?
-
I want to change the variable color gradcolor1 and gradcolor2 from the grid .
but only when the mousearea of any of the children of grid is pressed. -
Define the signal in your component. Emit the signal when you click. Catch the signal in main. Not a good idea to access the parent inside the child objects.
-
I tried to do that but the problem is that i want to change color of every component except the one clicked .
How can i send a signal saying to change color of all of it minus the one who emitted it . -
OK. You can try something similar to the following. It is simple concept to show how you can work with object.
===== main.qml ========= import QtQuick 2.11 import QtQuick.Window 2.11 Window { visible: true width: 440 height: 480 title: qsTr("Hello World") property var comp:null function changeColor(val){ for(var i=0;i<grid.children.length;i++){ var obj = grid.children[i]; if (obj.val===val){ continue; }else { obj.color = "blue" } } } Grid { id : grid spacing: 5 anchors.fill: parent Component.onCompleted: { for (var i=0;i<12;i++){ if (comp==null){ comp = Qt.createComponent("ChildElement.qml"); } var obj = comp.createObject(grid) obj.changeEveryBody.connect(changeColor); obj.val = i; } } } } ========= ChildElement.qml =============== import QtQuick 2.0 Rectangle { width: 100;height: 100;color: "red" property int val:0 signal changeEveryBody(int val); MouseArea{ anchors.fill: parent onClicked: { changeEveryBody(val) } } }
-
Thank you very much.
It worked. -
cool. please move the case to solved state