From d0f8fdff0d5762a212a4532973f9fefdf57aa4d7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kama=20W=C3=B3jcik?= <kama.wojcik@qt.io>
Date: Mon, 28 Jun 2021 15:12:42 +0200
Subject: [PATCH] QmlDesigner: Fix layout and tooltip

* Fix layout for AnimatedImage
* Fix tooltip for Animation section

Change-Id: Ibdcc2e34317555396ad51fbf873dfcee1adbcf55
Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>
---
 .../QtQuick/AnimatedImageSpecifics.qml        | 46 +++++++++----------
 .../QtQuick/AnimationSection.qml              |  2 +-
 2 files changed, 23 insertions(+), 25 deletions(-)

diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimatedImageSpecifics.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimatedImageSpecifics.qml
index 6c59408a588..1d4e8fe87ce 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimatedImageSpecifics.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimatedImageSpecifics.qml
@@ -34,11 +34,11 @@ Column {
     anchors.right: parent.right
 
     ImageSection {
-        caption: qsTr("Animated Image")
+        caption: qsTr("Image")
     }
 
     Section {
-        caption: qsTr("Animation Settings")
+        caption: qsTr("Animated image")
 
         anchors.left: parent.left
         anchors.right: parent.right
@@ -62,40 +62,38 @@ Column {
                     enabled: backendValues.speed.isAvailable
                 }
 
-                ExpandingSpacer {}
-            }
-
-            PropertyLabel {
-                text: qsTr("Paused")
-                tooltip: qsTr("Whether the animated image is paused.")
-                disabledState: !backendValues.paused.isAvailable
-            }
-
-            SecondColumnLayout {
-                CheckBox {
-                    text: backendValues.paused.valueToString
-                    implicitWidth: StudioTheme.Values.twoControlColumnWidth
-                                   + StudioTheme.Values.actionIndicatorWidth
-                    backendValue: backendValues.paused
-                    enabled: backendValues.paused.isAvailable
-                }
+                // TODO convert to % and add % label after the spin box
 
                 ExpandingSpacer {}
             }
 
             PropertyLabel {
                 text: qsTr("Playing")
-                tooltip: qsTr("Whether the animated image is playing.")
-                disabledState: !backendValues.playing.isAvailable
+                tooltip: qsTr("Whether the animation is playing and/or paused.")
+                disabledState: !backendValues.playing.isAvailable && !backendValues.paused.isAvailable
             }
 
             SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.playing.valueToString
+                    text: StudioTheme.Constants.play
                     implicitWidth: StudioTheme.Values.twoControlColumnWidth
-                                   + StudioTheme.Values.actionIndicatorWidth
+                                + StudioTheme.Values.actionIndicatorWidth
                     backendValue: backendValues.playing
-                    enabled: backendValues.playing.isAvailable
+                    enabled: backendValue.isAvailable
+                    fontFamily: StudioTheme.Constants.iconFont.family
+                    fontPixelSize: StudioTheme.Values.myIconFontSize
+                }
+
+                Spacer { implicitWidth: StudioTheme.Values.twoControlColumnGap }
+
+                CheckBox {
+                    text: StudioTheme.Constants.pause
+                    implicitWidth: StudioTheme.Values.twoControlColumnWidth
+                                + StudioTheme.Values.actionIndicatorWidth
+                    backendValue: backendValues.paused
+                    enabled: backendValue.isAvailable
+                    fontFamily: StudioTheme.Constants.iconFont.family
+                    fontPixelSize: StudioTheme.Values.myIconFontSize
                 }
 
                 ExpandingSpacer {}
diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimationSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimationSection.qml
index cdbf07307d3..e671c73165b 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimationSection.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnimationSection.qml
@@ -42,7 +42,7 @@ Section {
     SectionLayout {
         PropertyLabel {
             text: qsTr("Running")
-            tooltip: qsTr("Whether the animation is running and paused.")
+            tooltip: qsTr("Whether the animation is running and/or paused.")
         }
 
         SecondColumnLayout {