Improve the xyz and slider inspector components

- Align the xyz in one line, also color them (red, green, blue)
- Make the slider value smaller and use only 1 decimal
- Make the float value smaller and align it to the left

Task-number: QT3DS-2679
Change-Id: I6f80c11acc3d96ddc8a6c834f3facbeb42cd1134
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>

8 files changed, 53 insertions, 28 deletions

diff --git a/src/Authoring/Client/Code/Core/Utility/StudioPreferences.cpp b/src/Authoring/Client/Code/Core/Utility/StudioPreferences.cpp
index 7e82eeab..921af967 100644
--- a/src/Authoring/Client/Code/Core/Utility/StudioPreferences.cpp
+++ b/src/Authoring/Client/Code/Core/Utility/StudioPreferences.cpp
@@ -58,6 +58,9 @@ static QColor s_disabledColor;
 static QColor s_dataInputColor;
 static QColor s_matteColor;
 static QColor s_projectReferencedColor;
+static QColor s_xAxisColor;
+static QColor s_yAxisColor;
+static QColor s_zAxisColor;
 static QLinearGradient s_welcomeBackgroundGradient;
 
 static QColor s_timelineRowColorNormal;
@@ -147,6 +150,9 @@ void CStudioPreferences::loadPreferences(const QString &filePath)
     s_dataInputColor = QColor("#ff5102");
     s_matteColor = QColor("#222222");
     s_projectReferencedColor = QColor("#aaaa00");
+    s_xAxisColor = QColor("#ca2f2e");
+    s_yAxisColor = QColor("#64cd35");
+    s_zAxisColor = QColor("#1e9fcd");
 
     s_welcomeBackgroundGradient = QLinearGradient(0.0, 0.0, 1.0, 0.0);
     s_welcomeBackgroundGradient.setColorAt(0.0, QColor("#343E55"));
@@ -759,6 +765,21 @@ void CStudioPreferences::SetBigTimeAdvanceAmount(long inTime)
     return ::CColor("#ff0000");
 }
 
+QColor CStudioPreferences::GetXAxisColor()
+{
+    return s_xAxisColor;
+}
+
+QColor CStudioPreferences::GetYAxisColor()
+{
+    return s_yAxisColor;
+}
+
+QColor CStudioPreferences::GetZAxisColor()
+{
+    return s_zAxisColor;
+}
+
 /**
  *  Colors for rulers and guides
  */
@@ -835,6 +856,9 @@ void CStudioPreferences::setQmlContextProperties(QQmlContext *qml)
     qml->setContextProperty(QStringLiteral("_disabledColor"), s_disabledColor);
     qml->setContextProperty(QStringLiteral("_dataInputColor"), s_dataInputColor);
     qml->setContextProperty(QStringLiteral("_projectReferencedColor"), s_projectReferencedColor);
+    qml->setContextProperty(QStringLiteral("_xAxisColor"), s_xAxisColor);
+    qml->setContextProperty(QStringLiteral("_yAxisColor"), s_yAxisColor);
+    qml->setContextProperty(QStringLiteral("_zAxisColor"), s_zAxisColor);
     qml->setContextProperty(QStringLiteral("_fontSize"), s_fontSize);
     qml->setContextProperty(QStringLiteral("_controlBaseHeight"), s_controlBaseHeight);
     qml->setContextProperty(QStringLiteral("_idWidth"), s_idWidth);
diff --git a/src/Authoring/Client/Code/Core/Utility/StudioPreferences.h b/src/Authoring/Client/Code/Core/Utility/StudioPreferences.h
index 5ca7cfd9..7a40529b 100644
--- a/src/Authoring/Client/Code/Core/Utility/StudioPreferences.h
+++ b/src/Authoring/Client/Code/Core/Utility/StudioPreferences.h
@@ -143,6 +143,9 @@ public:
 
     static ::CColor GetSingleBoundingBoxColor();
     static ::CColor GetGroupBoundingBoxColor();
+    static QColor GetXAxisColor();
+    static QColor GetYAxisColor();
+    static QColor GetZAxisColor();
 
     static ::CColor GetRulerBackgroundColor();
     static ::CColor GetRulerTickColor();
