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. How to consider only half of the image element?

How to consider only half of the image element?

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
4 Posts 2 Posters 703 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.
  • J Offline
    J Offline
    JennyAug13
    wrote on last edited by
    #1

    Hi i have following qml code with pole, wheel and root elements. I want to add half of the pole to the right hand side of the wheel. How can i break the pole element into half and keep it in the animation? It would be nice if someone guides and I am a beginner.

    import QtQuick 2.6
    import QtQuick.Window 2.2
    Window {
        visible: true!!
        width: root.width
        height: root.height
        property real halfPoleHeight: pole.height/2
        MouseArea{
            anchors.fill: parent
            onClicked: wheel.rotation += 360
        }
        Image {
            id: root
            source: "images/background.png"
            Image {
                id: pole
                //anchors.centerIn: parent
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.bottom: parent.bottom
                source: "images/pole.png"
            }
            Image {
                id: wheel
                Behavior on rotation {
                    NumberAnimation {
                        duration: 250
                    }
                }
                anchors.centerIn: parent
                source: "images/pinwheel.png"
            }
        }
    }
    ```![2_1541579695440_pinwheel.png](https://ddgobkiprc33d.cloudfront.net/bb1c428d-97b4-43fd-82d5-35c7fea9ea16.png) ![1_1541579695440_background.png](https://ddgobkiprc33d.cloudfront.net/26f1dced-c9b5-461c-b819-312944f569b6.png) ![0_1541579695440_pole.png](https://ddgobkiprc33d.cloudfront.net/53cac98e-6281-4120-a112-e9294ce8e1a8.png)
    DiracsbracketD 1 Reply Last reply
    0
    • J JennyAug13

      Hi i have following qml code with pole, wheel and root elements. I want to add half of the pole to the right hand side of the wheel. How can i break the pole element into half and keep it in the animation? It would be nice if someone guides and I am a beginner.

      import QtQuick 2.6
      import QtQuick.Window 2.2
      Window {
          visible: true!!
          width: root.width
          height: root.height
          property real halfPoleHeight: pole.height/2
          MouseArea{
              anchors.fill: parent
              onClicked: wheel.rotation += 360
          }
          Image {
              id: root
              source: "images/background.png"
              Image {
                  id: pole
                  //anchors.centerIn: parent
                  anchors.horizontalCenter: parent.horizontalCenter
                  anchors.bottom: parent.bottom
                  source: "images/pole.png"
              }
              Image {
                  id: wheel
                  Behavior on rotation {
                      NumberAnimation {
                          duration: 250
                      }
                  }
                  anchors.centerIn: parent
                  source: "images/pinwheel.png"
              }
          }
      }
      ```![2_1541579695440_pinwheel.png](https://ddgobkiprc33d.cloudfront.net/bb1c428d-97b4-43fd-82d5-35c7fea9ea16.png) ![1_1541579695440_background.png](https://ddgobkiprc33d.cloudfront.net/26f1dced-c9b5-461c-b819-312944f569b6.png) ![0_1541579695440_pole.png](https://ddgobkiprc33d.cloudfront.net/53cac98e-6281-4120-a112-e9294ce8e1a8.png)
      DiracsbracketD Offline
      DiracsbracketD Offline
      Diracsbracket
      wrote on last edited by
      #2

      @JennyAug13
      You could use anchors.horizontalCenterOffset to the pole image to slightly offset its position.

      P.S. No need to embed the pole and wheel images inside the root image. Just declare them alongside each other.

      J 1 Reply Last reply
      0
      • DiracsbracketD Diracsbracket

        @JennyAug13
        You could use anchors.horizontalCenterOffset to the pole image to slightly offset its position.

        P.S. No need to embed the pole and wheel images inside the root image. Just declare them alongside each other.

        J Offline
        J Offline
        JennyAug13
        wrote on last edited by
        #3

        @Diracsbracket Yeah. I tried, i can have two poles now, by using anchors.horizontalCenterOffset to the pole image to slightly offset its position. But my question is if i want to break the pole into two poles or reduce the length, can i use radius: property for my pole?

        DiracsbracketD 1 Reply Last reply
        0
        • J JennyAug13

          @Diracsbracket Yeah. I tried, i can have two poles now, by using anchors.horizontalCenterOffset to the pole image to slightly offset its position. But my question is if i want to break the pole into two poles or reduce the length, can i use radius: property for my pole?

          DiracsbracketD Offline
          DiracsbracketD Offline
          Diracsbracket
          wrote on last edited by
          #4

          @JennyAug13
          Why don't you draw the pole yourself rather than to use an off-centered .png image with non-symmetric left and right transparent margins?

          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