git.iko.soy/unity8
on f2ee9e5 help sign in
unity8/Components/LazyImage.qml
172 lines 5.7 kB history raw
1/*
2 * Copyright (C) 2013 Canonical, Ltd.
3 *
4 * Authors:
5 * Michał Sawicz <michal.sawicz@canonical.com>
6 *
7 * This program is free software; you can redistribute it and/or modify
8 * it under the terms of the GNU General Public License as published by
9 * the Free Software Foundation; version 3.
10 *
11 * This program is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14 * GNU General Public License for more details.
15 *
16 * You should have received a copy of the GNU General Public License
17 * along with this program. If not, see <http://www.gnu.org/licenses/>.
18 */
20import QtQuick 2.0
21import Ubuntu.Components 0.1
23Item {
24 id: root
26 property url source
27 // TODO convert into enums when available in QML
28 property string scaleTo
30 property real initialWidth: units.gu(10)
31 property real initialHeight: units.gu(10)
33 property alias sourceSize: image.sourceSize
34 property alias fillMode: image.fillMode
35 property alias asynchronous: image.asynchronous
36 property alias cache: image.cache
37 property alias horizontalAlignment: image.horizontalAlignment
38 property alias verticalAlignment: image.verticalAlignment
40 state: "default"
42 onSourceChanged: {
43 if (state === "ready") {
44 state = "default";
45 image.nextSource = source;
46 } else {
47 image.source = source;
48 }
49 }
51 UbuntuShape {
52 id: placeholder
53 objectName: "placeholder"
54 color: "#22FFFFFF"
55 anchors.fill: parent
56 visible: opacity != 0
58 ActivityIndicator {
59 id: activity
60 anchors.centerIn: parent
61 opacity: 0
62 visible: opacity != 0
64 running: visible
65 }
67 Image {
68 id: errorImage
69 objectName: "errorImage"
70 anchors.centerIn: parent
71 opacity: 0
72 visible: opacity != 0
74 source: "graphics/close.png"
75 sourceSize { width: units.gu(3); height: units.gu(3) }
76 }
77 }
79 UbuntuShape {
80 id: shape
81 objectName: "shape"
82 anchors.fill: parent
83 opacity: 0
84 visible: opacity != 0
86 image: Image {
87 id: image
88 objectName: "image"
90 property url nextSource
92 width: root.scaleTo == "height" ? implicitWidth * root.height / implicitHeight : implicitWidth
93 height: root.scaleTo == "width" ? implicitHeight * root.width / implicitWidth : implicitHeight
94 fillMode: Image.PreserveAspectCrop
95 asynchronous: true
96 cache: false
97 horizontalAlignment: Image.AlignHCenter
98 verticalAlignment: Image.AlignVCenter
99 sourceSize.width: root.scaleTo == "width" ? root.width : 0
100 sourceSize.height: root.scaleTo == "height" ? root.height : 0
101 }
102 }
104 states: [
105 State {
106 name: "default"
107 when: image.source == ""
108 PropertyChanges { target: root; implicitWidth: root.initialWidth; implicitHeight: root.initialHeight }
109 PropertyChanges { target: errorImage; opacity: 0 }
110 },
111 State {
112 name: "loading"
113 extend: "default"
114 when: image.status === Image.Loading
115 PropertyChanges { target: activity; opacity: 1 }
116 },
117 State {
118 name: "ready"
119 when: image.status === Image.Ready && image.source != ""
120 PropertyChanges { target: root; implicitWidth: image.width; implicitHeight: image.height }
121 PropertyChanges { target: shape; opacity: 1 }
122 PropertyChanges { target: placeholder; opacity: 0 }
123 },
124 State {
125 name: "error"
126 extend: "default"
127 when: image.status === Image.Error
128 PropertyChanges { target: errorImage; opacity: 1.0 }
129 }
130 ]
132 transitions: [
133 Transition {
134 to: "ready"
135 objectName: "readyTransition"
136 SequentialAnimation {
137 PropertyAction { target: shape; property: "visible" }
138 ParallelAnimation {
139 NumberAnimation { target: shape; property: "opacity"; easing.type: Easing.Linear }
140 UbuntuNumberAnimation { target: root; properties: "implicitWidth,implicitHeight" }
141 NumberAnimation {
142 targets: [placeholder, activity, errorImage]; property: "opacity";
143 easing.type: Easing.Linear; duration: UbuntuAnimation.SnapDuration
144 }
145 }
146 }
147 },
149 Transition {
150 to: "*"
151 objectName: "genericTransition"
152 SequentialAnimation {
153 ParallelAnimation {
154 NumberAnimation { target: shape; property: "opacity"; easing.type: Easing.Linear }
155 NumberAnimation {
156 targets: [placeholder, activity, errorImage]; property: "opacity";
157 easing.type: Easing.Linear; duration: UbuntuAnimation.SnapDuration
158 }
159 UbuntuNumberAnimation { target: root; properties: "implicitWidth,implicitHeight" }
160 }
161 PropertyAction { target: shape; property: "visible" }
162 }
164 onRunningChanged: {
165 if (!running && state === "default" && image.nextSource !== "") {
166 image.source = image.nextSource;
167 image.nextSource = "";
168 }
169 }
170 }
171 ]