macOS: add RangeSlider

Also ensure that RangeSlider warns about customization of its handles.

Task-number: QTBUG-115165
Change-Id: Ia4993713e7273d0872c4538ff7d1200cad9bc7ed
Reviewed-by: Oliver Eftevaag <[email protected]>

7 files changed, 123 insertions, 17 deletions

diff --git a/src/quickcontrols/macos/CMakeLists.txt b/src/quickcontrols/macos/CMakeLists.txt
index 72f7ff9b49..4827093d38 100644
--- a/src/quickcontrols/macos/CMakeLists.txt
+++ b/src/quickcontrols/macos/CMakeLists.txt
@@ -17,6 +17,7 @@ set(qml_files
     "GroupBox.qml"
     "ProgressBar.qml"
     "RadioButton.qml"
+    "RangeSlider.qml"
     "ScrollBar.qml"
     "ScrollView.qml"
     "SelectionRectangle.qml"
diff --git a/src/quickcontrols/macos/RangeSlider.qml b/src/quickcontrols/macos/RangeSlider.qml
new file mode 100644
index 0000000000..cc76b164c0
--- /dev/null
+++ b/src/quickcontrols/macos/RangeSlider.qml
@@ -0,0 +1,101 @@
+// Copyright (C) 2023 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only
+
+import QtQuick
+import QtQuick.Templates as T
+import QtQuick.Controls.impl
+import QtQuick.Controls.macOS.impl
+
+T.RangeSlider {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+        Math.max(first.implicitHandleWidth, second.implicitHandleWidth) + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+        Math.max(first.implicitHandleHeight, second.implicitHandleHeight) + topPadding + bottomPadding)
+
+    readonly property bool __notCustomizable: true
+
+    first.handle: SwitchHandle {
+        x: control.leftPadding + Math.round(control.horizontal
+            ? control.first.visualPosition * (control.availableWidth - width)
+            : (control.availableWidth - width) / 2)
+        y: control.topPadding + Math.round(control.horizontal
+            ? (control.availableHeight - height) / 2
+            : control.first.visualPosition * (control.availableHeight - height))
+
+        palette: control.palette
+        down: control.first.pressed
+
+        readonly property bool __ignoreNotCustomizable: true
+    }
+
+    second.handle: SwitchHandle {
+        x: control.leftPadding + Math.round(control.horizontal
+            ? control.second.visualPosition * (control.availableWidth - width)
+            : (control.availableWidth - width) / 2)
+        y: control.topPadding + Math.round(control.horizontal
+            ? (control.availableHeight - height) / 2
+            : control.second.visualPosition * (control.availableHeight - height))
+
+        palette: control.palette
+        down: control.second.pressed
+
+        readonly property bool __ignoreNotCustomizable: true
+    }
+
+    background: Item {
+        implicitWidth: control.horizontal ? 124 : 24
+        implicitHeight: control.horizontal ? 24 : 124
+
+        readonly property bool __ignoreNotCustomizable: true
+        readonly property int barThickness: 4
+
+        // Groove background.
+        Rectangle {
+            x: control.horizontal ? 0 : (parent.width - width) / 2
+            y: control.horizontal ? (parent.height - height) / 2 : 0
+            width: control.horizontal ? parent.width : parent.barThickness
+            height: control.horizontal ? parent.barThickness : parent.height
+            radius: height / 2
+            color: control.palette.window
+
+            Rectangle {
+                width: parent.width
+                height: parent.height
+                radius: parent.radius
+                // No border in dark mode, instead we fill.
+                color: Qt.styleHints.colorScheme === Qt.Light
+                    ? "transparent" : Qt.lighter(control.palette.window, 1.6)
+                border.color: Qt.styleHints.colorScheme === Qt.Light
+                    ? Qt.darker(control.palette.window, 1.1)
+                    : "transparent"
+
+                Rectangle {
+                    x: 1
+                    y: 1
+                    width: parent.width - 2
+                    height: parent.height - 2
+                    radius: parent.radius
+                    color: "transparent"
+                    border.color: Qt.darker(control.palette.window, 1.05)
+                    visible: Qt.styleHints.colorScheme === Qt.Light
+                }
+            }
+        }
+
+        // Progress bar.
+        Rectangle {
+            x: control.horizontal ? control.first.position * parent.width + 3 : (parent.width - width) / 2
+            y: control.horizontal ? (parent.height - height) / 2 : control.second.visualPosition * parent.height + 3
+            width: control.horizontal
+                ? control.second.position * parent.width - control.first.position * parent.width - parent.barThickness
+                : parent.barThickness
+            height: control.horizontal
+                ? parent.barThickness
+                : control.second.position * parent.height - control.first.position * parent.height - parent.barThickness
+            // TODO: use control.palette.accentColor instead when it's available: QTBUG-116106
+            color: control.palette.accent
+        }
+    }
+}
diff --git a/src/quickcontrols/macos/impl/SwitchHandle.qml b/src/quickcontrols/macos/impl/SwitchHandle.qml
index 0b97262237..3ef17410e4 100644
--- a/src/quickcontrols/macos/impl/SwitchHandle.qml
+++ b/src/quickcontrols/macos/impl/SwitchHandle.qml
@@ -24,12 +24,4 @@ Rectangle {
         shadowScale: 0.92
         shadowOpacity: 1
     }
