ExtensionManager: Draw icon of disabled items with less intensity

Since recently, the green background is used for enabled plugins and
grey is for disabled ones. With that change comes the requirement to
draw the icon for disabled icons with less intensity, to make it really
appear disabled.

I took this opportunity to unify the drawing of small/big enabled/
disabled pack/extension icon variants in a central helper function.

Change-Id: Ia68218c774ccb8e9e7ed48620ac36f4bca0724fd
Reviewed-by: Cristian Adam <cristian.adam@qt.io>

src/plugins/extensionmanager/extensionmanagerwidget.cpp

@@ -113,7 +113,6 @@ private:
 
 class HeadingWidget : public QWidget
 {
-    static constexpr QSize iconBgS{68, 68};
     static constexpr int dividerH = 16;
 
     Q_OBJECT
@@ -123,7 +122,7 @@ public:
         : QWidget(parent)
     {
         m_icon = new QLabel;
-        m_icon->setFixedSize(iconBgS);
+        m_icon->setFixedSize(iconBgSizeBig);
 
         static const TextFormat titleTF
             {Theme::Token_Text_Default, UiElementH4};
@@ -200,7 +199,7 @@ public:
         if (!current.isValid())
             return;
 
-        m_icon->setPixmap(icon(current));
+        m_icon->setPixmap(itemIcon(current, SizeBig));
 
         const QString name = current.data(RoleName).toString();
         m_title->setText(name);
@@ -236,32 +235,6 @@ signals:
     void vendorClicked(const QString &vendor);
 
 private:
-    static QPixmap icon(const QModelIndex &index)
-    {
-        const qreal dpr = qApp->devicePixelRatio();
-        QPixmap pixmap(iconBgS * dpr);
-        pixmap.fill(Qt::transparent);
-        pixmap.setDevicePixelRatio(dpr);
-        const QRect bgR(QPoint(), pixmap.deviceIndependentSize().toSize());
-
-        QPainter p(&pixmap);
-        QLinearGradient gradient(bgR.topRight(), bgR.bottomLeft());
-        gradient.setStops(iconGradientStops(index));
-        constexpr int iconRectRounding = 4;
-        WelcomePageHelpers::drawCardBackground(&p, bgR, gradient, Qt::NoPen, iconRectRounding);
-
-        // Icon
-        constexpr Theme::Color color = Theme::Token_Basic_White;
-        static const QIcon pack = Icon({{":/extensionmanager/images/packbig.png", color}},
-                                       Icon::Tint).icon();
-        static const QIcon extension = Icon({{":/extensionmanager/images/extensionbig.png",
-                                              color}}, Icon::Tint).icon();
-        const ItemType itemType = index.data(RoleItemType).value<ItemType>();
-        (itemType == ItemTypePack ? pack : extension).paint(&p, bgR);
-
-        return pixmap;
-    }
-
     QLabel *m_icon;
     QLabel *m_title;
     Button *m_vendor;

src/plugins/extensionmanager/extensionsbrowser.cpp

@@ -61,7 +61,6 @@ class ExtensionItemDelegate : public QItemDelegate
 {
 public:
     constexpr static QSize dividerS{1, 16};
-    constexpr static QSize iconBgS{50, 50};
     constexpr static TextFormat itemNameTF
         {Theme::Token_Text_Default, UiElement::UiElementH6};
     constexpr static TextFormat countTF
@@ -102,15 +101,15 @@ public:
         const QRect bgRGlobal = option.rect.adjusted(0, 0, -gapSize, -gapSize);
         const QRect bgR = bgRGlobal.translated(-option.rect.topLeft());
 
-        const int middleColumnW = bgR.width() - ExPaddingGapL - iconBgS.width() - ExPaddingGapL
+        const int middleColumnW = bgR.width() - ExPaddingGapL - iconBgSizeSmall.width()
-                                  - ExPaddingGapL;
+                - ExPaddingGapL - ExPaddingGapL;
 
         int x = bgR.x();
         int y = bgR.y();
         x += ExPaddingGapL;
-        const QRect iconBgR(x, y + (bgR.height() - iconBgS.height()) / 2,
+        const QRect iconBgR(x, y + (bgR.height() - iconBgSizeSmall.height()) / 2,
-                            iconBgS.width(), iconBgS.height());
+                            iconBgSizeSmall.width(), iconBgSizeSmall.height());
-        x += iconBgS.width() + ExPaddingGapL;
+        x += iconBgSizeSmall.width() + ExPaddingGapL;
         y += ExPaddingGapL;
         const QRect itemNameR(x, y, middleColumnW, itemNameTF.lineHeight());
         const QString itemName = index.data().toString();
@@ -142,18 +141,8 @@ public:
             WelcomePageHelpers::drawCardBackground(painter, bgR, fillColor, strokeColor);
         }
         {
-            QLinearGradient gradient(iconBgR.topRight(), iconBgR.bottomLeft());
+            const QPixmap icon = itemIcon(index, SizeSmall);
-            gradient.setStops(iconGradientStops(index));
+            painter->drawPixmap(iconBgR.topLeft(), icon);
-            constexpr int iconRectRounding = 4;
-            drawCardBackground(painter, iconBgR, gradient, Qt::NoPen, iconRectRounding);
-
-            // Icon
-            constexpr Theme::Color color = Theme::Token_Basic_White;
-            static const QIcon pack = Icon({{":/extensionmanager/images/packsmall.png", color}},
-                                           Icon::Tint).icon();
-            static const QIcon extension = Icon({{":/extensionmanager/images/extensionsmall.png",
-                                                  color}}, Icon::Tint).icon();
-            (isPack ? pack : extension).paint(painter, iconBgR);
         }
         if (isPack) {
             constexpr int circleSize = 18;
@@ -241,7 +230,7 @@ public:
             + tagsTF.lineHeight();
         const int height =
             ExPaddingGapL
-            + qMax(iconBgS.height(), middleColumnH)
+            + qMax(iconBgSizeSmall.height(), middleColumnH)
             + ExPaddingGapL;
         return {cellWidth, height + gapSize};
     }
@@ -462,20 +451,48 @@ QLabel *tfLabel(const TextFormat &tf, bool singleLine)
     return label;
 }
 
-QGradientStops iconGradientStops(const QModelIndex &index)
+QPixmap itemIcon(const QModelIndex &index, Size size)
 {
-    const PluginSpec *ps = pluginSpecForName(index.data(RoleName).toString());
+    const QSize iconBgS = size == SizeSmall ? iconBgSizeSmall : iconBgSizeBig;
-    const bool greenGradient = ps != nullptr && ps->isEffectivelyEnabled();
+    const qreal dpr = qApp->devicePixelRatio();
+    QPixmap pixmap(iconBgS * dpr);
+    pixmap.fill(Qt::transparent);
+    pixmap.setDevicePixelRatio(dpr);
+    const QRect iconBgR(QPoint(), pixmap.deviceIndependentSize().toSize());
 
-    const QColor startColor = creatorColor(greenGradient ? Theme::Token_Gradient01_Start
+    const PluginSpec *ps = pluginSpecForName(index.data(RoleName).toString());
-                                                         : Theme::Token_Gradient02_Start);
+    const bool isEnabled = ps == nullptr || ps->isEffectivelyEnabled();
-    const QColor endColor = creatorColor(greenGradient ? Theme::Token_Gradient01_End
+    const QGradientStops gradientStops = {
-                                                       : Theme::Token_Gradient02_End);
+        {0, creatorColor(isEnabled ? Theme::Token_Gradient01_Start
-    const QGradientStops gradient = {
+                                   : Theme::Token_Gradient02_Start)},
-        {0, startColor},
+        {1, creatorColor(isEnabled ? Theme::Token_Gradient01_End
-        {1, endColor},
+                                   : Theme::Token_Gradient02_End)},
     };
-    return gradient;
+
+    const Theme::Color color = Theme::Token_Basic_White;
+    static const QIcon packS = Icon({{":/extensionmanager/images/packsmall.png", color}},
+                                    Icon::Tint).icon();
+    static const QIcon packB = Icon({{":/extensionmanager/images/packbig.png", color}},
+                                    Icon::Tint).icon();
+    static const QIcon extensionS = Icon({{":/extensionmanager/images/extensionsmall.png",
+                                           color}}, Icon::Tint).icon();
+    static const QIcon extensionB = Icon({{":/extensionmanager/images/extensionbig.png",
+                                           color}}, Icon::Tint).icon();
+    const ItemType itemType = index.data(RoleItemType).value<ItemType>();
+    const QIcon &icon = (itemType == ItemTypePack) ? (size == SizeSmall ? packS : packB)
+                                                   : (size == SizeSmall ? extensionS : extensionB);
+    const int iconRectRounding = 4;
+    const qreal iconOpacityDisabled = 0.6;
+
+    QPainter p(&pixmap);
+    QLinearGradient gradient(iconBgR.topRight(), iconBgR.bottomLeft());
+    gradient.setStops(gradientStops);
+    WelcomePageHelpers::drawCardBackground(&p, iconBgR, gradient, Qt::NoPen, iconRectRounding);
+    if (!isEnabled)
+        p.setOpacity(iconOpacityDisabled);
+    icon.paint(&p, iconBgR);
+
+    return pixmap;
 }
 
 } // ExtensionManager::Internal

src/plugins/extensionmanager/extensionsbrowser.h

@@ -40,6 +40,13 @@ private:
 };
 
 QLabel *tfLabel(const Core::WelcomePageHelpers::TextFormat &tf, bool singleLine = true);
-QGradientStops iconGradientStops(const QModelIndex &index);
+
+constexpr static QSize iconBgSizeSmall{50, 50};
+constexpr static QSize iconBgSizeBig{68, 68};
+enum Size {
+    SizeSmall,
+    SizeBig,
+};
+QPixmap itemIcon(const QModelIndex &index, Size size);
 
 } // ExtensionManager::Internal