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>
This commit is contained in:
Henning Gruendl
2020-07-13 17:24:49 +02:00
committed by Henning Gründl
parent 520c70bd8c
commit c113a7e851
3 changed files with 28 additions and 5 deletions

View File

@@ -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);
}

View File

@@ -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 {

View File

@@ -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);