Make fancy tabbar background color configurable

src/core/mainwindow.cpp

@@ -929,6 +929,8 @@ void MainWindow::ReloadSettings() {
     ui_->tabs->DisableTab(subsonic_view_);
 #endif
 
+  ui_->tabs->ReloadSettings();
+
 }
 
 void MainWindow::ReloadAllSettings() {

src/settings/appearancesettingspage.cpp

@@ -36,6 +36,7 @@
 #include "appearancesettingspage.h"
 #include "core/appearance.h"
 #include "core/iconloader.h"
+#include "core/stylehelper.h"
 #include "playlist/playlistview.h"
 #include "covermanager/albumcoverchoicecontroller.h"
 #include "settingspage.h"
@@ -64,6 +65,10 @@ const int AppearanceSettingsPage::kDefaultOpacityLevel = 40;
 
 const char *AppearanceSettingsPage::kSystemThemeIcons = "system_icons";
 
+const char *AppearanceSettingsPage::kTabBarSystemColor= "tab_system_color";
+const char *AppearanceSettingsPage::kTabBarGradient = "tab_gradient";
+const char *AppearanceSettingsPage::kTabBarColor = "tab_color";
+
 AppearanceSettingsPage::AppearanceSettingsPage(SettingsDialog *dialog)
     : SettingsPage(dialog),
       ui_(new Ui_AppearanceSettingsPage),
@@ -101,6 +106,9 @@ AppearanceSettingsPage::AppearanceSettingsPage(SettingsDialog *dialog)
 
   connect(ui_->checkbox_background_image_keep_aspect_ratio, SIGNAL(toggled(bool)), ui_->checkbox_background_image_do_not_cut, SLOT(setEnabled(bool)));
 
+  connect(ui_->select_tabbar_color, SIGNAL(pressed()), SLOT(TabBarSelectBGColor()));
+  connect(ui_->tabbar_system_color, SIGNAL(toggled(bool)), SLOT(TabBarSystemColor(bool)));
+
   Load();
 
 }
@@ -126,10 +134,18 @@ void AppearanceSettingsPage::Load() {
 
   InitColorSelectorsColors();
 
-  s.endGroup();
+  // Tab widget BG color settings.
+  bool tabbar_system_color = s.value(kTabBarSystemColor, true).toBool();
+  ui_->tabbar_gradient->setChecked(s.value(kTabBarGradient, true).toBool());
+  ui_->tabbar_system_color->setChecked(tabbar_system_color);
+  ui_->tabbar_custom_color->setChecked(!tabbar_system_color);
+
+  current_tabbar_bg_color_ = s.value(kTabBarColor, StyleHelper::highlightColor()).value<QColor>();
+
+  UpdateColorSelectorColor(ui_->select_tabbar_color, current_tabbar_bg_color_);
+  TabBarSystemColor(ui_->tabbar_system_color->isChecked());
 
   // Playlist settings
-  s.beginGroup(kSettingsGroup);
   background_image_type_ = static_cast<BackgroundImageType>(s.value(kBackgroundImageType).toInt());
   background_image_filename_ = s.value(kBackgroundImageFilename).toString();
 
@@ -181,6 +197,8 @@ void AppearanceSettingsPage::Save() {
   }
   else {
     dialog()->appearance()->ResetToSystemDefaultTheme();
+    s.remove(kBackgroundColor);
+    s.remove(kForegroundColor);
   }
 
   background_image_filename_ = ui_->background_image_filename->text();
@@ -215,6 +233,10 @@ void AppearanceSettingsPage::Save() {
 
   s.setValue(kSystemThemeIcons, ui_->checkbox_system_icons->isChecked());
 
+  s.setValue(kTabBarSystemColor, ui_->tabbar_system_color->isChecked());
+  s.setValue(kTabBarGradient, ui_->tabbar_gradient->isChecked());
+  s.setValue(kTabBarColor, current_tabbar_bg_color_);
+
   s.endGroup();
 
 }
@@ -263,18 +285,25 @@ void AppearanceSettingsPage::UseCustomColorSetOptionChanged(bool checked) {
   }
   else {
     dialog()->appearance()->ResetToSystemDefaultTheme();
+    QPalette p = QApplication::palette();
+    current_foreground_color_ = p.color(QPalette::WindowText);
+    current_background_color_ = p.color(QPalette::Window);
+    UpdateColorSelectorColor(ui_->select_foreground_color, current_foreground_color_);
+    UpdateColorSelectorColor(ui_->select_background_color, current_background_color_);
   }
 
 }
 
 void AppearanceSettingsPage::InitColorSelectorsColors() {
+
   UpdateColorSelectorColor(ui_->select_foreground_color, current_foreground_color_);
   UpdateColorSelectorColor(ui_->select_background_color, current_background_color_);
+
 }
 
 void AppearanceSettingsPage::UpdateColorSelectorColor(QWidget *color_selector, const QColor &color) {
 
-  QString css = QString("background-color: rgb(%1, %2, %3); color: rgb(255, 255, 255)").arg(color.red()).arg(color.green()).arg(color.blue());
+  QString css = QString("background-color: rgb(%1, %2, %3); color: rgb(255, 255, 255); border: 1px dotted black;").arg(color.red()).arg(color.green()).arg(color.blue());
   color_selector->setStyleSheet(css);
 
 }
