Rectangle rotation and width depends on mouse position



  • Hi guys! I have here a QML:

    @import QtQuick 1.0

    Rectangle {
    property alias running: tmr.running
    property alias angle: linerotation.angle
    x: 0; y: 0
    width: 20
    height: 20
    color: "#006903"
    radius: 9
    border.width: 2
    transform:
    Rotation {
    id: linerotation
    }
    Timer {
    id: tmr
    interval: 10000
    onTriggered: {rect.noofline--;parent.destroy()}
    }
    }@

    and the screen:

    @import QtQuick 1.0
    import "game.js" as Game

    Rectangle {
    id: rect
    width: 360
    height: 360

    property int noofline: 0
    
    MouseArea {
        id: linearea
        anchors.fill: parent
        z: 2
        onPressed: {
            Game.func(mouse, mouseX, mouseY)
        }
        onMousePositionChanged: {
            Game.func2(mouse)
        }
        onReleased: {
            Game.func3()
        }
    }
    

    }@

    and the javascript file:

    @var component
    var object = null;
    var tempX
    var tempY

    function func(mouse, x, y) {
    if (noofline < 3) {
    var component = Qt.createComponent("Line.qml")
    object = component.createObject(rect)
    object.x = mouse.x - object.width / 2
    object.y = mouse.y - object.height / 2
    noofline++
    tempX = x
    tempY = y
    }
    }

    function func2(mouse) {
    if ((object.angle >= 0 && object.angle < 90) || (object.angle > 270 && object.angle <= 360)) {
    if (mouse.x > tempX) {
    object.width += (mouse.x - tempX)
    } else {
    if (object.width - (tempX - mouse.x) > 20)
    object.width -= (tempX - mouse.x)
    }
    }
    if (mouse.y > tempY) {
    object.angle += (mouse.y - tempY)
    } else {
    object.angle -= (tempY - mouse.y)
    }
    tempX = mouse.x
    tempY = mouse.y
    }
    function func3() {
    if (object != null) {
    object.running = true
    object = null
    }
    }
    @

    what I have done as of now is moving in the x axis changes the width of the created rectangle and moving on the y axis rotates it.. (just made a test on how to do this)

    what I need to do is change its rotation while at the same time change its width (or height if that's better) while the mouse position is changed.. any thoughts on this? thank you.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.