diff --git a/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseSlider.qml b/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseSlider.qml
index d025a889..f1aacbab 100644
--- a/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseSlider.qml
+++ b/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseSlider.qml
@@ -44,7 +44,7 @@ Row {
     property alias sliderMin: slider.from
     property alias sliderMax: slider.to
     property bool intSlider: false
-    property int decimalSlider: 3
+    property int decimalSlider: 1
     property Item tabItem1: textField
 
     signal previewValue // Indicates desiredValue contains a preview value
@@ -98,7 +98,7 @@ Row {
         background: Rectangle {
             x: slider.leftPadding
             y: slider.topPadding + slider.availableHeight / 2 - height / 2
-            implicitWidth: _valueWidth / 2 - 5
+            implicitWidth: _valueWidth - textField.width - 5
             implicitHeight: 6
             height: implicitHeight
             radius: 2
@@ -194,7 +194,7 @@ Row {
         id: textField
 
         height: _controlBaseHeight
-        width: _valueWidth / 2
+        width: 55
         text: intSlider ? slider.value.toFixed(0) : slider.value.toFixed(decimalSlider)
 
         validator: intSlider ? intValidator : doubleValidator
diff --git a/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseXYZ.qml b/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseXYZ.qml
index d3190975..50440dba 100644
--- a/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseXYZ.qml
+++ b/src/Authoring/Studio/Palettes/Action/HandlerPropertyBaseXYZ.qml
@@ -33,7 +33,7 @@ import "../controls"
 
 /* Use for: Position, Rotation, Scale, Pivot ... */
 
-GridLayout {
+RowLayout {
     id: root
 
     property alias valueX: textFieldX.text
@@ -44,46 +44,52 @@ GridLayout {
     property Item tabItem2: textFieldY
     property Item tabItem3: textFieldZ
 
-    columns: 2
-    rowSpacing: 1
-
     signal editingFinished
     signal previewValueChanged
+    transformOrigin: Item.Center
+    spacing: 0
 
     StyledLabel {
         Layout.preferredWidth: 10
         text: qsTr("X")
+        color: _xAxisColor
     }
 
     FloatTextField {
         id: textFieldX
-
+        Layout.preferredWidth: (_valueWidth - 50) / 3
         decimalValue: numberOfDecimal
         onEditingFinished: root.editingFinished()
         onPreviewValueChanged: root.previewValueChanged()
     }
 
+    Item { width: 10 }
+
     StyledLabel {
         Layout.preferredWidth: 10
         text: qsTr("Y")
+        color: _yAxisColor
     }
 
     FloatTextField {
         id: textFieldY
-
+        Layout.preferredWidth: (_valueWidth - 50) / 3
         decimalValue: numberOfDecimal
         onEditingFinished: root.editingFinished()
         onPreviewValueChanged: root.previewValueChanged()
     }
 
+    Item { width: 10 }
+
     StyledLabel {
         Layout.preferredWidth: 10
         text: qsTr("Z")
+        color: _zAxisColor
     }
 
     FloatTextField {
         id: textFieldZ
-
+        Layout.preferredWidth: (_valueWidth - 50) / 3
         decimalValue: numberOfDecimal
         onEditingFinished: root.editingFinished()
         onPreviewValueChanged: root.previewValueChanged()
diff --git a/src/Authoring/Studio/Palettes/Inspector/InspectorControlView.qml b/src/Authoring/Studio/Palettes/Inspector/InspectorControlView.qml
index 227a7a60..d7a047db 100644
--- a/src/Authoring/Studio/Palettes/Inspector/InspectorControlView.qml
+++ b/src/Authoring/Studio/Palettes/Inspector/InspectorControlView.qml
@@ -638,9 +638,6 @@ Rectangle {
                 xyzHandler.valueZ = Number(values[2]).toFixed(xyzHandler.numberOfDecimal);
             }
 
-            Item {
-                width: _valueWidth - xyzHandler.width
-            }
             HandlerPropertyBaseXYZ {
                 id: xyzHandler
                 valueX: Number(values[0]).toFixed(numberOfDecimal)
@@ -711,14 +708,12 @@ Rectangle {
             }
 
             spacing: 0
-            Item {
-                width: _valueWidth - floatField.width
-            }
+
             FloatTextField {
                 id: floatField
                 text: Number(parent.value).toFixed(decimalValue)
                 implicitHeight: _controlBaseHeight
-                implicitWidth: _valueWidth / 2
+                implicitWidth: _valueWidth / 3
 
                 onPreviewValueChanged: {
                     _inspectorModel.setPropertyValue(parent.instance, parent.handle,
diff --git a/src/Authoring/Studio/Palettes/controls/FloatTextField.qml b/src/Authoring/Studio/Palettes/controls/FloatTextField.qml
index 9d65f68e..49fa0081 100644
--- a/src/Authoring/Studio/Palettes/controls/FloatTextField.qml
+++ b/src/Authoring/Studio/Palettes/controls/FloatTextField.qml
@@ -41,7 +41,7 @@ TextField {
 
     selectByMouse: true
     text: "0.000"
-    Layout.preferredWidth: _valueWidth / 2
+    Layout.preferredWidth: _valueWidth / 3
     Layout.preferredHeight: _controlBaseHeight
 
     topPadding: 0
diff --git a/src/Authoring/Studio/Palettes/controls/StyledTooltip.qml b/src/Authoring/Studio/Palettes/controls/StyledTooltip.qml
index 001d8835..34b310a4 100644
--- a/src/Authoring/Studio/Palettes/controls/StyledTooltip.qml
+++ b/src/Authoring/Studio/Palettes/controls/StyledTooltip.qml
@@ -41,10 +41,7 @@ ToolTip {
     // set for MainFrm catches the tooltip events for QML, it doesn't prevent showing them because
     // we were/are controlling the visibility in code.
     onEnabledChanged: {
-        if (enabled && _parentView.toolTipsEnabled())
-            visible = true;
-        else
-            visible = false;
+        visible = enabled && _parentView.toolTipsEnabled();
     }
 
     background: Rectangle {
diff --git a/src/Authoring/Studio/Render/StudioWidgetImpl.h b/src/Authoring/Studio/Render/StudioWidgetImpl.h
index f259d4f4..b78c1edf 100644
--- a/src/Authoring/Studio/Render/StudioWidgetImpl.h
+++ b/src/Authoring/Studio/Render/StudioWidgetImpl.h
@@ -36,6 +36,7 @@
 
 #include "Qt3DSRenderNode.h"
 #include "Qt3DSRenderShaderCodeGeneratorV2.h"
+#include "StudioPreferences.h"
 
 namespace qt3ds {
 namespace widgets {
@@ -326,15 +327,14 @@ namespace widgets {
 
         void ClearRotationEdges() override { m_RotationWedge = Empty(); }
 
-        static inline QT3DSF32 ToGLSLColor(QT3DSU32 inItem) { return (QT3DSF32)inItem * 1.0f / 255.0f; }
-        static inline QT3DSVec3 ToGLSLColor(QT3DSU32 R, QT3DSU32 G, QT3DSU32 B)
+        static inline QT3DSVec3 ToGLSLColor(const QColor &c)
         {
-            return QT3DSVec3(ToGLSLColor(R), ToGLSLColor(G), ToGLSLColor(B));
+            return QT3DSVec3(c.redF(), c.greenF(), c.blueF());
         }
 
-        static QT3DSVec3 GetXAxisColor() { return ToGLSLColor(202, 47, 46); }
-        static QT3DSVec3 GetYAxisColor() { return ToGLSLColor(100, 205, 53); }
-        static QT3DSVec3 GetZAxisColor() { return ToGLSLColor(30, 159, 205); }
+        static QT3DSVec3 GetXAxisColor() { return ToGLSLColor(CStudioPreferences::GetXAxisColor()); }
+        static QT3DSVec3 GetYAxisColor() { return ToGLSLColor(CStudioPreferences::GetYAxisColor()); }
+        static QT3DSVec3 GetZAxisColor() { return ToGLSLColor(CStudioPreferences::GetZAxisColor()); }
 
         static inline QT3DSF32 GetDiscPos() { return 65.0f; }
         static inline QT3DSF32 GetDiscRadius() { return 7.0f; }