ScrollBar: use contentItem instead of handle

Thanks to virtual resizeContent() we can finally use contentItem like
everywhere else, and cleanup the special handle item.

Change-Id: I9e52ec3ff327d19cda3d85d2e2d9b73d80442bbc
Reviewed-by: Mitch Curtis <mitch.curtis@theqtcompany.com>

7 files changed, 22 insertions, 41 deletions

diff --git a/src/imports/controls/ScrollBar.qml b/src/imports/controls/ScrollBar.qml
index 55d53191..16ac2dfc 100644
--- a/src/imports/controls/ScrollBar.qml
+++ b/src/imports/controls/ScrollBar.qml
@@ -41,14 +41,14 @@ T.ScrollBar {
     id: control
 
     implicitWidth: Math.max(background ? background.implicitWidth : 0,
-                            handle.implicitWidth + leftPadding + rightPadding)
+                            contentItem.implicitWidth + leftPadding + rightPadding)
     implicitHeight: Math.max(background ? background.implicitHeight : 0,
-                             handle.implicitHeight + topPadding + bottomPadding)
+                             contentItem.implicitHeight + topPadding + bottomPadding)
 
     padding: 2
 
-    //! [handle]
-    handle: Rectangle {
+    //! [contentItem]
+    contentItem: Rectangle {
         id: handle
 
         implicitWidth: 6
@@ -59,12 +59,6 @@ T.ScrollBar {
         visible: control.size < 1.0
         opacity: 0.0
 
-        readonly property bool horizontal: control.orientation === Qt.Horizontal
-        x: control.leftPadding + (horizontal ? control.position * control.width : 0)
-        y: control.topPadding + (horizontal ? 0 : control.position * control.height)
-        width: horizontal ? control.size * control.availableWidth : implicitWidth
-        height: horizontal ? implicitHeight : control.size * control.availableHeight
-
         states: State {
             name: "active"
             when: control.active
@@ -79,5 +73,5 @@ T.ScrollBar {
             }
         }
     }
-    //! [handle]
+    //! [contentItem]
 }
diff --git a/src/imports/controls/doc/images/qtquickcontrols-scrollbar-handle.png b/src/imports/controls/doc/images/qtquickcontrols-scrollbar-contentItem.png
index 5d916e66..5d916e66 100644
--- a/src/imports/controls/doc/images/qtquickcontrols-scrollbar-handle.png
+++ b/src/imports/controls/doc/images/qtquickcontrols-scrollbar-contentItem.png
diff --git a/src/imports/controls/doc/snippets/qtquickcontrols-scrollbar-handle.qml b/src/imports/controls/doc/snippets/qtquickcontrols-scrollbar-contentItem.qml
index 45cde698..d1ce40d7 100644
--- a/src/imports/controls/doc/snippets/qtquickcontrols-scrollbar-handle.qml
+++ b/src/imports/controls/doc/snippets/qtquickcontrols-scrollbar-contentItem.qml
@@ -34,7 +34,7 @@ ScrollBar {
     active: true
     height: 100
     Rectangle {
-        parent: handle
+        parent: contentItem
         anchors.fill: parent
         color: "transparent"
         border.color: "red"
diff --git a/src/imports/controls/doc/src/qtlabscontrols-customize.qdoc b/src/imports/controls/doc/src/qtlabscontrols-customize.qdoc
index daa74795..df1ba5d0 100644
--- a/src/imports/controls/doc/src/qtlabscontrols-customize.qdoc
+++ b/src/imports/controls/doc/src/qtlabscontrols-customize.qdoc
@@ -354,7 +354,7 @@
     \section1 Customizing ScrollBar
 
         ScrollBar consists of two visual items: \l {Control::background}{background}
-        and \l {ScrollBar::handle}{handle}.
+        and \l {Control::contentItem}{content item}.
 
         \section3 Background
 
@@ -362,11 +362,11 @@
 
             ScrollBar has no background item by default.
 
-        \section3 Handle
+        \section3 Content item
 
-            \image qtquickcontrols-scrollbar-handle.png
+            \image qtquickcontrols-scrollbar-contentItem.png
 
-            \snippet ScrollBar.qml handle
+            \snippet ScrollBar.qml contentItem
 
 
     \section1 Customizing ScrollIndicator
diff --git a/src/imports/controls/material/ScrollBar.qml b/src/imports/controls/material/ScrollBar.qml
index 539b9243..7156b933 100644
--- a/src/imports/controls/material/ScrollBar.qml
+++ b/src/imports/controls/material/ScrollBar.qml
@@ -42,14 +42,14 @@ T.ScrollBar {
     id: control
 
     implicitWidth: Math.max(background ? background.implicitWidth : 0,
-                            handle.implicitWidth + leftPadding + rightPadding)
+                            contentItem.implicitWidth + leftPadding + rightPadding)
     implicitHeight: Math.max(background ? background.implicitHeight : 0,
-                             handle.implicitHeight + topPadding + bottomPadding)
+                             contentItem.implicitHeight + topPadding + bottomPadding)
 
     padding: 2
 
-    //! [handle]
-    handle: Rectangle {
+    //! [contentItem]
+    contentItem: Rectangle {
         id: handle
 
         implicitWidth: 4
@@ -59,12 +59,6 @@ T.ScrollBar {
         visible: control.size < 1.0
         opacity: 0.0
 
-        readonly property bool horizontal: control.orientation === Qt.Horizontal
-        x: control.leftPadding + (horizontal ? control.position * control.width : 0)
-        y: control.topPadding + (horizontal ? 0 : control.position * control.height)
-        width: horizontal ? control.size * control.availableWidth : implicitWidth
-        height: horizontal ? implicitHeight : control.size * control.availableHeight
-
         states: State {
             name: "active"
             when: control.active
@@ -79,5 +73,5 @@ T.ScrollBar {
             }
         }
     }
-    //! [handle]
+    //! [contentItem]
 }
diff --git a/src/imports/controls/plugins.qmltypes b/src/imports/controls/plugins.qmltypes
index 08597083..9a8b1255 100644
--- a/src/imports/controls/plugins.qmltypes
+++ b/src/imports/controls/plugins.qmltypes
@@ -502,7 +502,6 @@ Module {
         Property { name: "active"; type: "bool" }
         Property { name: "pressed"; type: "bool" }
         Property { name: "orientation"; type: "Qt::Orientation" }
-        Property { name: "handle"; type: "QQuickItem"; isPointer: true }
         Method {
             name: "setSize"
             Parameter { name: "size"; type: "double" }
diff --git a/src/imports/controls/universal/ScrollBar.qml b/src/imports/controls/universal/ScrollBar.qml
index b1bc8f6a..393a640e 100644
--- a/src/imports/controls/universal/ScrollBar.qml
+++ b/src/imports/controls/universal/ScrollBar.qml
@@ -42,28 +42,22 @@ T.ScrollBar {
     id: control
 
     implicitWidth: Math.max(background ? background.implicitWidth : 0,
-                            handle.implicitWidth + leftPadding + rightPadding)
+                            contentItem.implicitWidth + leftPadding + rightPadding)
     implicitHeight: Math.max(background ? background.implicitHeight : 0,
-                             handle.implicitHeight + topPadding + bottomPadding)
+                             contentItem.implicitHeight + topPadding + bottomPadding)
 
     // TODO: arrows
 
-    //! [handle]
-    handle: Rectangle {
+    //! [contentItem]
+    contentItem: Rectangle {
         implicitWidth: 12
         implicitHeight: 12
 
         color: control.pressed ? control.Universal.baseMediumColor : control.Universal.chromeHighColor
         visible: control.size < 1.0
         opacity: 0.0
-
-        readonly property bool horizontal: control.orientation === Qt.Horizontal
-        x: control.leftPadding + (horizontal ? control.position * control.width : 0)
-        y: control.topPadding + (horizontal ? 0 : control.position * control.height)
-        width: horizontal ? control.size * control.availableWidth : implicitWidth
-        height: horizontal ? implicitHeight : control.size * control.availableHeight
     }
-    //! [handle]
+    //! [contentItem]
 
     //! [background]
     background: Rectangle {
@@ -86,13 +80,13 @@ T.ScrollBar {
     transitions: [
         Transition {
             to: "active"
-            NumberAnimation { targets: [handle, background]; property: "opacity"; to: 1.0 }
+            NumberAnimation { targets: [contentItem, background]; property: "opacity"; to: 1.0 }
         },
         Transition {
             from: "active"
             SequentialAnimation {
                 PauseAnimation { duration: 3000 }
-                NumberAnimation { targets: [handle, background]; property: "opacity"; to: 0.0 }
+                NumberAnimation { targets: [contentItem, background]; property: "opacity"; to: 0.0 }
             }
         }
     ]