Why can't I print the updated score? - qt

Question

I have the score defined as below to be printed on screen
property int score: 0
Text {
id: score1
text: "Score: "+ score
anchors.bottom: grid.top
font.pointSize: 20
color: "red"
}
and this list model to access and change square colors and text values in the grid
property variant colorArray: ["cyan","red","white"]
ListModel {
id: dummyModel
ListElement {
squareColor: "white"
txt: 0
}
ListElement {
squareColor: "white"
txt: 0
}
ListElement {
squareColor: "white"
txt: 0
}
ListElement {
squareColor: "white"
txt: 0
}
}
Timer {
// to change square colors randomly
id: alfa
interval: 2000; running: true; repeat: true
onTriggered: {
for (var i=0;i<dummyModel.count;i++) {
dummyModel.setProperty(i,"squareColor",colorArray[Math.floor(Math.random()*3)])
}
}
}
Timer {
// to change score values in grid element randomly
id: beta
interval: 2000; running: true; repeat: true
onTriggered: {
for (var i=0;i<dummyModel.count;i++) {
var sc = Math.floor(Math.random()*20) // random value from 0 to 20
dummyModel.setProperty(i,"txt",sc) // score in each square
}
}
}
and this grid contains colored squares, when a square is clicked and color is cyan score should be updated by the number in the text field tttt
Grid{
id: grid
rows: 2
columns:2
spacing: 5
anchors.centerIn: parent
Repeater{
id: gridRect
model: dummyModel // from a list element model
Rectangle{
id: rect
width: 50
height: width
color: "cyan"
radius: 10
Text {
id: tttt
anchors.centerIn: parent
color: "lightBlue"
text : txt
}
MouseArea{
anchors.fill: parent
onClicked: {
if (rect.color == "cyan")
score = score + tttt.text
else if (rect.color == "red")
score = score - tttt.text
}
}
}
}
}
but score can't be updated on click instead I get this error/warning:
<Unknown File>: Can't assign to existing role 'txt' of different type [Number -> String]
why is that?

Answer 1

The Text component can receive any type of data: string, number, etc. and try to convert it to string, in your case when you use txt.text you are getting that converted string. So there are 2 solutions convert the string to number, or better not use the value of the Text component but the property of the model:
// ...
Rectangle{
id: rect
width: 50
height: width
color: model.squareColor
radius: 10
Text {
id: tttt
anchors.centerIn: parent
color: "lightBlue"
text : model.txt
}
MouseArea{
anchors.fill: parent
onClicked: {
if (model.squareColor === "cyan")
score = score + model.txt
else if (model.squareColor === "red")
score = score - model.txt
}
}
}
// ...