title: QML: How to make nice transition effect between image sources (one fades into the other)?
body: <p>I wonder how to make smooth transitions betwen image sources in QML, I try</p>
  
  <pre><code>import QtQuick 1.1
  Image {
     id: rect
     source:  "quit.png"
     smooth: true
     MouseArea {
         id: mouseArea
         anchors.fill: parent
         anchors.margins: -10
         hoverEnabled: true         //this line will enable mouseArea.containsMouse
         onClicked: Qt.quit()
     }
  
      states: State {
          name: "mouse-over"; when: mouseArea.containsMouse
          PropertyChanges { target: rect; scale: 0.8; source :"quit2.png" }
      }
  
      transitions: Transition {
          NumberAnimation { properties: "scale, source"; easing.type: Easing.InOutQuad; duration: 1000  }
      }
  }
  </code></pre>
  
  <p>But It does not work on source as a transition just as final state change.. so I wonder how to make one image source fade into andothe and back?</p>