how to collapse,overlap and uncollapse 3 rectangle that i created in my app!?



  • how to collapse,overlap and uncollapse 3 rectangle that i created in my app when the mouse is on area the rectangles!?
    please see this link picture
    link text
    i want to it collapse and uncollapse from side like cards when the mouse is on area,can any one guide me!
    this is my source

    ader2 }

    import QtQuick 2.2
    import QtQuick.Window 2.1

    Window {
    visible: true
    width: 360
    height: 600
    color:"#ffffff";
    Loader { id: pageLoImage {
    id:logoimage
    source: "SpiralLogo.png"
    x:110
    y:220

        MouseArea {
            anchors.fill: parent
            onClicked: {
                Qt.quit();
            }
        }
    }
    Item {
        Timer {
            interval: 500; running: true; repeat: true
    
          onTriggered: time.text =Date().toString()
    
    
        }
    
        Text { id: time
        x:95
        y:120
    
        }
    }
    Text {
        text: qsTr("Spiral Calculator v1.0\nDevoloped by R.B\nA software for calculations,plots curves,\nmath funcions and equations")
    
        anchors.centerIn: parent
    }
    Rectangle {
        width: 100
        height: 100
        x:100
        y:100
        color: "red"
        border.color: "black"
        border.width: 5
        radius: 10
    
    }
    Rectangle {
        width: 100
        height: 100
        x:5
        y:100
        color: "steelblue"
        border.color: "black"
        border.width: 5
        radius: 10
        Text {
            color: "#00FF00"
            x:5
            y:30
            text: "<b>Calculator</b> <i>world</i>"
    
        }
        MouseArea {
            anchors.fill: parent
            onClicked: pageLoader2.source = "calculator.qml"
             //onClicked: pageLoader2.source = "main.qml"
        }
    }
    Rectangle {
        width: 100
        height: 100
        x:200
        y:100
        color: "green"
        border.color: "black"
        border.width: 5
        radius: 10
    }
    Text {id:exut
        x:10
        y:150
        text: qsTr("funcions and equations")
    
        anchors.centerIn: parent
    }
    

    }

    thanks for reply


Log in to reply
 

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