Flickr demo: Scale the image about the center of the visible area.

1 files changed, 17 insertions, 2 deletions

diff --git a/demos/declarative/flickr/content/ImageDetails.qml b/demos/declarative/flickr/content/ImageDetails.qml
index d575be9..b8091f2 100644
--- a/demos/declarative/flickr/content/ImageDetails.qml
+++ b/demos/declarative/flickr/content/ImageDetails.qml
@@ -12,6 +12,7 @@ Flipable {
     property string photoDate
     property string photoUrl
     property int rating: 2
+    property var prevScale: 1.0
 
     signal closed
 
@@ -93,7 +94,8 @@ Flipable {
                         // Default scale shows the entire image.
                         if (status == 0 && width != 0) {
                             Slider.minimum = Math.min(Flick.width / width, Flick.height / height);
-                            Slider.value = Math.min(Slider.minimum, 1);
+                            prevScale = Math.min(Slider.minimum, 1);
+                            Slider.value = prevScale;
                         }
                     }
                 }
@@ -109,7 +111,20 @@ Flipable {
             anchors.centeredIn: parent; color: "white"; font.bold: true
         }
 
-        Slider { id: Slider; x: 25; y: 374; visible: { BigImage.status == 0 && maximum > minimum } }
+        Slider {
+            id: Slider; x: 25; y: 374; visible: { BigImage.status == 0 && maximum > minimum }
+            onValueChanged: {
+                if (BigImage.width * value > Flick.width) {
+                    var xoff = (Flick.width/2 + Flick.xPosition) * value / prevScale;
+                    Flick.xPosition = xoff - Flick.width/2;
+                }
+                if (BigImage.height * value > Flick.height) {
+                    var yoff = (Flick.height/2 + Flick.yPosition) * value / prevScale;
+                    Flick.yPosition = yoff - Flick.height/2;
+                }
+                prevScale = value;
+            }
+        }
     }
 
     states: [