[SOLVED] Different transformOrigin point during RotationAnimaton other than the one Item provides

Piyush Gupta

I'm trying to make it so an image I have rotates with a different transformOriginPoint. I tried following the advice listed in https://forum.qt.io/topic/12433/custom-transform-origin-point-during-rotation but I was only able to use it for static rotation and not RotationAnimation. Any idea as to how I can make it rotate around say (100,100)?

Item{
    id: fishItem
    width: 159
    height: 130
    anchors.centerIn: parent
    // transformOrigin: Item.Center, need this to be something other than Item.TopLeft, Item.Center, etc

    Image {
        id: fishImage
        width: 159
        height: 139
        source: "fish1.png"
        anchors.fill: parent
    }

    RotationAnimation on rotation {
        from: 0
        to: 360
        duration: 5000
        running: true
        loops: Animation.Infinite
    }
}

p3c0

Hi @Piyush-Gupta and Welcome,
You can use Transform instead and perform animation on angle property. To set rotation around a point use origin.x and origin.y properties. For eg:

Image {
    id: fishImage
    source: "fish1.png"
    anchors.centerIn: parent
    transform: Rotation {
        origin.x: 100
        origin.y: 100
        RotationAnimation on angle {
            from: 0
            to: 360
            duration: 5000
            running: true
            loops: Animation.Infinite
        }
    }
}

Piyush Gupta

Thanks that did exactly what I needed.