Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. [SOLVED] Different transformOrigin point during RotationAnimaton other than the one Item provides

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

Scheduled Pinned Locked Moved QML and Qt Quick
rotationanimationtransform
3 Posts 2 Posters 1.7k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • P Offline
    P Offline
    Piyush Gupta
    wrote on last edited by Piyush Gupta
    #1

    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
        }
    }
    
    p3c0P 1 Reply Last reply
    0
    • P 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
          }
      }
      
      p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      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
              }
          }
      }
      

      157

      1 Reply Last reply
      1
      • P Offline
        P Offline
        Piyush Gupta
        wrote on last edited by
        #3

        Thanks that did exactly what I needed.

        1 Reply Last reply
        0

        • Login

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved