QmlDesigner: Fix distribution SpinBox drag

* Replace StudioControls.RealSpinBox with a DoubleSpinBox
* Add tooltips to distribution origin buttons
* Add spacer between distribution orientation and origin buttons

Task-number: QDS-4139
Task-number: QDS-4927
Change-Id: I5670494d39cb5b5d3d36428583cde5e7434a8d76
Reviewed-by: Leena Miettinen <riitta-leena.miettinen@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

1 files changed, 17 insertions, 6 deletions

diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml
index e222879593..b1fcddba37 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml
@@ -210,7 +210,7 @@ Section {
                     onClicked: alignDistribute.distributeSpacing(AlignDistribute.X,
                                                                  alignToComboBox.currentEnum,
                                                                  keyObjectComboBox.currentText,
-                                                                 distanceSpinBox.realValue,
+                                                                 distanceSpinBox.value,
                                                                  buttonRow.getDistributeDirection())
                 }
 
@@ -220,11 +220,13 @@ Section {
                     onClicked: alignDistribute.distributeSpacing(AlignDistribute.Y,
                                                                  alignToComboBox.currentEnum,
                                                                  keyObjectComboBox.currentText,
-                                                                 distanceSpinBox.realValue,
+                                                                 distanceSpinBox.value,
                                                                  buttonRow.getDistributeDirection())
                 }
             }
 
+            Spacer { implicitWidth: 8 }
+
             StudioControls.ButtonRow {
                 id: buttonRow
                 actionIndicatorVisible: false
@@ -250,6 +252,7 @@ Section {
                     buttonIcon: StudioTheme.Constants.distributeOriginNone
                     checkable: true
                     StudioControls.ButtonGroup.group: group
+                    tooltip: qsTr("Disables the distribution of spacing in pixels.")
                 }
 
                 AbstractButton {
@@ -257,6 +260,8 @@ Section {
                     buttonIcon: StudioTheme.Constants.distributeOriginTopLeft
                     checkable: true
                     StudioControls.ButtonGroup.group: group
+                    tooltip: qsTr("Sets the left or top border of the target area or item as the " +
+                                  "starting point, depending on the distribution orientation.")
                 }
 
                 AbstractButton {
@@ -264,6 +269,9 @@ Section {
                     buttonIcon: StudioTheme.Constants.distributeOriginCenter
                     checkable: true
                     StudioControls.ButtonGroup.group: group
+                    tooltip: qsTr("Sets the horizontal or vertical center of the target area or " +
+                                  "item as the starting point, depending on the distribution " +
+                                  "orientation.")
                 }
 
                 AbstractButton {
@@ -271,6 +279,8 @@ Section {
                     buttonIcon: StudioTheme.Constants.distributeOriginBottomRight
                     checkable: true
                     StudioControls.ButtonGroup.group: group
+                    tooltip: qsTr("Sets the bottom or right border of the target area or item as " +
+                                  "the starting point, depending on the distribution orientation.")
                 }
             }
         }
@@ -280,12 +290,13 @@ Section {
         SecondColumnLayout {
             Spacer { implicitWidth: StudioTheme.Values.actionIndicatorWidth }
 
-            StudioControls.RealSpinBox {
+            DoubleSpinBox {
                 id: distanceSpinBox
                 implicitWidth: StudioTheme.Values.twoControlColumnWidth
-                actionIndicatorVisible: false
-                realFrom: -1000
-                realTo: 1000
+                stepSize: 1
+                minimumValue: -1000
+                maximumValue: 1000
+                decimals: 0
                 enabled: !buttonNone.checked
             }
         }