How to change properties of random repeater's children
Unsolved
QML and Qt Quick
-
I have a grid that is like this:
property variant colorArray: ["#00bde3", "#67c111", "#ea7025"] ... Grid{ rows: 5 columns: 5 spacing: 5 anchors.centerIn: parent Repeater{ id: gridRect model: 25 Rectangle{ id: rect width: 50 height: width color: "white" radius: 5 Text { id: tttt anchors.centerIn: parent color: "lightBlue" text : index } MouseArea{ anchors.fill: parent } } } }
and I want to change the color of rect elements in the grid and the text randomly so I made these timers:
Timer { id: alfa interval: 500; running: true; repeat: true onTriggered: { /*if random square not white , a color from color array is picked to change it else random square.color = "white"*/ } } Timer { id: beta interval: 1000; running: true; repeat: true onTriggered: { //changes the text of a random tttt element in the grid } }
but I don't know how to access these elements individually, I tried many things but it all failed, and using a property seemed to change the whole grid color & text not a single square, I can't understand how to access nested elements and repeaters children at all what should I do?
-
All the elements defined inside the repeater becomes child of your Grid. So you can access the grid children using <id>.children[] property.
for (var i=0;i<grid.children.length;i++) { var obj = grid.children[i]; obj.color = "green" }
-
Hi @newbiSoso ,
- You can also use a ListModel and assign it to the repeater.
Your code with sample model:-
property variant colorArray: ["cyan","#00bde3", "#67c111", "#ea7025"] ListModel { id: dummyModel ListElement { squareColor: "white" txt: "Hello" } ListElement { squareColor: "white" txt: "Hello" } ListElement { squareColor: "white" txt: "Hello" } ListElement { squareColor: "white" txt: "Hello" } } Timer { id: alfa interval: 500; running: true; repeat: true onTriggered: { for (var i=0;i<dummyModel.count;i++) { if(dummyModel.get(i).squareColor === "white") { dummyModel.setProperty(i,"squareColor",colorArray[i]) } else { dummyModel.setProperty(i,"squareColor","white") } } } } Timer { id: beta interval: 1000; running: true; repeat: true onTriggered: { for (var i=0;i<dummyModel.count;i++) { if(dummyModel.get(i).txt === "Hello") { dummyModel.setProperty(i,"txt","Bye") } else { dummyModel.setProperty(i,"txt","Hello") } } } } Grid{ id: grid rows: 2 columns: 2 spacing: 5 anchors.centerIn: parent Repeater{ id: gridRect model: dummyModel Rectangle{ id: rect width: 50 height: width color: squareColor radius: 5 Text { id: tttt anchors.centerIn: parent color: "lightBlue" text : txt } MouseArea{ anchors.fill: parent } } } }
Sample Output:-
For more information about ListModel[https://doc.qt.io/qt-5/qml-qtqml-models-listmodel.html]