Image movement

[Darq]

Hello

I want to edit the code that calls the icon. The editing is to move the developed image (icon) to the right and left from the designated image anchor point. The code specifies several images (I have, for example, 4 icons in a line and depending on which one is pressed, it should move). The icon has several states, i.e. the basic part of the name is constant, e.g. settings. States (different colors of icons) have names such as settings_activ, settings_inactiv, settings_selected, etc. How to make an icon in the _selected state move, and not move in other states?

        HmiImage {
            id: Icon
            property string postfix: "_active"
            width: 160
            height: 120
            anchors.centerIn: parent

            source: _private.getDelegateIcon(moduleDomain, iconUrl, postfix)
            fillMode: Image.PreserveAspectFit
            smooth: true
        }

        states : [
            State {
                name:"activepressed"
                when: !isActiveDomain && itemMouseArea.pressed
                PropertyChanges {target: Icon; postfix: "_activepressed"}
            },
            State {
                name:"pressed"
                when: isActiveDomain && itemMouseArea.pressed
                PropertyChanges {target: Icon; postfix: "_selectedpressed"}
            },
            State {
                name:"selected"
                when: isActiveDomain
                PropertyChanges {target: Icon; postfix: "_selected"}
            },
            State {
                name:"active"
                when: !isActiveDomain
                PropertyChanges {target: Icon; postfix: "_active"}
            }
        ]

[fcarney]

PropertyChanges {target: Icon; postfix: "_activepressed"; x: 10; y: -5}

Just provide x and y values for moving it around. When state is no longer in affect it will pop back to default.

[Darq]

@fcarney Unfortunately, specifying x and y values does not make the png file move or shift it.