@@ -19,7 +19,7 @@ import Ubuntu.Components 1.1
19import QtGraphicalEffects 1.0
19import QtGraphicalEffects 1.0
22− id: swipeToAct
22+ id: swipeToAct
24 width: parent.width
24 width: parent.width
25 height: childrenRect.height
25 height: childrenRect.height
@@ -34,57 +34,57 @@ Item {
34 readonly property double halfWay: mouseArea.drag.maximumX / 2
34 readonly property double halfWay: mouseArea.drag.maximumX / 2
36 Rectangle {
36 Rectangle {
37− id: gradient
37+ id: gradient
38− width: parent.width * 5
38+ width: parent.width * 5
39− height: units.gu(sliderHeight)
39+ height: units.gu(sliderHeight)
40− visible: false
40+ visible: false
41− LinearGradient {
41+ LinearGradient {
42− anchors.fill: parent
42+ anchors.fill: parent
43− start: Qt.point(parent.x, parent.y)
43+ start: Qt.point(parent.x, parent.y)
44− end: Qt.point(parent.width, parent.y)
44+ end: Qt.point(parent.width, parent.y)
45− gradient: Gradient {
45+ gradient: Gradient {
46− GradientStop { position: 0.0; color: UbuntuColors.red }
46+ GradientStop { position: 0.0; color: UbuntuColors.red }
47− GradientStop { position: 0.2; color: UbuntuColors.red }
47+ GradientStop { position: 0.2; color: UbuntuColors.red }
48− GradientStop { position: 0.4; color: "#dddddd" }
48+ GradientStop { position: 0.4; color: "#dddddd" }
49− GradientStop { position: 0.6; color: "#dddddd" }
49+ GradientStop { position: 0.6; color: "#dddddd" }
50− GradientStop { position: 0.8; color: UbuntuColors.green }
50+ GradientStop { position: 0.8; color: UbuntuColors.green }
51− GradientStop { position: 1.0; color: UbuntuColors.green }
51+ GradientStop { position: 1.0; color: UbuntuColors.green }
56 ShaderEffectSource {
56 ShaderEffectSource {
57− id: effectSourceGradient
57+ id: effectSourceGradient
58− sourceItem: gradient
58+ sourceItem: gradient
59− width: gradient.width
59+ width: gradient.width
60− height: gradient.height
60+ height: gradient.height
61− sourceRect: Qt.rect(0.4 * gradient.width * (slider.x / halfWay), 0, mask.width, mask.height)
61+ sourceRect: Qt.rect(0.4 * gradient.width * (slider.x / halfWay), 0, mask.width, mask.height)
62− visible: false
62+ visible: false
63− hideSource: true
63+ hideSource: true
66 UbuntuShape {
66 UbuntuShape {
68− color: "black"
68+ color: "black"
69− width: parent.width
69+ width: parent.width
70− height: units.gu(sliderHeight)
70+ height: units.gu(sliderHeight)
71− borderSource: "none"
71+ borderSource: "none"
72− visible: false
72+ visible: false
75 ShaderEffectSource {
75 ShaderEffectSource {
76− id: effectSourceMask
76+ id: effectSourceMask
77− sourceItem: mask
77+ sourceItem: mask
78− width: mask.width
78+ width: mask.width
79− height: mask.height
79+ height: mask.height
80− visible: false
80+ visible: false
81− hideSource: true
81+ hideSource: true
84 ShaderEffect {
84 ShaderEffect {
85− width: parent.width
85+ width: parent.width
86− height: units.gu(sliderHeight)
86+ height: units.gu(sliderHeight)
87− property variant mask: effectSourceMask
87+ property variant mask: effectSourceMask
88 property variant gradient: effectSourceGradient
88 property variant gradient: effectSourceGradient
89 vertexShader: "
89 vertexShader: "
90 uniform highp mat4 qt_Matrix;
90 uniform highp mat4 qt_Matrix;
@@ -105,206 +105,205 @@ Item {
105 gl_FragColor = texGradient.rgba * texMask.a ;
105 gl_FragColor = texGradient.rgba * texMask.a ;
110− anchors.fill: parent
110+ anchors.fill: parent
111− spacing: gap
111+ spacing: gap
112− anchors.margins: gap
112+ anchors.margins: gap
114− UbuntuShape {
114+ UbuntuShape {
115− id: leftShape
115+ id: leftShape
116− states: [
116+ states: [
118− name: "normal"
118+ name: "normal"
119− PropertyChanges {
119+ PropertyChanges {
120− target: leftShape
120+ target: leftShape
121− color: UbuntuColors.red
121+ color: UbuntuColors.red
123− PropertyChanges {
123+ PropertyChanges {
124− target: innerLeftShape
124+ target: innerLeftShape
125− color: UbuntuColors.red
125+ color: UbuntuColors.red
126− visible: false
126+ visible: false
130− name: "selected"
130+ name: "selected"
131− PropertyChanges {
131+ PropertyChanges {
132− target: leftShape
132+ target: leftShape
133− color: "white"
133+ color: "white"
135− PropertyChanges {
135+ PropertyChanges {
136− target: innerLeftShape
136+ target: innerLeftShape
137− color: UbuntuColors.red
137+ color: UbuntuColors.red
138− visible: true
138+ visible: true
142− state: "normal"
142+ state: "normal"
143− height: units.gu(4)
143+ height: units.gu(4)
144− width: units.gu(7)
144+ width: units.gu(7)
145− borderSource: "none"
145+ borderSource: "none"
146− opacity: slider.x <= halfWay ? 1.0 : 1.0 - ((slider.x - halfWay) / halfWay)
146+ opacity: slider.x <= halfWay ? 1.0 : 1.0 - ((slider.x - halfWay) / halfWay)
147− UbuntuShape {
147+ UbuntuShape {
148− id: innerLeftShape
148+ id: innerLeftShape
149− anchors.centerIn: parent
149+ anchors.centerIn: parent
150− borderSource: "none"
150+ borderSource: "none"
151− width: parent.width - units.gu(.5)
151+ width: parent.width - units.gu(.5)
152− height: parent.height - units.gu(.5)
152+ height: parent.height - units.gu(.5)
155− anchors.centerIn: parent
155+ anchors.centerIn: parent
156− width: units.gu(2)
156+ width: units.gu(2)
157− height: units.gu(2)
157+ height: units.gu(2)
158− name: leftIconName
158+ name: leftIconName
159− color: "white"
159+ color: "white"
163− Rectangle {
163+ Rectangle {
164− id: leftSpacer
164+ id: leftSpacer
165− width: (row.width - (leftShape.width + slider.width + rightShape.width + 4 * row.spacing)) / 2
165+ width: (row.width - (leftShape.width + slider.width + rightShape.width + 4 * row.spacing)) / 2
166− height: units.gu(4)
166+ height: units.gu(4)
167− opacity: 0
167+ opacity: 0
170− UbuntuShape {
170+ UbuntuShape {
171− id: slider
171+ id: slider
172− objectName: "slider"
172+ objectName: "slider"
174− Behavior on x {
174+ Behavior on x {
175− UbuntuNumberAnimation {
175+ UbuntuNumberAnimation {
176− duration: UbuntuAnimation.FastDuration
176+ duration: UbuntuAnimation.FastDuration
177− easing.type: Easing.OutBounce
177+ easing.type: Easing.OutBounce
181− Behavior on opacity {
181+ Behavior on opacity {
182− UbuntuNumberAnimation {
182+ UbuntuNumberAnimation {
183− duration: UbuntuAnimation.FastDuration
183+ duration: UbuntuAnimation.FastDuration
187− onOpacityChanged: {
187+ onOpacityChanged: {
188− if (opacity === 0) {
188+ if (opacity === 0) {
189− if (rightShape.state === "selected") {
189+ if (rightShape.state === "selected") {
190− rightTriggered()
190+ rightTriggered()
192− if (leftShape.state === "selected") {
192+ if (leftShape.state === "selected") {
193− leftTriggered()
193+ leftTriggered()
199− color: "white"
199+ color: "white"
200− height: units.gu(4)
200+ height: units.gu(4)
201− width: units.gu(7)
201+ width: units.gu(7)
202− borderSource: "none"
202+ borderSource: "none"
204− anchors.fill: parent
204+ anchors.fill: parent
205− spacing: 2 * gap
205+ spacing: 2 * gap
206− anchors.leftMargin: units.gu(.5)
206+ anchors.leftMargin: units.gu(.5)
207− anchors.rightMargin: units.gu(.5)
207+ anchors.rightMargin: units.gu(.5)
209− anchors.verticalCenter: parent.verticalCenter
209+ anchors.verticalCenter: parent.verticalCenter
210− name: "back"
210+ name: "back"
211− width: units.gu(2)
211+ width: units.gu(2)
212− height: units.gu(2)
212+ height: units.gu(2)
215− anchors.verticalCenter: parent.verticalCenter
215+ anchors.verticalCenter: parent.verticalCenter
216− name: "next"
216+ name: "next"
217− width: units.gu(2)
217+ width: units.gu(2)
218− height: units.gu(2)
218+ height: units.gu(2)
223− Rectangle {
223+ Rectangle {
224− id: rightSpacer
224+ id: rightSpacer
225− width: leftSpacer.width
225+ width: leftSpacer.width
226− height: units.gu(4)
226+ height: units.gu(4)
227− opacity: 0
227+ opacity: 0
230− UbuntuShape {
230+ UbuntuShape {
231− id: rightShape
231+ id: rightShape
232− states: [
232+ states: [
234− name: "normal"
234+ name: "normal"
235− PropertyChanges {
235+ PropertyChanges {
236− target: rightShape
236+ target: rightShape
237− color: UbuntuColors.green
237+ color: UbuntuColors.green
239− PropertyChanges {
239+ PropertyChanges {
240− target: innerRightShape
240+ target: innerRightShape
241− color: UbuntuColors.green
241+ color: UbuntuColors.green
242− visible: false
242+ visible: false
246− name: "selected"
246+ name: "selected"
247− PropertyChanges {
247+ PropertyChanges {
248− target: rightShape
248+ target: rightShape
249− color: "white"
249+ color: "white"
251− PropertyChanges {
251+ PropertyChanges {
252− target: innerRightShape
252+ target: innerRightShape
253− color: UbuntuColors.green
253+ color: UbuntuColors.green
254− visible: true
254+ visible: true
258− state: "normal"
258+ state: "normal"
259− height: units.gu(4)
259+ height: units.gu(4)
260− width: units.gu(7)
260+ width: units.gu(7)
261− borderSource: "none"
261+ borderSource: "none"
262− opacity: slider.x >= halfWay ? 1.0 : slider.x / halfWay
262+ opacity: slider.x >= halfWay ? 1.0 : slider.x / halfWay
263− UbuntuShape {
263+ UbuntuShape {
264− id: innerRightShape
264+ id: innerRightShape
265− anchors.centerIn: parent
265+ anchors.centerIn: parent
266− borderSource: "none"
266+ borderSource: "none"
267− width: parent.width - units.gu(.5)
267+ width: parent.width - units.gu(.5)
268− height: parent.height - units.gu(.5)
268+ height: parent.height - units.gu(.5)
271− anchors.centerIn: parent
271+ anchors.centerIn: parent
272− width: units.gu(2)
272+ width: units.gu(2)
273− height: units.gu(2)
273+ height: units.gu(2)
274− name: rightIconName
274+ name: rightIconName
275− color: "white"
275+ color: "white"
280− MouseArea {
280+ MouseArea {
281− id: mouseArea
281+ id: mouseArea
282 objectName: "swipeMouseArea"
282 objectName: "swipeMouseArea"
284− anchors.fill: row
284+ anchors.fill: row
285− drag.target: slider
285+ drag.target: slider
286− drag.axis: Drag.XAxis
286+ drag.axis: Drag.XAxis
287− drag.minimumX: 0
287+ drag.minimumX: 0
288− drag.maximumX: row.width - slider.width
288+ drag.maximumX: row.width - slider.width
290− onReleased: {
290+ onReleased: {
291− if (slider.x !== drag.minimumX || slider.x !== drag.maximumX) {
291+ if (slider.x !== drag.minimumX || slider.x !== drag.maximumX) {
292− slider.x = halfWay
292+ slider.x = halfWay
294− if (slider.x === drag.minimumX) {
294+ if (slider.x === drag.minimumX) {
295− slider.x = drag.minimumX
295+ slider.x = drag.minimumX
296− slider.opacity = 0
296+ slider.opacity = 0
297− enabled = false
297+ enabled = false
298− leftShape.state = "selected"
298+ leftShape.state = "selected"
300− if (slider.x === drag.maximumX) {
300+ if (slider.x === drag.maximumX) {
301− slider.x = drag.maximumX
301+ slider.x = drag.maximumX
302− slider.opacity = 0
302+ slider.opacity = 0
303− enabled = false
303+ enabled = false
304− rightShape.state = "selected"
304+ rightShape.state = "selected"