Core: High-Dpi progress bar

Also tweaking the ProgressBar painting code. The cancel cross was
slightly messed up lately, since line drawing changed in Qt5. The
progress bar is one pixel taller and the cancel button mouse area is
slightly larger.

Change-Id: Id55c21f45529332dc6abfc03b53f149e8349a9a0
Reviewed-by: Alessandro Portale <alessandro.portale@digia.com>

src/plugins/coreplugin/core.qrc

@@ -58,6 +58,7 @@
         <file>images/category_design.png</file>
         <file>editormanager/BinFiles.mimetypes.xml</file>
         <file>images/progressbar.png</file>
+        <file>images/progressbar@2x.png</file>
         <file>images/help.png</file>
         <file>images/editclear.png</file>
         <file>images/editclear@2x.png</file>

src/plugins/coreplugin/progressmanager/progressbar.cpp

@@ -40,8 +40,8 @@
 using namespace Core;
 using namespace Core::Internal;
 
-static const int PROGRESSBAR_HEIGHT = 12;
+static const int PROGRESSBAR_HEIGHT = 13;
-static const int CANCELBUTTON_SIZE = 15;
+static const int CANCELBUTTON_WIDTH = 16;
 static const int SEPARATOR_HEIGHT = 2;
 
 ProgressBar::ProgressBar(QWidget *parent)
@@ -200,14 +200,8 @@ namespace { const int INDENT = 6; }
 void ProgressBar::mousePressEvent(QMouseEvent *event)
 {
     if (m_cancelEnabled) {
-        QFontMetrics fm(titleFont());
-        int titleHeight = m_titleVisible ? fm.height() : 0;
-        int separatorHeight = m_separatorVisible ? SEPARATOR_HEIGHT : 0;
-        QRect rect(INDENT - 1, titleHeight + separatorHeight + 6, size().width()-2*INDENT + 1, m_progressHeight-1);
-        QRect cancelRect(rect.adjusted(rect.width() - CANCELBUTTON_SIZE, 1, -1, 0));
-
         if (event->modifiers() == Qt::NoModifier
-            && cancelRect.contains(event->pos())) {
+            && m_cancelRect.contains(event->pos())) {
             event->accept();
             emit clicked();
             return;
@@ -235,7 +229,7 @@ void ProgressBar::paintEvent(QPaintEvent *)
     // TODO use Utils::StyleHelper white
 
     if (bar.isNull())
-        bar.load(QLatin1String(":/core/images/progressbar.png"));
+        bar.load(Utils::StyleHelper::dpiSpecificImageFile(QLatin1String(":/core/images/progressbar.png")));
 
     double range = maximum() - minimum();
     double percent = 0.;
@@ -290,17 +284,16 @@ void ProgressBar::paintEvent(QPaintEvent *)
     m_progressHeight = PROGRESSBAR_HEIGHT;
     m_progressHeight += ((m_progressHeight % 2) + 1) % 2; // make odd
     // draw outer rect
-    QRect rect(INDENT - 1, titleHeight + separatorHeight + 4, size().width()-2*INDENT + 1, m_progressHeight-1);
+    const QRect rect(INDENT - 1, titleHeight + separatorHeight + (m_titleVisible ? 4 : 3),
-    p.setPen(Utils::StyleHelper::panelTextColor());
+                     size().width() - 2 * INDENT + 1, m_progressHeight);
-    Utils::StyleHelper::drawCornerImage(bar, &p, rect, 4, 2, 3, 2);
+    Utils::StyleHelper::drawCornerImage(bar, &p, rect, 3, 3, 3, 3);
 
     // draw inner rect
     QColor c = Utils::StyleHelper::panelTextColor();
     c.setAlpha(180);
     p.setPen(Qt::NoPen);
 
-
+    QRectF inner = rect.adjusted(2, 2, -2, -2);
-    QRect inner = rect.adjusted(3, 2, -2, -2);
     inner.adjust(0, 0, qRound((percent - 1) * inner.width()), 0);
     if (m_error) {
         QColor red(255, 60, 0, 210);
@@ -314,53 +307,52 @@ void ProgressBar::paintEvent(QPaintEvent *)
 
     // Draw line and shadow after the gradient fill
     if (value() > 0 && value() < maximum()) {
-        p.fillRect(QRect(inner.right() + 1, inner.top(), 2, inner.height()), QColor(0, 0, 0, 20));
+        p.fillRect(QRect(inner.right(), inner.top(), 2, inner.height()), QColor(0, 0, 0, 20));
-        p.fillRect(QRect(inner.right() + 1, inner.top(), 1, inner.height()), QColor(0, 0, 0, 60));
+        p.fillRect(QRect(inner.right(), inner.top(), 1, inner.height()), QColor(0, 0, 0, 60));
     }
     QLinearGradient grad(inner.topLeft(), inner.bottomLeft());
     grad.setColorAt(0, c.lighter(130));
-    grad.setColorAt(0.5, c.lighter(106));
+    grad.setColorAt(0.4, c.lighter(106));
-    grad.setColorAt(0.51, c.darker(106));
+    grad.setColorAt(0.41, c.darker(106));
     grad.setColorAt(1, c.darker(130));
     p.setPen(Qt::NoPen);
     p.setBrush(grad);
     p.drawRect(inner);
     p.setBrush(Qt::NoBrush);
     p.setPen(QPen(QColor(0, 0, 0, 30), 1));
-    p.drawLine(inner.topLeft(), inner.topRight());
+
-    p.drawLine(inner.topLeft(), inner.bottomLeft());
+    p.drawLine(inner.topLeft() + QPointF(0.5, 0.5), inner.topRight() + QPointF(-0.5, 0.5));
-    p.drawLine(inner.topRight(), inner.bottomRight());
+    p.drawLine(inner.topLeft() + QPointF(0.5, 0.5), inner.bottomLeft() + QPointF(0.5, -0.5));
-    p.drawLine(inner.bottomLeft(), inner.bottomRight());
+    p.drawLine(inner.topRight() + QPointF(-0.5, 0.5), inner.bottomRight() + QPointF(-0.5, -0.5));
-    p.drawPoint(inner.bottomLeft());
+    p.drawLine(inner.bottomLeft() + QPointF(0.5, -0.5), inner.bottomRight() + QPointF(-0.5, -0.5));
-    p.drawPoint(inner.bottomRight());
 
     if (m_cancelEnabled) {
         // Draw cancel button
         p.setOpacity(m_cancelButtonFader);
 
         if (value() < maximum() && !m_error) {
-            QRect cancelRect(rect.adjusted(rect.width() - CANCELBUTTON_SIZE, 1, -1, 0));
+            m_cancelRect = QRect(rect.adjusted(rect.width() - CANCELBUTTON_WIDTH + 2, 1, 0, 0));
-            bool hover = cancelRect.contains(mapFromGlobal(QCursor::pos()));
+            const bool hover = m_cancelRect.contains(mapFromGlobal(QCursor::pos()));
-            QLinearGradient grad(cancelRect.topLeft(), cancelRect.bottomLeft());
+            const QRectF cancelVisualRect(m_cancelRect.adjusted(.5, 1.5, -2.5, -2.5));
+            QLinearGradient grad(cancelVisualRect.topLeft(), cancelVisualRect.bottomLeft());
             int intensity = hover ? 90 : 70;
             QColor buttonColor(intensity, intensity, intensity, 255);
             grad.setColorAt(0, buttonColor.lighter(130));
             grad.setColorAt(1, buttonColor.darker(130));
             p.setPen(Qt::NoPen);
             p.setBrush(grad);
-            p.drawRect(cancelRect.adjusted(1, 1, -1, -1));
+            p.drawRect(cancelVisualRect);
 
             p.setPen(QPen(QColor(0, 0, 0, 30)));
-            p.drawLine(cancelRect.topLeft() + QPoint(0,1), cancelRect.bottomLeft() + QPoint(0,-1));
+            p.drawLine(cancelVisualRect.topLeft() + QPointF(-0.5, 0.5), cancelVisualRect.bottomLeft() + QPointF(-0.5, -0.5));
             p.setPen(QPen(QColor(0, 0, 0, 120)));
-            p.drawLine(cancelRect.topLeft() + QPoint(1,1), cancelRect.bottomLeft() + QPoint(1,-1));
+            p.drawLine(cancelVisualRect.topLeft() + QPointF(0.5, 0.5), cancelVisualRect.bottomLeft() + QPointF(0.5, -0.5));
             p.setPen(QPen(QColor(255, 255, 255, 30)));
-            p.drawLine(cancelRect.topLeft() + QPoint(2,1), cancelRect.bottomLeft() + QPoint(2,-1));
+            p.drawLine(cancelVisualRect.topLeft() + QPointF(1.5, 0.5), cancelVisualRect.bottomLeft() + QPointF(1.5, -0.5));
-            p.setPen(QPen(hover ? Utils::StyleHelper::panelTextColor() : QColor(180, 180, 180), 1));
+            p.setPen(QPen(hover ? Utils::StyleHelper::panelTextColor() : QColor(180, 180, 180), 1.2, Qt::SolidLine, Qt::FlatCap));
-            p.setRenderHint(QPainter::Antialiasing);
+            p.setRenderHint(QPainter::Antialiasing, true);
-            p.translate(0.5, 0.5);
+            p.drawLine(cancelVisualRect.topLeft() + QPointF(4.0, 2.0), cancelVisualRect.bottomRight() + QPointF(-3.0, -2.0));
-            p.drawLine(cancelRect.center()+QPoint(-1,-2), cancelRect.center()+QPoint(+3,+2));
+            p.drawLine(cancelVisualRect.bottomLeft() + QPointF(4.0, -2.0), cancelVisualRect.topRight() + QPointF(-3.0, 2.0));
-            p.drawLine(cancelRect.center()+QPoint(+3,-2), cancelRect.center()+QPoint(-1,+2));
         }
     }
 }

src/plugins/coreplugin/progressmanager/progressbar.h

@@ -93,6 +93,7 @@ private:
     float m_cancelButtonFader;
     bool m_finished;
     bool m_error;
+    QRect m_cancelRect;
 };
 
 } // namespace Internal

src/tools/icons/qtcreatoricons.svg

@@ -18,6 +18,32 @@
    sodipodi:docname="qtcreatoricons.svg">
   <defs
      id="defs4">
+    <linearGradient
+       id="linearGradient4115">
+      <stop
+         style="stop-color:#373737;stop-opacity:0.07843138;"
+         offset="0"
+         id="stop4117" />
+      <stop
+         style="stop-color:#ffffff;stop-opacity:0.27450982;"
+         offset="1"
+         id="stop4119" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient4090">
+      <stop
+         style="stop-color:#070707;stop-opacity:0.30980393;"
+         offset="0"
+         id="stop4092" />
+      <stop
+         id="stop4099"
+         offset="0.875"
+         style="stop-color:#303030;stop-opacity:0.2;" />
+      <stop
+         style="stop-color:#2f2f2f;stop-opacity:0.25098041;"
+         offset="1"
+         id="stop4094" />
+    </linearGradient>
     <linearGradient
        id="linearGradient4072">
       <stop
@@ -537,6 +563,24 @@
        y1="502.5"
        x2="74"
        y2="517.5" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient4090"
+       id="linearGradient4128"
+       gradientUnits="userSpaceOnUse"
+       x1="181"
+       y1="589.5"
+       x2="181"
+       y2="597.5" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient4115"
+       id="linearGradient4130"
+       gradientUnits="userSpaceOnUse"
+       x1="181"
+       y1="587"
+       x2="181"
+       y2="599" />
   </defs>
   <sodipodi:namedview
      id="base"
@@ -545,11 +589,11 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="16"
+     inkscape:zoom="1"
-     inkscape:cx="193.42734"
+     inkscape:cx="381.31904"
-     inkscape:cy="26.302703"
+     inkscape:cy="185.84959"
      inkscape:document-units="px"
-     inkscape:current-layer="src/plugins/coreplugin/images/unlocked"
+     inkscape:current-layer="layer1"
      showgrid="true"
      showguides="true"
      inkscape:guide-bbox="true"
@@ -752,6 +796,33 @@
          x="155"
          y="584" />
     </g>
+    <g
+       id="src/plugins/coreplugin/images/progressbar">
+      <rect
+         ry="1"
+         y="588.5"
+         x="178.5"
+         height="10"
+         width="5"
+         id="rect3320"
+         style="fill:none;stroke:#232323;stroke-width:1;stroke-miterlimit:4;stroke-opacity:0.68627451;stroke-dasharray:none" />
+      <rect
+         style="fill:url(#linearGradient4128);fill-opacity:1"
+         id="rect4101"
+         width="4"
+         height="9"
+         x="179"
+         y="589"
+         ry="0.5" />
+      <rect
+         style="fill:none;stroke:url(#linearGradient4130);stroke-width:1;stroke-miterlimit:4;stroke-opacity:0.68627450999999995;stroke-dasharray:none"
+         id="rect4103"
+         width="7"
+         height="12"
+         x="177.5"
+         y="587.5"
+         ry="2" />
+    </g>
   </g>
   <g
      inkscape:groupmode="layer"