QmlDesigner: Add some states view improvements

- Added a gray border around unselected states.
- States resize to fit view height.
- States are centered vertically in the view.
- Removed collapse option, auto collapse when space is small.
- scroll bar always at the bottom.
- Overshoot list ends.
- Added margins around the states.
- Add states button: make it small and docked to the bottom right.
- Add states button doesnt take space from the view.

Change-Id: I4fc96f4341a6e4a0c70509240b7aed9c7890ec4d
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
Reviewed-by: Samuel Ghinet <samuel.ghinet@qt.io>
Reviewed-by: <github-actions-qt-creator@cristianadam.eu>

1 files changed, 16 insertions, 6 deletions

diff --git a/src/plugins/qmldesigner/components/stateseditor/stateseditorview.cpp b/src/plugins/qmldesigner/components/stateseditor/stateseditorview.cpp
index 997852cfb2..cf1f377141 100644
--- a/src/plugins/qmldesigner/components/stateseditor/stateseditorview.cpp
+++ b/src/plugins/qmldesigner/components/stateseditor/stateseditorview.cpp
@@ -85,12 +85,6 @@ void StatesEditorView::rootNodeTypeChanged(const QString &/*type*/, int /*majorV
     checkForStatesAvailability();
 }
 
-void StatesEditorView::toggleStatesViewExpanded()
-{
-    if (m_statesEditorWidget)
-        m_statesEditorWidget->toggleStatesViewExpanded();
-}
-
 void StatesEditorView::removeState(int nodeId)
 {
     try {
@@ -102,6 +96,22 @@ void StatesEditorView::removeState(int nodeId)
             if (modelState.isValid()) {
                 QStringList lockedTargets;
                 const auto propertyChanges = modelState.propertyChanges();
+
+                 // confirm removing not empty states
+                if (!propertyChanges.isEmpty()) {
+                    QMessageBox msgBox;
+                    msgBox.setTextFormat(Qt::RichText);
+                    msgBox.setIcon(QMessageBox::Question);
+                    msgBox.setWindowTitle(tr("Remove State"));
+                    msgBox.setText(tr("This state is not empty. Are you sure you want to remove it?"));
+                    msgBox.setStandardButtons(QMessageBox::Yes | QMessageBox::Cancel);
+                    msgBox.setDefaultButton(QMessageBox::Yes);
+
+                    if (msgBox.exec() == QMessageBox::Cancel)
+                        return;
+                }
+
+                // confirm removing states with locked targets
                 for (const QmlPropertyChanges &change : propertyChanges) {
                     const ModelNode target = change.target();
                     QTC_ASSERT(target.isValid(), continue);