43 import "../common" as Common |
43 import "../common" as Common |
44 |
44 |
45 Flipable { |
45 Flipable { |
46 id: container |
46 id: container |
47 |
47 |
48 property variant frontContainer: containerFront |
48 property alias frontContainer: containerFront |
49 property string photoTitle: "" |
49 property string photoTitle: "" |
50 property string photoTags: "" |
50 property string photoTags: "" |
51 property int photoWidth |
51 property int photoWidth |
52 property int photoHeight |
52 property int photoHeight |
53 property string photoType |
53 property string photoType |
74 } |
74 } |
75 |
75 |
76 Column { |
76 Column { |
77 spacing: 10 |
77 spacing: 10 |
78 anchors { |
78 anchors { |
79 left: parent.left; leftMargin: 20 |
79 left: parent.left; leftMargin: 10 |
80 right: parent.right; rightMargin: 20 |
80 right: parent.right; rightMargin: 10 |
81 top: parent.top; topMargin: 180 |
81 top: parent.top; topMargin: 120 |
82 } |
82 } |
83 Text { font.bold: true; color: "white"; elide: Text.ElideRight; text: container.photoTitle } |
83 Text { font.bold: true; color: "white"; elide: Text.ElideRight; text: container.photoTitle; width: parent.width } |
84 Text { color: "white"; elide: Text.ElideRight; text: "<b>Size:</b> " + container.photoWidth + 'x' + container.photoHeight } |
84 Text { color: "white"; elide: Text.ElideRight; text: "Size: " + container.photoWidth + 'x' + container.photoHeight; width: parent.width } |
85 Text { color: "white"; elide: Text.ElideRight; text: "<b>Type:</b> " + container.photoType } |
85 Text { color: "white"; elide: Text.ElideRight; text: "Type: " + container.photoType; width: parent.width } |
86 Text { color: "white"; elide: Text.ElideRight; text: "<b>Author:</b> " + container.photoAuthor } |
86 Text { color: "white"; elide: Text.ElideRight; text: "Author: " + container.photoAuthor; width: parent.width } |
87 Text { color: "white"; elide: Text.ElideRight; text: "<b>Published:</b> " + container.photoDate } |
87 Text { color: "white"; elide: Text.ElideRight; text: "Published: " + container.photoDate; width: parent.width } |
88 Text { color: "white"; elide: Text.ElideRight; text: container.photoTags == "" ? "" : "<b>Tags:</b> " } |
88 Text { color: "white"; elide: Text.ElideRight; text: container.photoTags == "" ? "" : "Tags: "; width: parent.width } |
89 Text { color: "white"; elide: Text.ElideRight; text: container.photoTags } |
89 Text { color: "white"; elide: Text.ElideRight; text: container.photoTags; width: parent.width } |
90 } |
90 } |
91 } |
91 } |
92 |
92 |
93 back: Item { |
93 back: Item { |
94 anchors.fill: container |
94 anchors.fill: container |
102 |
102 |
103 Flickable { |
103 Flickable { |
104 id: flickable; anchors.fill: parent; clip: true |
104 id: flickable; anchors.fill: parent; clip: true |
105 contentWidth: imageContainer.width; contentHeight: imageContainer.height |
105 contentWidth: imageContainer.width; contentHeight: imageContainer.height |
106 |
106 |
|
107 function updateMinimumScale() { |
|
108 if (bigImage.status == Image.Ready && bigImage.width != 0) { |
|
109 slider.minimum = Math.min(flickable.width / bigImage.width, flickable.height / bigImage.height); |
|
110 if (bigImage.width * slider.value > flickable.width) { |
|
111 var xoff = (flickable.width/2 + flickable.contentX) * slider.value / prevScale; |
|
112 flickable.contentX = xoff - flickable.width/2; |
|
113 } |
|
114 if (bigImage.height * slider.value > flickable.height) { |
|
115 var yoff = (flickable.height/2 + flickable.contentY) * slider.value / prevScale; |
|
116 flickable.contentY = yoff - flickable.height/2; |
|
117 } |
|
118 prevScale = slider.value; |
|
119 } |
|
120 } |
|
121 |
|
122 onWidthChanged: updateMinimumScale() |
|
123 onHeightChanged: updateMinimumScale() |
|
124 |
107 Item { |
125 Item { |
108 id: imageContainer |
126 id: imageContainer |
109 width: Math.max(bigImage.width * bigImage.scale, flickable.width); |
127 width: Math.max(bigImage.width * bigImage.scale, flickable.width); |
110 height: Math.max(bigImage.height * bigImage.scale, flickable.height); |
128 height: Math.max(bigImage.height * bigImage.scale, flickable.height); |
111 |
129 |
112 Image { |
130 Image { |
113 id: bigImage; source: container.photoUrl; scale: slider.value |
131 id: bigImage; source: container.photoUrl; scale: slider.value |
114 anchors.centerIn: parent; smooth: !flickable.movingVertically |
132 anchors.centerIn: parent; smooth: !flickable.movingVertically |
115 onStatusChanged : { |
133 onStatusChanged : { |
116 // Default scale shows the entire image. |
134 // Default scale shows the entire image. |
117 if (status == Image.Ready && width != 0) { |
135 if (bigImage.status == Image.Ready && bigImage.width != 0) { |
118 slider.minimum = Math.min(flickable.width / width, flickable.height / height); |
136 slider.minimum = Math.min(flickable.width / bigImage.width, flickable.height / bigImage.height); |
119 prevScale = Math.min(slider.minimum, 1); |
137 prevScale = Math.min(slider.minimum, 1); |
120 slider.value = prevScale; |
138 slider.value = prevScale; |
121 } |
139 } |
122 } |
140 } |
123 } |
141 } |