Transition in art on load

Change-Id: I5a8682617ba9347a4416d2de20fd9ad439994945

qml/common/ArtImage.qml

@@ -1,24 +1,39 @@
 import QtQuick 2.5
 import PictureModel 1.0
 
-Image {
+Rectangle {
     property var effect
     property int modelIndex
 
-    asynchronous: true
-    fillMode: Image.PreserveAspectFit
-    //fillMode: Image.PreserveAspectCrop
-
-    source: imageModel.data(modelIndex)
+    color: "black"
 
     height: width/imageModel.data(modelIndex, PictureModel.RatioRole)
     width: parent.width
 
-    mirror: globalSettings.randomlyMirrorArt && (Math.random() < 0.5)
-    smooth: globalSettings.smoothArt
+    Image {
+        opacity: 0
+        anchors.fill: parent
+        asynchronous: true
+        fillMode: Image.PreserveAspectFit
+
+        source: imageModel.data(modelIndex)
+
+        mirror: globalSettings.randomlyMirrorArt && (Math.random() < 0.5)
+        smooth: globalSettings.smoothArt
 
-    sourceSize.height: height
-    sourceSize.width: width
+        sourceSize.height: height
+        sourceSize.width: width
+
+        Behavior on opacity {
+            NumberAnimation { duration: 1000 }
+        }
+
+        onStatusChanged: {
+            if (status === Image.Ready) {
+                opacity = 1
+            }
+        }
+    }
 
     Component.onCompleted: {
         modelIndex = Math.floor(Math.random()*imageModel.count)