-
-    Behavior on x {
-        enabled: !handle.down
-        SmoothedAnimation {
-            velocity: 75
-            easing.type: Easing.InOutQuad
-        }
-    }
 }
diff --git a/src/quickcontrols/macos/impl/SwitchIndicator.qml b/src/quickcontrols/macos/impl/SwitchIndicator.qml
index 51bf7eeb61..353d6b7a46 100644
--- a/src/quickcontrols/macos/impl/SwitchIndicator.qml
+++ b/src/quickcontrols/macos/impl/SwitchIndicator.qml
@@ -98,5 +98,15 @@ Rectangle {
         x: Math.max(1, Math.min(parent.width - width - 1, indicator.control.visualPosition * parent.width - (width / 2)))
         y: (parent.height - height) / 2
         down: indicator.control.down
+
+        // We have this here because we don't want this behavior for RangeSlider,
+        // which also uses SwitchHandle.
+        Behavior on x {
+            enabled: !handle.down
+
+            SmoothedAnimation {
+                velocity: 200
+            }
+        }
     }
 }
diff --git a/src/quicknativestyle/CMakeLists.txt b/src/quicknativestyle/CMakeLists.txt
index c847a73f6d..588a6605a9 100644
--- a/src/quicknativestyle/CMakeLists.txt
+++ b/src/quicknativestyle/CMakeLists.txt
@@ -7,18 +7,18 @@
 
 set(qml_files
     "controls/DefaultButton.qml"
-    "controls/DefaultSlider.qml"
-    "controls/DefaultGroupBox.qml"
     "controls/DefaultCheckBox.qml"
+    "controls/DefaultComboBox.qml"
+    "controls/DefaultDial.qml"
+    "controls/DefaultFrame.qml"
+    "controls/DefaultGroupBox.qml"
+    "controls/DefaultProgressBar.qml"
     "controls/DefaultRadioButton.qml"
+    "controls/DefaultScrollBar.qml"
+    "controls/DefaultSlider.qml"
     "controls/DefaultSpinBox.qml"
-    "controls/DefaultTextField.qml"
-    "controls/DefaultFrame.qml"
     "controls/DefaultTextArea.qml"
-    "controls/DefaultComboBox.qml"
-    "controls/DefaultScrollBar.qml"
-    "controls/DefaultProgressBar.qml"
-    "controls/DefaultDial.qml"
+    "controls/DefaultTextField.qml"
 )
 
 if(MACOS)
diff --git a/src/quicktemplates/qquickrangeslider.cpp b/src/quicktemplates/qquickrangeslider.cpp
index 51d511b3ba..79ebfa7bae 100644
--- a/src/quicktemplates/qquickrangeslider.cpp
+++ b/src/quicktemplates/qquickrangeslider.cpp
@@ -225,6 +225,8 @@ void QQuickRangeSliderNode::setHandle(QQuickItem *handle)
     if (d->handle == handle)
         return;
 
+    QQuickControlPrivate::warnIfCustomizationNotSupported(d->slider, handle, QStringLiteral("handle"));
+
     if (!d->handle.isExecuting())
         d->cancelHandle();
 
diff --git a/tests/auto/quickcontrols/customization/tst_customization.cpp b/tests/auto/quickcontrols/customization/tst_customization.cpp
index a055f86122..e3940c0a24 100644
--- a/tests/auto/quickcontrols/customization/tst_customization.cpp
+++ b/tests/auto/quickcontrols/customization/tst_customization.cpp
@@ -366,7 +366,7 @@ void tst_customization::override_data()
             "macOS",
             {
                 "Button", "CheckBox", "ComboBox", "Dial",  "Frame", "GroupBox",
-                "ProgressBar", "RadioButton", "SelectionRectangle", "Slider",
+                "ProgressBar", "RadioButton", "SelectionRectangle", "RangeSlider", "Slider",
                 "SpinBox", "TextArea", "TextField", "TreeViewDelegate"
                 // TODO: ScrollView, ScrollBar
             }