@@ -295,3 +324,25 @@ void AppearanceSettingsPage::BlurLevelChanged(int value) {
 void AppearanceSettingsPage::OpacityLevelChanged(int percent) {
   ui_->background_opacity_label->setText(QString("%1\%").arg(percent));
 }
+
+void AppearanceSettingsPage::TabBarSystemColor(bool checked) {
+
+  if (checked) {
+    current_tabbar_bg_color_ = StyleHelper::highlightColor();
+    UpdateColorSelectorColor(ui_->select_tabbar_color, current_tabbar_bg_color_);
+  }
+  ui_->layout_tabbar_color->setEnabled(!checked);
+  ui_->select_tabbar_color->setEnabled(!checked);
+
+}
+
+void AppearanceSettingsPage::TabBarSelectBGColor() {
+
+  if (ui_->tabbar_system_color->isChecked()) return;
+
+  QColor color_selected = QColorDialog::getColor(current_tabbar_bg_color_);
+  if (!color_selected.isValid()) return;
+  current_tabbar_bg_color_ = color_selected;
+  UpdateColorSelectorColor(ui_->select_tabbar_color, current_tabbar_bg_color_);
+
+}

src/settings/appearancesettingspage.h

@@ -64,6 +64,10 @@ public:
 
   static const char *kSystemThemeIcons;
 
+  static const char *kTabBarSystemColor;
+  static const char *kTabBarGradient;
+  static const char *kTabBarColor;
+
   enum BackgroundImageType {
     BackgroundImageType_Default,
     BackgroundImageType_None,
@@ -90,6 +94,8 @@ public:
   void SelectBackgroundImage();
   void BlurLevelChanged(int);
   void OpacityLevelChanged(int);
+  void TabBarSystemColor(bool checked);
+  void TabBarSelectBGColor();
 
  private:
 
@@ -105,6 +111,7 @@ public:
   QColor original_background_color_;
   QColor current_foreground_color_;
   QColor current_background_color_;
+  QColor current_tabbar_bg_color_;
   BackgroundImageType background_image_type_;
   QString background_image_filename_;
 

src/settings/appearancesettingspage.ui

@@ -7,7 +7,7 @@
     <x>0</x>
     <y>0</y>
     <width>674</width>
-    <height>627</height>
+    <height>755</height>
    </rect>
   </property>
   <property name="windowTitle">
@@ -39,7 +39,7 @@
         <item>
          <widget class="QLabel" name="select_foreground_color_label">
           <property name="enabled">
-           <bool>false</bool>
+           <bool>true</bool>
           </property>
           <property name="text">
            <string>Select foreground color:</string>
@@ -63,7 +63,7 @@
         <item>
          <widget class="QLabel" name="select_background_color_label">
           <property name="enabled">
-           <bool>false</bool>
+           <bool>true</bool>
           </property>
           <property name="text">
            <string>Select background color:</string>
@@ -85,6 +85,60 @@
      </layout>
     </widget>
    </item>
+   <item>
+    <widget class="QGroupBox" name="groupbox_tabbar_colors">
+     <property name="title">
+      <string>Tabbar colors</string>
+     </property>
+     <layout class="QVBoxLayout" name="layout_tabbar_colors">
+      <item>
+       <widget class="QRadioButton" name="tabbar_system_color">
+        <property name="text">
+         <string>&amp;Use the system default color</string>
+        </property>
+       </widget>
+      </item>
+      <item>
+       <widget class="QRadioButton" name="tabbar_custom_color">
+        <property name="text">
+         <string>Use custom color</string>
+        </property>
+       </widget>
+      </item>
+      <item>
+       <widget class="QCheckBox" name="tabbar_gradient">
+        <property name="text">
+         <string>Use gradient background</string>
+        </property>
+       </widget>
+      </item>
+      <item>
+       <layout class="QHBoxLayout" name="layout_tabbar_color">
+        <item>
+         <widget class="QLabel" name="label_tabbar_color">
+          <property name="enabled">
+           <bool>true</bool>
+          </property>
+          <property name="text">
+           <string>Select tabbar color:</string>
+          </property>
+         </widget>
+        </item>
+        <item>
+         <widget class="QPushButton" name="select_tabbar_color">
+          <property name="enabled">
+           <bool>false</bool>
+          </property>
+          <property name="text">
+           <string/>
+          </property>
+         </widget>
+        </item>
+       </layout>
+      </item>
+     </layout>
+    </widget>
+   </item>
    <item>
     <widget class="Line" name="line_1">
      <property name="orientation">
@@ -427,22 +481,6 @@
     </hint>
    </hints>
   </connection>
-  <connection>
-   <sender>use_a_custom_color_set</sender>
-   <signal>toggled(bool)</signal>
-   <receiver>select_background_color_label</receiver>
-   <slot>setEnabled(bool)</slot>
-   <hints>
-    <hint type="sourcelabel">
-     <x>301</x>
-     <y>72</y>
-    </hint>
-    <hint type="destinationlabel">
-     <x>162</x>
-     <y>139</y>
-    </hint>
-   </hints>
-  </connection>
   <connection>
    <sender>use_a_custom_color_set</sender>
    <signal>toggled(bool)</signal>
@@ -459,21 +497,5 @@
     </hint>
    </hints>
   </connection>
-  <connection>
-   <sender>use_a_custom_color_set</sender>
-   <signal>toggled(bool)</signal>
-   <receiver>select_foreground_color_label</receiver>
-   <slot>setEnabled(bool)</slot>
-   <hints>
-    <hint type="sourcelabel">
-     <x>301</x>
-     <y>72</y>
-    </hint>
-    <hint type="destinationlabel">
-     <x>162</x>
-     <y>104</y>
-    </hint>
-   </hints>
-  </connection>
  </connections>
 </ui>

src/widgets/fancytabwidget.cpp

@@ -22,6 +22,7 @@
 #include "fancytabwidget.h"
 #include "core/stylehelper.h"
 #include "core/logging.h"
+#include "settings/appearancesettingspage.h"
 
 #include <QDebug>
 
@@ -48,6 +49,7 @@
 #include <QActionGroup>
 #include <QSettings>
 #include <QMouseEvent>
+#include <QPixmapCache>
 
 const QSize FancyTabWidget::IconSize_LargeSidebar = QSize(24, 24);
 const QSize FancyTabWidget::IconSize_SmallSidebar = QSize(22, 22);
@@ -425,6 +427,19 @@ void FancyTabWidget::SaveSettings(const QString &kSettingsGroup) {
 
 }
 
+void FancyTabWidget::ReloadSettings() {
+
+  QSettings s;
+  s.beginGroup(AppearanceSettingsPage::kSettingsGroup);
+  bg_color_system_ = s.value(AppearanceSettingsPage::kTabBarSystemColor, false).toBool();
+  bg_gradient_ = s.value(AppearanceSettingsPage::kTabBarGradient, true).toBool();
+  bg_color_ = s.value(AppearanceSettingsPage::kTabBarColor, StyleHelper::highlightColor()).value<QColor>();
+  s.endGroup();
+
+  update();
+
+}
+
 void FancyTabWidget::addBottomWidget(QWidget *widget_view) {
   bottom_widget_ = widget_view;
 }
@@ -469,20 +484,42 @@ void FancyTabWidget::paintEvent(QPaintEvent *pe) {
     QTabWidget::paintEvent(pe);
     return;
   }
-  QStylePainter p(this);
-
-  // The brown color (Ubuntu) you see on the background gradient
-  QColor baseColor = StyleHelper::baseColor();
 
+  QStylePainter painter(this);
   QRect backgroundRect = rect();
   backgroundRect.setWidth(tabBar()->width());
-  p.fillRect(backgroundRect, baseColor);
 
-  // Horizontal gradient over the sidebar from transparent to dark
+  QString key;
-  StyleHelper::verticalGradient(&p, backgroundRect, backgroundRect, false);
+  key.sprintf("mh_vertical %d %d %d %d %d", backgroundRect.width(), backgroundRect.height(), bg_color_.rgb(), (bg_gradient_ ? 1 : 0), (background_pixmap_.isNull() ? 0 : 1));
+
+  QPixmap pixmap;
+  if (!QPixmapCache::find(key, &pixmap)) {
+
+    pixmap = QPixmap(backgroundRect.size());
+    QPainter p(&pixmap);
+    p.fillRect(backgroundRect, bg_color_);
+
+    // Draw the gradient fill.
+    if (bg_gradient_) {
+
+      QRect rect(0, 0, backgroundRect.width(), backgroundRect.height());
+
+      QColor shadow = StyleHelper::shadowColor(false);
+      QLinearGradient grad(backgroundRect.topRight(), backgroundRect.topLeft());
+      grad.setColorAt(0, bg_color_.lighter(117));
+      grad.setColorAt(1, shadow.darker(109));
+      p.fillRect(rect, grad);
+
+      QColor light(255, 255, 255, 80);
+      p.setPen(light);
+      p.drawLine(rect.topRight() - QPoint(1, 0), rect.bottomRight() - QPoint(1, 0));
+      QColor dark(0, 0, 0, 90);
+      p.setPen(dark);
+      p.drawLine(rect.topLeft(), rect.bottomLeft());
+
+    }
 
     // Draw the translucent png graphics over the gradient fill
-  {
     if (!background_pixmap_.isNull()) {
       QRect pixmap_rect(background_pixmap_.rect());
       pixmap_rect.moveTo(backgroundRect.topLeft());
@@ -490,14 +527,12 @@ void FancyTabWidget::paintEvent(QPaintEvent *pe) {
       while (pixmap_rect.top() < backgroundRect.bottom()) {
         QRect source_rect(pixmap_rect.intersected(backgroundRect));
         source_rect.moveTo(0, 0);
-        p.drawPixmap(pixmap_rect.topLeft(), background_pixmap_,source_rect);
+        p.drawPixmap(pixmap_rect.topLeft(), background_pixmap_, source_rect);
         pixmap_rect.moveTop(pixmap_rect.bottom() - 10);
       }
     }
-  }
 
     // Shadow effect of the background
-  {
     QColor light(255, 255, 255, 80);
     p.setPen(light);
     p.drawLine(backgroundRect.topRight() - QPoint(1, 0),  backgroundRect.bottomRight() - QPoint(1, 0));
@@ -507,8 +542,15 @@ void FancyTabWidget::paintEvent(QPaintEvent *pe) {
 
     p.setPen(StyleHelper::borderColor());
     p.drawLine(backgroundRect.topRight(), backgroundRect.bottomRight());
+
+    p.end();
+
+    QPixmapCache::insert(key, pixmap);
+
   }
 
+  painter.drawPixmap(backgroundRect.topLeft(), pixmap);
+
 }
 
 void FancyTabWidget::tabBarUpdateGeometry() {

src/widgets/fancytabwidget.h

@@ -57,6 +57,7 @@ class FancyTabWidget : public QTabWidget {
 
     void Load(const QString &kSettingsGroup);
     void SaveSettings(const QString &kSettingsGroup);
+    void ReloadSettings();
 
     // Values are persisted - only add to the end
     enum Mode {
@@ -102,6 +103,10 @@ class FancyTabWidget : public QTabWidget {
 
     QMap <QWidget*, TabData*> tabs_;
 
+    bool bg_color_system_;
+    bool bg_gradient_;
+    QColor bg_color_;
+
 };
 
 }  // namespace Internal