QmlDesigner: Clean up curve editor toolbar

- Slider size is adjusted
- Zoom actions are available
- Spinbox controls and labels are aligned to right
- Control styles are modified

find better style for the controls

Task-number: QDS-9079
Change-Id: I3fa376102d71ea6f904e72de1e6cc2f50ad1c8b6
Reviewed-by: Qt CI Bot <qt_ci_bot@qt-project.org>
Reviewed-by: <github-actions-qt-creator@cristianadam.eu>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

src/plugins/qmldesigner/CMakeLists.txt

@@ -1056,6 +1056,7 @@ extend_qtc_plugin(QmlDesigner
     curveeditorview.cpp curveeditorview.h
     animationcurve.cpp animationcurve.h
     curveeditor.cpp curveeditor.h
+    curveeditorconstants.h
     curveeditortoolbar.cpp curveeditortoolbar.h
     curveeditormodel.cpp curveeditormodel.h
     curveeditorstyle.h

src/plugins/qmldesigner/components/curveeditor/curveeditorconstants.h

@@ -0,0 +1,14 @@
+// Copyright (C) 2023 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0+ OR GPL-3.0 WITH Qt-GPL-exception-1.0
+
+#pragma once
+
+namespace QmlDesigner {
+namespace CurveEditorConstants {
+
+constexpr char C_QMLCURVEEDITOR[] = "QmlDesigner::CurveEditor";
+
+constexpr char C_ZOOM_IN[] = "QmlDesigner.ZoomIn";
+constexpr char C_ZOOM_OUT[] = "QmlDesigner.ZoomOut";
+} // CurveEditorConstants
+} // QmlDesigner

src/plugins/qmldesigner/components/curveeditor/curveeditortoolbar.cpp

@@ -2,9 +2,13 @@
 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0+ OR GPL-3.0 WITH Qt-GPL-exception-1.0
 
 #include "curveeditortoolbar.h"
+#include "curveeditorconstants.h"
 #include "curveeditormodel.h"
 
-#include <theme.h>
+#include "coreplugin/actionmanager/actionmanager.h"
+#include "coreplugin/icontext.h"
+#include "theme.h"
+#include "utils/id.h"
 
 #include <QAction>
 #include <QHBoxLayout>
@@ -16,7 +20,11 @@ namespace QmlDesigner {
 ValidatableSpinBox::ValidatableSpinBox(std::function<bool(int)> validator, QWidget* parent)
     : QSpinBox(parent)
     , m_validator(validator)
-{ }
+{
+    setButtonSymbols(NoButtons);
+    setAlignment(Qt::AlignRight | Qt::AlignVCenter);
+    setFrame(false);
+}
 
 QValidator::State ValidatableSpinBox::validate(QString &text, int &pos) const
 {
@@ -30,6 +38,20 @@ QValidator::State ValidatableSpinBox::validate(QString &text, int &pos) const
     return result;
 }
 
+static QAction *createAction(const Utils::Id &id,
+                      const QIcon &icon,
+                      const QString &name,
+                      const QKeySequence &shortcut)
+{
+    Core::Context context(CurveEditorConstants::C_QMLCURVEEDITOR);
+
+    auto *action = new QAction(icon, name);
+    auto *command = Core::ActionManager::registerAction(action, id, context);
+    command->setDefaultKeySequence(shortcut);
+    command->augmentActionWithShortcutToolTip(action);
+
+    return action;
+}
 
 CurveEditorToolBar::CurveEditorToolBar(CurveEditorModel *model, QWidget* parent)
     : QToolBar(parent)
@@ -97,19 +119,26 @@ CurveEditorToolBar::CurveEditorToolBar(CurveEditorModel *model, QWidget* parent)
     m_currentSpin->setMinimum(0);
     m_currentSpin->setMaximum(std::numeric_limits<int>::max());
     m_currentSpin->setFixedWidth(70);
+    m_currentSpin->setButtonSymbols(QSpinBox::NoButtons);
+    m_currentSpin->setAlignment(Qt::AlignRight | Qt::AlignVCenter);
+    m_currentSpin->setFrame(false);
 
     connect(m_currentSpin, &QSpinBox::valueChanged, this, &CurveEditorToolBar::currentFrameChanged);
 
+    addSpacer();
+
     auto *durationBox = new QHBoxLayout;
     durationBox->setContentsMargins(0, 0, 0, 0);
     durationBox->addWidget(new QLabel(tr("Start Frame")));
     durationBox->addWidget(m_startSpin);
+    addSpace(durationBox);
     durationBox->addWidget(new QLabel(tr("End Frame")));
     durationBox->addWidget(m_endSpin);
 
     auto *durationWidget = new QWidget;
     durationWidget->setLayout(durationBox);
     addWidget(durationWidget);
+    addSpace();
 
     auto *positionBox = new QHBoxLayout;
     positionBox->setContentsMargins(0, 0, 0, 0);
@@ -119,13 +148,40 @@ CurveEditorToolBar::CurveEditorToolBar(CurveEditorModel *model, QWidget* parent)
     auto *positionWidget = new QWidget;
     positionWidget->setLayout(positionBox);
     addWidget(positionWidget);
+    addSpace();
 
     m_zoomSlider = new QSlider(Qt::Horizontal);
     m_zoomSlider->setRange(0, 100);
+    m_zoomSlider->setProperty("DSSlider", true);
+    m_zoomSlider->setProperty("panelwidget", true);
+    m_zoomSlider->setProperty("panelwidget_singlerow", true);
+    m_zoomSlider->setFixedWidth(120);
+
     connect(m_zoomSlider, &QSlider::valueChanged, [this](int value) {
         emit zoomChanged(static_cast<double>(value)/100.0f);
     });
+
+    auto *zoomOut = createAction(CurveEditorConstants::C_ZOOM_OUT,
+                                 Theme::iconFromName(Theme::Icon::zoomOut_medium),
+                                 tr("Zoom Out"),
+                                 QKeySequence(QKeySequence::ZoomOut));
+
+    connect(zoomOut, &QAction::triggered, [this]() {
+        m_zoomSlider->setValue(m_zoomSlider->value() - m_zoomSlider->pageStep());
+    });
+
+    auto *zoomIn = createAction(CurveEditorConstants::C_ZOOM_IN,
+                                Theme::iconFromName(Theme::Icon::zoomIn_medium),
+                                tr("Zoom In"),
+                                QKeySequence(QKeySequence::ZoomIn));
+
+    connect(zoomIn, &QAction::triggered, [this]() {
+        m_zoomSlider->setValue(m_zoomSlider->value() + m_zoomSlider->pageStep());
+    });
+
+    addAction(zoomOut);
     addWidget(m_zoomSlider);
+    addAction(zoomIn);
 }
 
 void CurveEditorToolBar::setZoom(double zoom)
@@ -153,4 +209,27 @@ void CurveEditorToolBar::updateBoundsSilent(int start, int end)
     m_endSpin->setValue(end);
 }
 
