diff --git a/src/libs/utils/stylehelper.cpp b/src/libs/utils/stylehelper.cpp index 5f305abf16e..b5e282c54d9 100644 --- a/src/libs/utils/stylehelper.cpp +++ b/src/libs/utils/stylehelper.cpp @@ -698,7 +698,7 @@ QIcon StyleHelper::getIconFromIconFont(const QString &fontName, const QString &i painter.save(); painter.setPen(color); painter.setFont(font); - painter.drawText(QRectF(QPoint(0, 0), size), iconSymbol); + painter.drawText(QRectF(QPoint(0, 0), size), Qt::AlignCenter, iconSymbol); painter.restore(); icon.addPixmap(pixmap); diff --git a/src/plugins/qmldesigner/components/navigator/navigatorsearchwidget.cpp b/src/plugins/qmldesigner/components/navigator/navigatorsearchwidget.cpp index c602c70734b..e184ba2a585 100644 --- a/src/plugins/qmldesigner/components/navigator/navigatorsearchwidget.cpp +++ b/src/plugins/qmldesigner/components/navigator/navigatorsearchwidget.cpp @@ -20,25 +20,22 @@ LineEdit::LineEdit(QWidget *parent) clearButton = new QToolButton(this); const QString fontName = "qtds_propertyIconFont.ttf"; - const int searchIconSize = 16; - const int clearIconSize = 12; - const QColor iconColor(QmlDesigner::Theme::getColor(QmlDesigner::Theme::DSiconColor)); + const int clearIconSize = 10; + const QColor iconColor(QmlDesigner::Theme::getColor(QmlDesigner::Theme::DStextColor)); - const QIcon searchIcon - = Utils::StyleHelper::getIconFromIconFont(fontName, - QmlDesigner::Theme::getIconUnicode( - QmlDesigner::Theme::Icon::search), - searchIconSize, - searchIconSize, - iconColor); + const QIcon searchIcon = Utils::StyleHelper::getIconFromIconFont( + fontName, + QmlDesigner::Theme::getIconUnicode(QmlDesigner::Theme::Icon::search_small), + 10, + 16, + iconColor); - const QIcon clearIcon - = Utils::StyleHelper::getIconFromIconFont(fontName, - QmlDesigner::Theme::getIconUnicode( - QmlDesigner::Theme::Icon::closeCross), - clearIconSize, - clearIconSize, - iconColor); + const QIcon clearIcon = Utils::StyleHelper::getIconFromIconFont( + fontName, + QmlDesigner::Theme::getIconUnicode(QmlDesigner::Theme::Icon::close_small), + clearIconSize, + clearIconSize, + iconColor); addAction(searchIcon, QLineEdit::LeadingPosition); @@ -46,9 +43,9 @@ LineEdit::LineEdit(QWidget *parent) clearButton->setIconSize(QSize(clearIconSize, clearIconSize)); clearButton->setCursor(Qt::ArrowCursor); clearButton->hide(); - clearButton->setStyleSheet(Theme::replaceCssColors( - QString("QToolButton { border: none; padding: 0px; }" - "QToolButton:hover { background: creatorTheme.DScontrolBackgroundHover; }"))); + clearButton->setStyleSheet( + Theme::replaceCssColors(QString("QToolButton { border: none; padding: 0px; }" + "QToolButton:hover {}"))); setClearButtonEnabled(false); @@ -56,8 +53,20 @@ LineEdit::LineEdit(QWidget *parent) connect(this, &QLineEdit::textChanged, this, &LineEdit::updateClearButton); int frameWidth = style()->pixelMetric(QStyle::PM_DefaultFrameWidth); - setStyleSheet(QString("QLineEdit { padding-right: %1px; } ") - .arg(clearButton->sizeHint().width() + frameWidth + 8)); + setStyleSheet(Theme::replaceCssColors( + QString("QLineEdit { padding-right: %1px; border-radius: 4;" + "color: creatorTheme.DStextColor;" + "border-color: creatorTheme.DScontrolOutline_topToolbarIdle;" + "background: creatorTheme.DStoolbarBackground; }" + "QLineEdit:hover {" + "color: creatorTheme.DStextColor;" + "border-color: creatorTheme.DScontrolOutline_topToolbarHover;" + "background: creatorTheme.DScontrolBackground_toolbarHover; }" + "QLineEdit:focus {" + "color: creatorTheme.DStextColor;" + "border-color: creatorTheme.DSinteraction;" + "background: creatorTheme.DStoolbarBackground; }") + .arg(clearButton->sizeHint().width() + frameWidth + 8))); setFixedHeight(29); } @@ -81,7 +90,7 @@ NavigatorSearchWidget::NavigatorSearchWidget(QWidget *parent) { auto layout = new QBoxLayout(QBoxLayout::LeftToRight); layout->setSpacing(0); - layout->setContentsMargins(5, 5, 5, 3); + layout->setContentsMargins(10, 6, 10, 6); setLayout(layout); m_textField = new LineEdit; @@ -91,6 +100,12 @@ NavigatorSearchWidget::NavigatorSearchWidget(QWidget *parent) connect(m_textField, &QLineEdit::textChanged, this, &NavigatorSearchWidget::textChanged); layout->addWidget(m_textField); + + setFixedHeight(Theme::toolbarSize()); + QPalette pal = QPalette(); + pal.setColor(QPalette::Window, Theme::getColor(Utils::Theme::DStoolbarBackground)); + setAutoFillBackground(true); + setPalette(pal); } void NavigatorSearchWidget::clear() diff --git a/src/plugins/qmldesigner/components/navigator/navigatorwidget.cpp b/src/plugins/qmldesigner/components/navigator/navigatorwidget.cpp index 41857346762..5b94a0a0510 100644 --- a/src/plugins/qmldesigner/components/navigator/navigatorwidget.cpp +++ b/src/plugins/qmldesigner/components/navigator/navigatorwidget.cpp @@ -45,15 +45,17 @@ NavigatorWidget::NavigatorWidget(NavigatorView *view) layout->setSpacing(0); layout->setContentsMargins(0, 0, 0, 0); - QWidget *toolBar = createToolBar(); + m_searchWidget = new NavigatorSearchWidget(); + connect(m_searchWidget, + &NavigatorSearchWidget::textChanged, + this, + &NavigatorWidget::textFilterChanged); + layout->addWidget(m_searchWidget); + QWidget *toolBar = createToolBar(); toolBar->setParent(this); layout->addWidget(toolBar); - m_searchWidget = new NavigatorSearchWidget(); - connect(m_searchWidget, &NavigatorSearchWidget::textChanged, this, &NavigatorWidget::textFilterChanged); - layout->addWidget(m_searchWidget); - layout->addWidget(m_treeView); setLayout(layout); @@ -76,13 +78,17 @@ QTreeView *NavigatorWidget::treeView() const return m_treeView; } -QList NavigatorWidget::createToolBarWidgets() +QList NavigatorWidget::createToolBarWidgets() { - QList buttons; + QList buttons; + + auto empty = new QWidget(); + empty->setFixedWidth(5); + empty->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Preferred); + buttons.append(empty); auto button = new QToolButton(); button->setIcon(Theme::iconFromName(Theme::Icon::moveUpwards_medium)); - // button->setIcon(Icons::ARROW_LEFT.icon()); button->setToolTip(tr("Become last sibling of parent (CTRL + Left).")); button->setShortcut(QKeySequence(Qt::Key_Left | Qt::CTRL)); connect(button, &QAbstractButton::clicked, this, &NavigatorWidget::leftButtonClicked); @@ -90,7 +96,6 @@ QList NavigatorWidget::createToolBarWidgets() button = new QToolButton(); button->setIcon(Theme::iconFromName(Theme::Icon::moveInwards_medium)); - //button->setIcon(Icons::ARROW_RIGHT.icon()); button->setToolTip(tr("Become child of last sibling (CTRL + Right).")); button->setShortcut(QKeySequence(Qt::Key_Right | Qt::CTRL)); connect(button, &QAbstractButton::clicked, this, &NavigatorWidget::rightButtonClicked); @@ -98,7 +103,6 @@ QList NavigatorWidget::createToolBarWidgets() button = new QToolButton(); button->setIcon(Theme::iconFromName(Theme::Icon::moveDown_medium)); - //button->setIcon(Icons::ARROW_DOWN.icon()); button->setToolTip(tr("Move down (CTRL + Down).")); button->setShortcut(QKeySequence(Qt::Key_Down | Qt::CTRL)); connect(button, &QAbstractButton::clicked, this, &NavigatorWidget::downButtonClicked); @@ -106,45 +110,64 @@ QList NavigatorWidget::createToolBarWidgets() button = new QToolButton(); button->setIcon(Theme::iconFromName(Theme::Icon::moveUp_medium)); - //button->setIcon(Icons::ARROW_UP.icon()); button->setToolTip(tr("Move up (CTRL + Up).")); button->setShortcut(QKeySequence(Qt::Key_Up | Qt::CTRL)); connect(button, &QAbstractButton::clicked, this, &NavigatorWidget::upButtonClicked); buttons.append(button); - auto filter = new QToolButton; - filter->setIcon(Utils::Icons::FILTER.icon()); - filter->setToolTip(tr("Filter Tree")); - filter->setPopupMode(QToolButton::InstantPopup); - filter->setProperty("noArrow", true); - auto filterMenu = new QMenu(filter); - auto filterAction = new QAction(tr("Show Only Visible Components"), nullptr); - filterAction->setCheckable(true); + empty = new QWidget(); + empty->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Preferred); + buttons.append(empty); - bool filterFlag = QmlDesignerPlugin::settings().value(DesignerSettingsKey::NAVIGATOR_SHOW_ONLY_VISIBLE_ITEMS).toBool(); - filterAction->setChecked(filterFlag); + // Show Only Visible Components + auto visibleIcon = Theme::iconFromName(Theme::Icon::visible_medium); + auto invisibleIcon = Theme::iconFromName(Theme::Icon::invisible_medium, + Theme::getColor(Theme::Color::DStextSelectedTextColor)); + QIcon vIcon; + vIcon.addPixmap(invisibleIcon.pixmap({16, 16}), QIcon::Normal, QIcon::On); + vIcon.addPixmap(visibleIcon.pixmap({16, 16}), QIcon::Normal, QIcon::Off); - connect(filterAction, &QAction::toggled, this, &NavigatorWidget::filterToggled); - filterMenu->addAction(filterAction); + button = new QToolButton(); + button->setIcon(vIcon); + button->setCheckable(true); + bool visibleFlag = QmlDesignerPlugin::settings() + .value(DesignerSettingsKey::NAVIGATOR_SHOW_ONLY_VISIBLE_ITEMS) + .toBool(); + button->setChecked(visibleFlag); + button->setToolTip(tr("Show Only Visible Components")); + connect(button, &QAbstractButton::toggled, this, &NavigatorWidget::filterToggled); + buttons.append(button); - auto reverseAction = new QAction(tr("Reverse Component Order"), nullptr); - reverseAction->setCheckable(true); + // Reverse Component Order + auto reverseOffIcon = Theme::iconFromName(Theme::Icon::reverseOrder_medium); + auto reverseOnIcon = Theme::iconFromName(Theme::Icon::reverseOrder_medium, + Theme::getColor(Theme::Color::DStextSelectedTextColor)); + QIcon rIcon; + rIcon.addPixmap(reverseOnIcon.pixmap({16, 16}), QIcon::Normal, QIcon::On); + rIcon.addPixmap(reverseOffIcon.pixmap({16, 16}), QIcon::Normal, QIcon::Off); - bool reverseFlag = QmlDesignerPlugin::settings().value(DesignerSettingsKey::NAVIGATOR_REVERSE_ITEM_ORDER).toBool(); - reverseAction->setChecked(reverseFlag); + button = new QToolButton(); + button->setIcon(rIcon); + button->setCheckable(true); + bool reverseFlag = QmlDesignerPlugin::settings() + .value(DesignerSettingsKey::NAVIGATOR_REVERSE_ITEM_ORDER) + .toBool(); + button->setChecked(reverseFlag); + button->setToolTip(tr("Reverse Component Order")); + connect(button, &QAbstractButton::toggled, this, &NavigatorWidget::reverseOrderToggled); + buttons.append(button); - connect(reverseAction, &QAction::toggled, this, &NavigatorWidget::reverseOrderToggled); - filterMenu->addAction(reverseAction); - - filter->setMenu(filterMenu); - buttons.append(filter); + empty = new QWidget(); + empty->setFixedWidth(5); + empty->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Preferred); + buttons.append(empty); return buttons; } QToolBar *NavigatorWidget::createToolBar() { - const QList buttons = createToolBarWidgets(); + const QList buttons = createToolBarWidgets(); auto toolBar = new QToolBar(); toolBar->setFixedHeight(Theme::toolbarSize()); diff --git a/src/plugins/qmldesigner/components/navigator/navigatorwidget.h b/src/plugins/qmldesigner/components/navigator/navigatorwidget.h index 4b98cbfc16c..1e63f66908f 100644 --- a/src/plugins/qmldesigner/components/navigator/navigatorwidget.h +++ b/src/plugins/qmldesigner/components/navigator/navigatorwidget.h @@ -28,7 +28,7 @@ public: void setTreeModel(QAbstractItemModel *model); QTreeView *treeView() const; - QList createToolBarWidgets(); + QList createToolBarWidgets(); QToolBar *createToolBar(); void contextHelp(const Core::IContext::HelpCallback &callback) const; diff --git a/src/plugins/qmldesigner/components/resources/stylesheet.css b/src/plugins/qmldesigner/components/resources/stylesheet.css index 501e9ab1d5d..59695898fee 100644 --- a/src/plugins/qmldesigner/components/resources/stylesheet.css +++ b/src/plugins/qmldesigner/components/resources/stylesheet.css @@ -95,3 +95,19 @@ QLineEdit:focus { background-color: creatorTheme.DScontrolBackgroundInteraction; border-color: creatorTheme.DScontrolOutlineInteraction; } + +QToolBar QToolButton { + border: none; + padding: 0px; + width: 29px; min-width: 29px; max-width: 29px; + height: 29px; min-height: 29px; max-height: 29px; + border-radius: 4px; +} + +QToolBar QToolButton:hover { + background-color: creatorTheme.DScontrolBackground_topToolbarHover; +} + +QToolBar QToolButton:checked { + background-color: creatorTheme.DSinteraction; +}