Why can't I print the score in text feild?



  • 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 when squares are clicked instead I get this in the Application output:

    <Unknown File>: Can't assign to existing role 'txt' of different type [Number -> String]
    
    

    why is that?



  • Hi @newbiSoso ,

    • Assign squareColor to property color in rect.

    • You cannot add a string to int, so as dummyModel has a integer property (txt) just add that to score.

    • Do these changes to your code:-

    Rectangle{
                id: rect
                
                width: 50
                height: width
                //####Assign squareColor
                color: squareColor
                radius: 10
                
                Text {
                    id: tttt
                    
                    anchors.centerIn: parent
                    color: "lightBlue"
                    text : txt
                }
                
                MouseArea{
                    anchors.fill: parent
                    onClicked: {
                        //####Cannot use tttt.text as its a string so use txt from dummyModel
                        if (squareColor === 'cyan')
                            score = score + txt
                        else if (squareColor === 'red')
                            score = score - txt
                    }
                }
            }
    

    Sample Output:-

    Default:-

    0_1560485712589_708381a1-7811-42f4-8bbe-1135d2378508-image.png

    Cyan Color Rect Click:-

    0_1560485764117_2d8c5c09-98d9-4ad4-abe0-c86b16ab5973-image.png

    Other Color Rect Click:-

    0_1560485805291_ea1a052b-ab0d-4811-b07f-0209adc329b8-image.png



  • Hi @newbiSoso

    • There are some modifications in your code which i tried.
    Rectangle{
        id: rect
    
        width: 50
        height: width
        color: squareColor
        radius: 10
    }
    
    • In QML you cant compare color with string as its HEX value
      So make these changes.
    MouseArea{
        anchors.fill: parent
    
        onClicked: {
            if (squareColor === "cyan")
                root.score = root.score + tttt.text;
            else if (squareColor === "red")
                root.score = root.score - tttt.text;
        }
    }
    
    • You are doing root.score + tttt.text which will be considered as string concatenation so your score will be something like below image.
      0_1560485864421_29ba1347-8ef1-45ac-afce-16ab8fe2882e-image.png
    • I dint get error as you mentioned. but please avoid using string concatenation for int +/- functionality
    • Please use the value from model txt from your code to avoid string concatenation

    All the best.


 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.