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. Drag rectangle width
Forum Updated to NodeBB v4.3 + New Features

Drag rectangle width

Scheduled Pinned Locked Moved Solved QML and Qt Quick
3 Posts 2 Posters 547 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.
  • ashajgA Offline
    ashajgA Offline
    ashajg
    wrote on last edited by
    #1

    Hi
    I want to drag a rectangle such that its position remains same but on drag width changes in the direction of drag.

    0_1548414375300_b29a71a8-7c35-4beb-8ad5-d56a856e67f2-image.png

    basically I want to drag the blue part to left side such that yellow part width will shrink.
    I tried it but cant achieve the goal. how can I do it?

    1 Reply Last reply
    0
    • dheerendraD Offline
      dheerendraD Offline
      dheerendra
      Qt Champions 2022
      wrote on last edited by
      #2

      Have drag.target as blue rect. Anchor blue to right. When you drag it change the x location of blue object well.

      Dheerendra
      @Community Service
      Certified Qt Specialist
      http://www.pthinks.com

      1 Reply Last reply
      1
      • ashajgA Offline
        ashajgA Offline
        ashajg
        wrote on last edited by
        #3

        Hi Sir
        Now its working
        I did it like this:

        import QtQuick 2.6
        import QtQuick.Window 2.2
        
        Window {
            visible: true
            width: 640
            height: 480
            title: qsTr("Hello World")
            property int oldmouseX;
            Rectangle {
                id: container
                width: 600; height: 200
                color:"black"
                Rectangle
                {
                    id:rect1
                    width: 100; height: 100
                    color: "brown"
                    anchors.right:rect.left
                    anchors.left:parent.left
                }
                Rectangle {
                    id: rect
                    width: 100; height: 100
                    color: "red"
                    
                    anchors.right:parent.right
                    
                    
                    MouseArea {
                        id:mousearea
                        anchors.fill: parent
                        onPressed:oldmouseX=mouseX
                        
                        onPositionChanged: {
                            if (pressed) {
                                rect.width = rect.width + ( oldmouseX-mouseX)
                            }
                            
                        }
                    }
                }
            }
        }
        
        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