Flickable manual test: add sliders to adjust flick-speed metrics

The sliders adjust maximumFlickVelocity and flickDeceleration.

Also in the shared Slider: try harder to end up with value being
the same as init, after initialization, by making the range of movement
divisible by more numbers, by default.  180 is highly divisible, and
keeps the default Slider size reasonable.  You can still override the
size of the Slider arbitrarily, though.

Task-number: QTBUG-97055
Change-Id: I6fb41ccb87e401a747d5a8add3100053a06d9d88
Reviewed-by: Shawn Rutledge <[email protected]>

2 files changed, 42 insertions, 8 deletions

diff --git a/examples/quick/shared/Slider.qml b/examples/quick/shared/Slider.qml
index 5b08034571..8509facf6f 100644
--- a/examples/quick/shared/Slider.qml
+++ b/examples/quick/shared/Slider.qml
@@ -53,7 +53,8 @@ import QtQuick 2.12
 Item {
     id: slider
     height: 26
-    width: 320
+    // default drag range is 180: divisible by 2, 3, 4, 5, 6, 9, 10, ...
+    width: sliderName.width + 223 + handle.width / 2
 
     property real min: 0
     property real max: 1
@@ -67,16 +68,19 @@ Item {
         id: dragHandler
         target: handle
         xAxis.minimum: Math.round(-handle.width / 2 + 3)
-        xAxis.maximum: Math.round(foo.width - handle.width/2 - 3)
+        xAxis.maximum: Math.round(groove.width - handle.width / 2 - 3)
         property real value: (handle.x - xAxis.minimum) / (xAxis.maximum - xAxis.minimum)
     }
 
     Component.onCompleted: setValue(init)
     function setValue(v) {
-       if (min < max)
-          handle.x = Math.round( v / (max - min) *
+        if (min < max) {
+            handle.x = Math.round( v / (max - min) *
                                 (dragHandler.xAxis.maximum - dragHandler.xAxis.minimum)
                                 + dragHandler.xAxis.minimum);
+//            console.log(name, v, "-> handle.x", handle.x, "from fraction", (v / (max - min)),
+//                "of drag range", (dragHandler.xAxis.maximum - dragHandler.xAxis.minimum), "px", min, ":", max)
+        }
     }
     Rectangle {
         id:sliderName
@@ -92,8 +96,8 @@ Item {
         }
     }
 
-    Rectangle{
-        id: foo
+    Rectangle {
+        id: groove
         width: parent.width - 8 - sliderName.width
         color: "#eee"
         height: 7
diff --git a/tests/manual/touch/flicktext.qml b/tests/manual/touch/flicktext.qml
index e69d6207a9..72128fe33c 100644
--- a/tests/manual/touch/flicktext.qml
+++ b/tests/manual/touch/flicktext.qml
@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2017 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the manual tests of the Qt Toolkit.
@@ -48,7 +48,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 2.12
+import QtQuick
 import "qrc:/quick/shared/" as Examples
 
 Rectangle {
@@ -75,6 +75,8 @@ Rectangle {
             }
             onContentXChanged: canvas.requestPaint()
             onContentYChanged: canvas.requestPaint()
+            maximumFlickVelocity: maxVelocitySlider.value
+            flickDeceleration: decelSlider.value
         }
 
         Timer { id: fadeTimer; interval: 1000; onTriggered: { hfade.start(); } }
@@ -204,6 +206,7 @@ Rectangle {
         id: bottomFlow
         anchors.bottom: parent.bottom
         width: parent.width - 12
+        height: 110
         x: 6
         spacing: 12
 
@@ -301,6 +304,33 @@ Rectangle {
                     color: "white"
                     text: "v " + flick.verticalVelocity.toFixed(2)
                 }
+                Examples.Slider {
+                    id: maxVelocitySlider
+                    name: "max vel"
+                    anchors.left: parent.left
+                    anchors.top: parent.bottom
+                    max: 10000
+                    init: 2500
+                }
+                Text {
+                    anchors.left: maxVelocitySlider.right
+                    anchors.verticalCenter: maxVelocitySlider.verticalCenter
+                    text: Math.round(flick.maximumFlickVelocity)
+                }
+                Examples.Slider {
+                    id: decelSlider
+                    name: "decel"
+                    anchors.right: maxVelocitySlider.right
+                    anchors.top: maxVelocitySlider.bottom
+                    min: 0
+                    max: 10000
+                    init: 1500
+                }
+                Text {
+                    anchors.left: decelSlider.right
+                    anchors.verticalCenter: decelSlider.verticalCenter
+                    text: Math.round(flick.flickDeceleration)
+                }
             }
         }