QQuickView (QML) transparent pour les événements souris

Question

J'ai un grand rectangle avec un bouton centré. Je voudrais que mon rectangle soit transparent aux événements de la souris à l'exception du bouton, qui doit être cliquable. Je veux dire, je voudrais pouvoir sélectionner le code sous mon rectangle avec la souris, exactement comme si aucun Rectangle n'était affiché.

J'ai ajouté un MouseArea pour tout le gros Rect, en essayant d'ignorer les événements de souris, mais cela ne fonctionne pas. J'ai lu que 'Qt :: WA_TransparentForMouseEvents' est utilisé à cette fin, mais dans les fenêtres Qt aussi fasr que je sache, pas disponible dans mon cas.

Merci à l'avance

Mon QML est chargé de main.cpp:

QQuickView* pView = new QQuickView(); 

    pView->setSource(QUrl("qrc:/MyRect.qml")); 
    pView->setFlags(Qt::Tool | Qt::FramelessWindowHint | Qt::WindowStaysOnTopHint); 
    pView->setColor("transparent"); 
    pView->show(); 

MyRect.qml:

import QtQuick 2.0 
import QtQuick.Controls 1.4 

Rectangle { 
    width: 500 
    height: 500 

    color: "green" // it would be transparent 
    opacity: 0.5 

    Button { 
     anchors.centerIn: parent 
     height: 50; width: 50 
     onClicked: console.log("clicked"); 
    } 

    MouseArea { 
     anchors.fill: parent 
     enabled: false 
     propagateComposedEvents: true 
     hoverEnabled: false 

     // All this code I think is useless... 
     onClicked: mouse.accepted = false 
     onReleased: mouse.accepted = false 
     onEntered: mouse.accepted = false 
     onExited: mouse.accepted = false 
     onWheel: mouse.accepted = false 
    } 
} 

Answer 1

Le Rectangle est transparent aux clics de souris par défaut. Si vous emportez que MouseArea, le Button recevra clics, et tous les clics sur le Rectangle passera par son parent renfermant:

import QtQuick.Window 2.2 
import QtQuick.Dialogs 1.2 
import QtQuick 2.7 
import QtQuick.Controls 1.5 
import QtQuick.Controls.Styles 1.4 
import QtQuick.Layouts 1.3 


ApplicationWindow { 
    width: 200; height: 150; visible: true 
    property string status; 

    ColumnLayout { 
     Rectangle { 
     width:100;height:100; 

     MouseArea { 
      anchors.fill: parent 
      onClicked: status = "Enclosing Rectangle Clicked";  
     } 

     Rectangle { 
      width: 75 
      height: 75 
      color: "green" // it would be transparent 
      opacity: 0.5 
      Button { 
       anchors.centerIn: parent 
       height: 25; width: 25 
       onClicked: status = "Button clicked"; 
      } 
     } 
     } 
     Text{ text: status} 
    } 
} 

en action: