2 * Copyright (C) 20014-2015 Canonical, Ltd.
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU General Public License as published by
6 * the Free Software Foundation; version 3.
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU General Public License for more details.
13 * You should have received a copy of the GNU General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
18 import Ubuntu.Components 1.1
23 height: childrenRect.height
25 signal leftTriggered()
26 signal rightTriggered()
28 property string leftIconName
29 property string rightIconName
34 property double opacityDelta
35 readonly property double sliderHeight: units.gu(8)
36 readonly property double gap: units.gu(1)
37 readonly property color sliderMainColor: "#b2b2b2"
38 readonly property color sliderBGColor: "#f4f4f4"
39 readonly property double halfWay: mouseArea.drag.maximumX / 2
41 UbuntuNumberAnimation on opacityDelta {
44 loops: Animation.Infinite
45 duration: UbuntuAnimation.SleepyDuration
46 easing.type: Easing.Linear
49 // linearly interpolate between start- and end-color
50 // with a normalized weight-factor
51 // 0.0 meaning just the start-color being taken into
52 // account and 1.0 only taking the end-color into
54 function interpolate(start, end, factor) {
55 var rdiff = start.r > end.r ? end.r - start.r : end.r - start.r
56 var gdiff = start.g > end.g ? end.g - start.g : end.g - start.g
57 var bdiff = start.b > end.b ? end.b - start.b : end.b - start.b
58 var adiff = start.a > end.a ? end.a - start.a : end.a - start.a
59 var r = start.r + factor * rdiff
60 var g = start.g + factor * gdiff
61 var b = start.b + factor * bdiff
62 var a = start.a + factor * adiff
63 return Qt.rgba(r,g,b,a)
70 height: priv.sliderHeight
71 color: priv.sliderBGColor
76 anchors.top: parent.top
77 anchors.left: parent.left
78 anchors.margins: priv.gap
79 color: UbuntuColors.red
86 opacity: slider.x <= priv.halfWay ? 1.0 : 1.0 - ((slider.x - priv.halfWay) / priv.halfWay)
89 anchors.centerIn: parent
98 anchors.verticalCenter: parent.verticalCenter
99 anchors.right: slider.left
100 anchors.rightMargin: units.gu(1.5)
101 spacing: -units.gu(1)
102 visible: slider.x === priv.halfWay
105 height: units.gu(2.5)
106 color: priv.sliderMainColor
107 opacity: .5 + priv.opacityDelta
111 height: units.gu(2.5)
112 color: priv.sliderMainColor
113 opacity: 1 - priv.opacityDelta
120 anchors.top: parent.top
121 anchors.margins: priv.gap
124 Component.onCompleted: {
125 xBehavior.enabled = true
131 UbuntuNumberAnimation {
132 duration: UbuntuAnimation.FastDuration
133 easing.type: Easing.OutBounce
137 Behavior on opacity {
138 UbuntuNumberAnimation {
139 duration: UbuntuAnimation.FastDuration
145 if (slider.x <= priv.gap + leftShape.width)
147 factor = (slider.x - priv.gap) / leftShape.width
148 slider.color = priv.interpolate(leftShape.color, priv.sliderMainColor, factor)
149 } else if (slider.x >= rightShape.x - slider.width) {
150 factor = (slider.x - rightShape.x + rightShape.width) / rightShape.width
151 slider.color = priv.interpolate(priv.sliderMainColor, rightShape.color, factor)
153 slider.color = priv.sliderMainColor
158 color: priv.sliderMainColor
165 anchors.margins: units.gu(1.5)
166 source: "grip-large.svg"
171 anchors.verticalCenter: parent.verticalCenter
172 anchors.left: slider.right
173 anchors.leftMargin: units.gu(1.5)
174 spacing: -units.gu(1)
175 visible: slider.x === priv.halfWay
178 height: units.gu(2.5)
179 color: priv.sliderMainColor
180 opacity: 1 - priv.opacityDelta
184 height: units.gu(2.5)
185 color: priv.sliderMainColor
186 opacity: 0.5 + priv.opacityDelta
192 anchors.top: parent.top
193 anchors.right: parent.right
194 anchors.margins: priv.gap
195 color: UbuntuColors.green
202 opacity: slider.x >= priv.halfWay ? 1.0 : slider.x / priv.halfWay
205 anchors.centerIn: parent
207 height: units.gu(3.5)
216 objectName: "swipeMouseArea"
220 drag.axis: Drag.XAxis
221 drag.minimumX: priv.gap
222 drag.maximumX: row.width - slider.width - priv.gap
225 if (slider.x !== drag.minimumX || slider.x !== drag.maximumX) {
226 slider.x = priv.halfWay
228 if (slider.x === drag.minimumX) {
229 slider.x = drag.minimumX
233 if (slider.x === drag.maximumX) {
234 slider.x = drag.maximumX