+void CurveEditorToolBar::addSpacer()
+{
+    QWidget *spacerWidget = new QWidget(this);
+    spacerWidget->setSizePolicy(QSizePolicy::MinimumExpanding, QSizePolicy::Fixed);
+    addWidget(spacerWidget);
+}
+
+void CurveEditorToolBar::addSpace(int spaceSize)
+{
+    QWidget *spacerWidget = new QWidget(this);
+    spacerWidget->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
+    spacerWidget->setFixedSize(spaceSize, 1);
+    addWidget(spacerWidget);
+}
+
+void CurveEditorToolBar::addSpace(QLayout *layout, int spaceSize)
+{
+    QWidget *spacerWidget = new QWidget(layout->widget());
+    spacerWidget->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
+    spacerWidget->setFixedSize(spaceSize, 1);
+    layout->addWidget(spacerWidget);
+}
+
 } // End namespace QmlDesigner.

src/plugins/qmldesigner/components/curveeditor/curveeditortoolbar.h

@@ -18,10 +18,13 @@ class CurveEditorModel;
 class ValidatableSpinBox : public QSpinBox
 {
     Q_OBJECT
+
 public:
     ValidatableSpinBox(std::function<bool(int)> validator, QWidget* parent=nullptr);
+
 protected:
     QValidator::State validate(QString &text, int &pos) const override;
+
 private:
     std::function<bool(int)> m_validator;
 };
@@ -54,6 +57,10 @@ public:
     void updateBoundsSilent(int start, int end);
 
 private:
+    void addSpacer();
+    void addSpace(int spaceSize = 40);
+    void addSpace(QLayout *layout, int spaceSize = 40);
+
     ValidatableSpinBox *m_startSpin;
     ValidatableSpinBox *m_endSpin;
     QSpinBox *m_currentSpin;