Window {
    width: 640
    height: 480
    visible: true
    Row {
        anchors.fill: parent
        Rectangle {
            width: parent.width/2
            height: parent.height
            color:"lightgray"
            Text {
                id: text1
                anchors.top: parent.top
                anchors.topMargin: 20
                anchors.horizontalCenter: parent.horizontalCenter
                text: "hover"
            }
            Rectangle {
                anchors.top: text1.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                width: 300
                height: 300
                color: "green"
                visible: hoverhHandler.hovered
                Text {
                    id: rectText
                    anchors.centerIn: parent
                    text: "green rectangle hovered"
                    visible: rectHoverHandler.hovered
                }
                Item {
                    anchors.fill: parent
                    HoverHandler {
                        id: rectHoverHandler
                    }
                }
            }
            Item {
                anchors.fill: parent
                HoverHandler {
                    id: hoverhHandler
                }
            }
        }
    }
}