title: QML - MouseArea/MouseEvent issue
body: <p>The following piece of code generates a white rectangle containing a red rectangle and a grey rectangle. Every rectangle has an associated MouseArea. The grey rectangle becomes blue when the mouse is clicked inside it. The red rectangle prints a console message when the mouse cursor enters inside it and another message when the released signal is emitted. </p>
  
  <p>I would like to:</p>
  
  <ol>
  <li>press and hold the mouse button inside the grey rectangle (becoming blue)</li>
  <li>move the cursor outside the grey/blue rectangle and then inside the red rectangle, without releasing the button and capturing the entered signal of the red rectangle</li>
  <li>release the button having the cursor inside the red rectangle and capturing the released signal of the red rectangle.</li>
  </ol>
  
  <p>Is it possible? With the current code, the entered signal of the red rectangle is only emitted if the mopuse button is not pressed while entering and the released signal is only emitted if the button was pressed inside that rectangle. The problem, evidently, is that the grey/blue rectangle takes the control of mouse events if the button is pressed there.</p>
  
  <p>This is a similar, but simplified, scenario to the one I am having in an application I am developing.</p>
  
  <pre><code>import QtQuick 2.0
  
  Rectangle{
      color: "white"
      height: 210
      width: 500
  
      MouseArea{
        id: mainMa
        anchors.fill: parent
        hoverEnabled: true
        onReleased:{console.log("white-released")}
     }
  
     Column{
         spacing: 10
         Rectangle{
             color: "red"
             height: 100
             width: 500
            MouseArea{
               anchors.fill: parent
               hoverEnabled: true
               propagateComposedEvents: true
               onEntered:{console.log("red-enter")}
               onReleased:{console.log("red-released")}
            }
         }
  
         Rectangle{
             color: "#666666"
             height: 100
             width: 500
             MouseArea{
                 id: ma
                 anchors.fill: parent
                 hoverEnabled: true
                 onPressed: {parent.color = "blue"; console.log("grey pressed")}
                 onReleased: {parent.color = "#666666"; console.log("grey released")}
             }
         }
     }
  </code></pre>
  
  <p>}</p>