Slider Component

Here the file Slider.qml

view source

print ?

01	import Qt 4.6

02

03	Rectangle {

04	id: slider;

05	width: 320; height: 40;

06	anchors.centerIn: parent

07	property int value: Math.round(handle.x*100/(slider.width-handle.width))

08	color: "green"

09	Rectangle {

10	id: handle; width: 40; height: 40

11	color: "red"

12	MouseRegion {

13	anchors.fill: parent

14	drag.target: parent; drag.axis: "XAxis"

15	drag.minimumX: 0; drag.maximumX: slider.width - handle.width

16

}

17

}

18

}

This is how you would use this slider (Slider.qml) components:

view source

print ?

1	import Qt 4.6

2

3	Rectangle {

4	width: 200; height: 200

5

Slider {

6	width: 120

7	anchors.centerIn: parent

8

}