Search code examples
qmlqt5qtquick2qtquickcontrols

Update/repaint item manually

My question relates to Calendar but could be applied to every QML visual Item. Is there any way to repaint an Item manually?

In my case I have a Calendar with custom content(small orange digit in the cell 26):

enter image description here

To do that I use styles:

import QtQuick 2.5
import QtQuick.Window 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2

Window {
    width: 300
    height: 300
    id: window
    Calendar {
        id: calendar
        anchors.fill: parent
        property var dataArr: {26: 7}
        style: CalendarStyle {
            dayDelegate: Rectangle {
                Label {
                    text: styleData.date.getDate()
                    anchors.centerIn: parent
                }
                Label {
                    font.pixelSize: 8
                    anchors.right: parent.right
                    anchors.bottom: parent.bottom
                    width: 12
                    height: 10
                    horizontalAlignment: Text.AlignHCenter
                    text: calendar.dataArr[styleData.date.getDate()] ? calendar.dataArr[styleData.date.getDate()] : ""
                    color: "orange"
                }
            }
        }
        Component.onCompleted: {
            calendar.dataArr[26] = 8; //that doesn't work
        }
    }
}

That works fine with static array, but if I change a value in the data array it doesn't update a cell. How can I force the Calendar to update?

Solution

  • As per this the updates for bindings won't be triggered for var in this way. They have provided the solution after the example. Applying it here:

    property var dataArr: new Object( {26: 7} )
...
Component.onCompleted: {
   dataArr = new Object( {26: 8} )
}