8 // of the height of the view. |
8 // of the height of the view. |
9 // orientation can be either 'Vertical' or 'Horizontal' |
9 // orientation can be either 'Vertical' or 'Horizontal' |
10 property real position |
10 property real position |
11 property real pageSize |
11 property real pageSize |
12 property var orientation : "Vertical" |
12 property var orientation : "Vertical" |
|
13 property alias bgColor: background.color |
|
14 property alias fgColor: thumb.color |
13 |
15 |
14 // A light, semi-transparent background |
16 // A light, semi-transparent background |
15 Rectangle { |
17 Rectangle { |
16 id: background |
18 id: background |
17 radius: orientation == 'Vertical' ? (width/2 - 1) : (height/2 - 1) |
19 radius: orientation == 'Vertical' ? (width/2 - 1) : (height/2 - 1) |
18 color: "white"; opacity: 0.3 |
20 color: "white"; opacity: 0.3 |
19 anchors.fill: parent |
21 anchors.fill: parent |
20 } |
22 } |
21 // Size the bar to the required size, depending upon the orientation. |
23 // Size the bar to the required size, depending upon the orientation. |
22 Rectangle { |
24 Rectangle { |
|
25 id: thumb |
23 opacity: 0.7 |
26 opacity: 0.7 |
24 color: "black" |
27 color: "black" |
25 radius: orientation == 'Vertical' ? (width/2 - 1) : (height/2 - 1) |
28 radius: orientation == 'Vertical' ? (width/2 - 1) : (height/2 - 1) |
26 x: orientation == 'Vertical' ? 1 : (scrollBar.position * (scrollBar.width-2) + 1) |
29 x: orientation == 'Vertical' ? 1 : (scrollBar.position * (scrollBar.width-2) + 1) |
27 y: orientation == 'Vertical' ? (scrollBar.position * (scrollBar.height-2) + 1) : 1 |
30 y: orientation == 'Vertical' ? (scrollBar.position * (scrollBar.height-2) + 1) : 1 |