diff -r ef0373b55136 -r 758a864f9613 demos/declarative/flickr/common/Slider.qml --- a/demos/declarative/flickr/common/Slider.qml Fri Sep 17 08:34:18 2010 +0300 +++ b/demos/declarative/flickr/common/Slider.qml Mon Oct 04 01:19:32 2010 +0300 @@ -45,11 +45,24 @@ id: slider; width: 400; height: 16 // value is read/write. - property real value - onValueChanged: { handle.x = 2 + (value - minimum) * slider.xMax / (maximum - minimum); } + property real value: 1 + onValueChanged: updatePos(); property real maximum: 1 property real minimum: 1 - property int xMax: slider.width - handle.width - 4 + property int xMax: width - handle.width - 4 + onXMaxChanged: updatePos(); + onMinimumChanged: updatePos(); + + function updatePos() { + if (maximum > minimum) { + var pos = 2 + (value - minimum) * slider.xMax / (maximum - minimum); + pos = Math.min(pos, width - handle.width - 2); + pos = Math.max(pos, 2); + handle.x = pos; + } else { + handle.x = 2; + } + } Rectangle { anchors.fill: parent @@ -62,13 +75,14 @@ Rectangle { id: handle; smooth: true - x: slider.width / 2 - handle.width / 2; y: 2; width: 30; height: slider.height-4; radius: 6 + y: 2; width: 30; height: slider.height-4; radius: 6 gradient: Gradient { GradientStop { position: 0.0; color: "lightgray" } GradientStop { position: 1.0; color: "gray" } } MouseArea { + id: mouse anchors.fill: parent; drag.target: parent drag.axis: Drag.XAxis; drag.minimumX: 2; drag.maximumX: slider.xMax+2 onPositionChanged: { value = (maximum - minimum) * (handle.x-2) / slider.xMax + minimum; }