QmlDesigner: Make use of states in ADS icons

* Add the on state to the tab close QIcon to have a different color in
  focused tabs
* Make the tab close icon checkable if FocusHighlighting is enabled to
  exploit the QIcon state for the color change
* Adapt the focused font color in the dockwidget stylesheet

Task-number: QDS-2558
Change-Id: I9fdfb93f0677f724336da8efdb2fb219af9c9e87
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

3 files changed, 28 insertions, 5 deletions

diff --git a/src/libs/advanceddockingsystem/dockwidgettab.cpp b/src/libs/advanceddockingsystem/dockwidgettab.cpp
index af0ce4baef..7a4784b6e0 100644
--- a/src/libs/advanceddockingsystem/dockwidgettab.cpp
+++ b/src/libs/advanceddockingsystem/dockwidgettab.cpp
@@ -201,6 +201,9 @@ namespace ADS
         boxLayout->addSpacing(qRound(spacing * 4.0 / 3.0));
         boxLayout->setAlignment(Qt::AlignCenter | Qt::AlignVCenter);
 
+        if (DockManager::testConfigFlag(DockManager::FocusHighlighting))
+            m_closeButton->setCheckable(true);
+
         m_titleLabel->setVisible(true);
     }
 
@@ -425,7 +428,6 @@ namespace ADS
                 setFocus(Qt::OtherFocusReason);
                 updateFocusStyle = true;
             }
-
             if (d->m_isActiveTab == active) {
                 if (updateFocusStyle)
                     updateStyle();
@@ -527,6 +529,7 @@ namespace ADS
             d->m_titleLabel->setToolTip(text);
         }
 #endif
+
         return Super::event(event);
     }
 
@@ -547,6 +550,13 @@ namespace ADS
 
     void DockWidgetTab::updateStyle()
     {
+        if (DockManager::testConfigFlag(DockManager::FocusHighlighting)) {
+            if (property("focused").toBool())
+                d->m_closeButton->setChecked(true);
+            else
+                d->m_closeButton->setChecked(false);
+        }
+
         internal::repolishStyle(this, internal::RepolishDirectChildren);
     }
 
diff --git a/src/plugins/qmldesigner/components/resources/dockwidgets.css b/src/plugins/qmldesigner/components/resources/dockwidgets.css
index 0aac817fbc..3eb3c5a045 100644
--- a/src/plugins/qmldesigner/components/resources/dockwidgets.css
+++ b/src/plugins/qmldesigner/components/resources/dockwidgets.css
@@ -148,7 +148,7 @@ ADS--DockWidgetTab[focused="true"] > #tabCloseButton:pressed {
 }
 
 ADS--DockWidgetTab[focused="true"] QLabel {
-    color: palette(creatorTheme.QmlDesigner_TabDark);
+    color: palette(creatorTheme.DStextColor);
 }
 
 ADS--DockAreaTitleBar {
diff --git a/src/plugins/qmldesigner/designmodewidget.cpp b/src/plugins/qmldesigner/designmodewidget.cpp
index 64b72c3291..d17bf5a10c 100644
--- a/src/plugins/qmldesigner/designmodewidget.cpp
+++ b/src/plugins/qmldesigner/designmodewidget.cpp
@@ -238,19 +238,32 @@ void DesignModeWidget::setup()
     m_dockManager->setStyleSheet(Theme::replaceCssColors(sheet));
 
     // Setup icons
-    QColor buttonColor(Theme::getColor(Theme::QmlDesigner_TabLight)); // TODO Use correct color roles
-    QColor tabColor(Theme::getColor(Theme::QmlDesigner_TabDark));
+    const QColor buttonColor(Theme::getColor(Theme::QmlDesigner_TabLight)); // TODO Use correct color roles
+    const QColor tabColor(Theme::getColor(Theme::QmlDesigner_TabDark));
 
     const QString closeUnicode = Theme::getIconUnicode(Theme::Icon::adsClose);
     const QString menuUnicode = Theme::getIconUnicode(Theme::Icon::adsDropDown);
     const QString undockUnicode = Theme::getIconUnicode(Theme::Icon::adsDetach);
 
     const QString fontName = "qtds_propertyIconFont.ttf";
-    const QIcon tabsCloseIcon = Utils::StyleHelper::getIconFromIconFont(fontName, closeUnicode, 28, 28, tabColor);
     const QIcon menuIcon = Utils::StyleHelper::getIconFromIconFont(fontName, menuUnicode, 28, 28, buttonColor);
     const QIcon undockIcon = Utils::StyleHelper::getIconFromIconFont(fontName, undockUnicode, 28, 28, buttonColor);
     const QIcon closeIcon = Utils::StyleHelper::getIconFromIconFont(fontName, closeUnicode, 28, 28, buttonColor);
 
+    auto closeIconNormal = Utils::StyleHelper::IconFontHelper(closeUnicode,
+                                                              tabColor,
+                                                              QSize(28, 28),
+                                                              QIcon::Normal,
+                                                              QIcon::Off);
+
+    auto closeIconFocused = Utils::StyleHelper::IconFontHelper(closeUnicode,
+                                                               Theme::getColor(Theme::DStextColor),
+                                                               QSize(28, 28),
+                                                               QIcon::Normal,
+                                                               QIcon::On);
+
+    const QIcon tabsCloseIcon = Utils::StyleHelper::getIconFromIconFont(fontName, {closeIconNormal, closeIconFocused});
+
     m_dockManager->iconProvider().registerCustomIcon(ADS::TabCloseIcon, tabsCloseIcon);
     m_dockManager->iconProvider().registerCustomIcon(ADS::DockAreaMenuIcon, menuIcon);
     m_dockManager->iconProvider().registerCustomIcon(ADS::DockAreaUndockIcon, undockIcon);