refactor component color properties

components/flatbutton.cpp

@@ -15,6 +15,7 @@ FlatButtonPrivate::FlatButtonPrivate(FlatButton *q)
       rippleStyle(Material::PositionedRipple),
       cornerRadius(3),
       bgMode(Qt::TransparentMode),
+      useThemeColors(true),
       peakOpacity(0.15)
 {
 }
@@ -42,18 +43,6 @@ void FlatButtonPrivate::init()
     font.setStyleName("Medium");
     q->setFont(font);
 
-    // Apply theme style
-
-    q->setPrimaryBgColor(style.themeColor("primary1"));
-    q->setSecondaryBgColor(style.themeColor("accent1"));
-    q->setDefaultBgColor(style.themeColor("text"));
-
-    q->setPrimaryTextColor(style.themeColor("primary1"));
-    q->setSecondaryTextColor(style.themeColor("accent1"));
-    q->setDefaultTextColor(style.themeColor("text"));
-
-    q->setDisabledTextColor(style.themeColor("disabled"));
-
     delegate->updatePalette();
 }
 
@@ -106,7 +95,7 @@ qreal FlatButton::cornerRadius() const
     return d->cornerRadius;
 }
 
-void FlatButton::setBgMode(Qt::BGMode mode)
+void FlatButton::setBackgroundMode(Qt::BGMode mode)
 {
     Q_D(FlatButton);
 
@@ -114,101 +103,72 @@ void FlatButton::setBgMode(Qt::BGMode mode)
     update();
 }
 
-Qt::BGMode FlatButton::bgMode() const
+Qt::BGMode FlatButton::backgroundMode() const
 {
     Q_D(const FlatButton);
 
     return d->bgMode;
 }
 
-void FlatButton::setPrimaryBgColor(const QColor &color)
+void FlatButton::setTextColor(const QColor &color)
 {
     Q_D(FlatButton);
 
-    d->primaryBgColor = color;
+    d->textColor = color;
-    d->delegate->updatePalette();
+    setUseThemeColors(false);
 }
 
-QColor FlatButton::primaryBgColor() const
+QColor FlatButton::textColor() const
 {
     Q_D(const FlatButton);
 
-    return d->primaryBgColor;
+    if (d->useThemeColors || !d->textColor.isValid()) {
+        Style &style = Style::instance();
+        if (Qt::OpaqueMode == d->bgMode) {
+            return style.themeColor("canvas");
+        }
+        switch (d->role)
+        {
+        case Material::Primary:
+            return style.themeColor("primary1");
+        case Material::Secondary:
+            return style.themeColor("accent1");
+        case Material::Default:
+        default:
+            return style.themeColor("text");
+        }
+    } else {
+        return d->textColor;
+    }
 }
 
-void FlatButton::setSecondaryBgColor(const QColor &color)
+void FlatButton::setBackgroundColor(const QColor &color)
 {
     Q_D(FlatButton);
 
-    d->secondaryBgColor = color;
+    d->backgroundColor = color;
-    d->delegate->updatePalette();
+    setUseThemeColors(false);
 }
 
-QColor FlatButton::secondaryBgColor() const
+QColor FlatButton::backgroundColor() const
 {
     Q_D(const FlatButton);
 
-    return d->secondaryBgColor;
+    if (d->useThemeColors || !d->backgroundColor.isValid()) {
-}
+        Style &style = Style::instance();
-
+        switch (d->role)
-void FlatButton::setDefaultBgColor(const QColor &color)
+        {
-{
+        case Material::Primary:
-    Q_D(FlatButton);
+            return style.themeColor("primary1");
-
+        case Material::Secondary:
-    d->defaultBgColor = color;
+            return style.themeColor("accent1");
-    d->delegate->updatePalette();
+        case Material::Default:
-}
+        default:
-
+            return style.themeColor("text");
-QColor FlatButton::defaultBgColor() const
+        }
-{
+    } else {
-    Q_D(const FlatButton);
+        return d->backgroundColor;
-
+    }
-    return d->defaultBgColor;
-}
-
-void FlatButton::setPrimaryTextColor(const QColor &color)
-{
-    Q_D(FlatButton);
-
-    d->primaryTextColor = color;
-    d->delegate->updatePalette();
-}
-
-QColor FlatButton::primaryTextColor() const
-{
-    Q_D(const FlatButton);
-
-    return d->primaryTextColor;
-}
-
-void FlatButton::setSecondaryTextColor(const QColor &color)
-{
-    Q_D(FlatButton);
-
-    d->secondaryTextColor = color;
-    d->delegate->updatePalette();
-}
-
-QColor FlatButton::secondaryTextColor() const
-{
-    Q_D(const FlatButton);
-
-    return d->secondaryTextColor;
-}
-
-void FlatButton::setDefaultTextColor(const QColor &color)
-{
-    Q_D(FlatButton);
-
-    d->defaultTextColor = color;
-    d->delegate->updatePalette();
-}
-
-QColor FlatButton::defaultTextColor() const
-{
-    Q_D(const FlatButton);
-
-    return d->defaultTextColor;
 }
 
 void FlatButton::setDisabledTextColor(const QColor &color)
@@ -216,14 +176,18 @@ void FlatButton::setDisabledTextColor(const QColor &color)
     Q_D(FlatButton);
 
     d->disabledTextColor = color;
-    d->delegate->updatePalette();
+    setUseThemeColors(false);
 }
 
 QColor FlatButton::disabledTextColor() const
 {
     Q_D(const FlatButton);
 
-    return d->disabledTextColor;
+    if (d->useThemeColors || !d->disabledTextColor.isValid()) {
+        return Style::instance().themeColor("disabled");
+    } else {
+        return d->disabledTextColor;
+    }
 }
 
 void FlatButton::setPeakOpacity(qreal opacity)
@@ -256,6 +220,21 @@ Material::Role FlatButton::role() const
     return d->role;
 }
 
+void FlatButton::setUseThemeColors(bool value)
+{
+    Q_D(FlatButton);
+
+    d->useThemeColors = value;
+    d->delegate->updatePalette();
+}
+
+bool FlatButton::useThemeColors() const
+{
+    Q_D(const FlatButton);
+
+    return d->useThemeColors;
+}
+
 FlatButton::FlatButton(FlatButtonPrivate &d, QWidget *parent)
     : QPushButton(parent),
       d_ptr(&d)
@@ -291,20 +270,28 @@ void FlatButton::paintEvent(QPaintEvent *event)
     if (Qt::OpaqueMode == d->bgMode) {
         QBrush brush;
         brush.setStyle(Qt::SolidPattern);
-        QColor color;
+
-        switch (d->role)
+        QColor brushColor;
-        {
+        if (d->useThemeColors || !d->backgroundColor.isValid()) {
-        case Material::Primary:
+            Style &style = Style::instance();
-            color = d->primaryBgColor;
+            switch (d->role)
-            break;
+            {
-        case Material::Secondary:
+            case Material::Primary:
-            color = d->secondaryBgColor;
+                brushColor = style.themeColor("primary1");
-            break;
+                break;
-        case Material::Default:
+            case Material::Secondary:
-        default:
+                brushColor = style.themeColor("accent1");
-            color = d->defaultBgColor;
+                break;
+            case Material::Default:
+            default:
+                brushColor = style.themeColor("text");
+                break;
+            }
+        } else {
+             brushColor = d->backgroundColor;
         }
-        brush.setColor(color);
+
+        brush.setColor(brushColor);
         painter.setOpacity(1);
         painter.setBrush(brush);
         painter.setPen(Qt::NoPen);
@@ -358,15 +345,13 @@ void FlatButton::mousePressEvent(QMouseEvent *event)
         return;
     }
 
-    QColor color = palette().color(QPalette::Active, QPalette::ButtonText);
-
     Ripple *ripple = new Ripple(Material::CenteredRipple == d->rippleStyle
         ? rect().center()
         : event->pos());
 
-    ripple->setRadiusEndValue(100);
+    ripple->setRadiusEndValue(width()*0.45);
     ripple->setOpacityStartValue(0.4);
-    ripple->setColor(color);
+    ripple->setColor(palette().color(QPalette::Active, QPalette::ButtonText));
 
     d->ripple->addRipple(ripple);
 

components/flatbutton.h

@@ -14,13 +14,9 @@ class FlatButton : public QPushButton
     Q_PROPERTY(Material::Role role WRITE setRole READ role)
     Q_PROPERTY(Material::RippleStyle rippleStyle WRITE setRippleStyle READ rippleStyle)
     Q_PROPERTY(qreal cornerRadius WRITE setCornerRadius READ cornerRadius)
-    Q_PROPERTY(Qt::BGMode bgMode WRITE setBgMode READ bgMode)
+    Q_PROPERTY(Qt::BGMode backgroundMode WRITE setBackgroundMode READ backgroundMode)
-    Q_PROPERTY(QColor primaryBgColor WRITE setPrimaryBgColor READ primaryBgColor)
+    Q_PROPERTY(QColor textColor WRITE setTextColor READ textColor)
-    Q_PROPERTY(QColor secondaryBgColor WRITE setSecondaryBgColor READ secondaryBgColor)
+    Q_PROPERTY(QColor backgroundColor WRITE setBackgroundColor READ backgroundColor)
-    Q_PROPERTY(QColor defaultBgColor WRITE setDefaultBgColor READ defaultBgColor)
-    Q_PROPERTY(QColor primaryTextColor WRITE setPrimaryTextColor READ primaryTextColor)
-    Q_PROPERTY(QColor secondaryTextColor WRITE setSecondaryTextColor READ secondaryTextColor)
-    Q_PROPERTY(QColor defaultTextColor WRITE setDefaultTextColor READ defaultTextColor)
     Q_PROPERTY(QColor disabledTextColor WRITE setDisabledTextColor READ disabledTextColor)
     Q_PROPERTY(qreal peakOpacity WRITE setPeakOpacity READ peakOpacity)
 
@@ -32,32 +28,23 @@ public:
     void setRole(Material::Role role);
     Material::Role role() const;
 
+    void setUseThemeColors(bool value);
+    bool useThemeColors() const;
+
     void setRippleStyle(Material::RippleStyle style);
     Material::RippleStyle rippleStyle() const;
 
     void setCornerRadius(qreal radius);
     qreal cornerRadius() const;
 
-    void setBgMode(Qt::BGMode mode);
+    void setBackgroundMode(Qt::BGMode mode);
-    Qt::BGMode bgMode() const;
+    Qt::BGMode backgroundMode() const;
 
-    void setPrimaryBgColor(const QColor &color);
+    void setTextColor(const QColor &color);
-    QColor primaryBgColor() const;
+    QColor textColor() const;
 
-    void setSecondaryBgColor(const QColor &color);
+    void setBackgroundColor(const QColor &color);
-    QColor secondaryBgColor() const;
+    QColor backgroundColor() const;
-
-    void setDefaultBgColor(const QColor &color);
-    QColor defaultBgColor() const;
-
-    void setPrimaryTextColor(const QColor &color);
-    QColor primaryTextColor() const;
-
-    void setSecondaryTextColor(const QColor &color);
-    QColor secondaryTextColor() const;
-
-    void setDefaultTextColor(const QColor &color);
-    QColor defaultTextColor() const;
 
     void setDisabledTextColor(const QColor &color);
     QColor disabledTextColor() const;

components/flatbutton_internal.cpp

@@ -5,7 +5,6 @@
 #include <QPropertyAnimation>
 #include <QSequentialAnimationGroup>
 #include "flatbutton.h"
-#include "lib/style.h"
 
 FlatButtonDelegate::FlatButtonDelegate(FlatButton *parent)
     : QStateMachine(parent),
@@ -107,56 +106,38 @@ qreal FlatButtonDelegate::focusHaloSize() const
 
 void FlatButtonDelegate::updatePalette()
 {
-    QColor color, bg;
+    QColor textColor = button->textColor();
-
+    QColor bgColor = button->backgroundColor();
-    switch (button->role())
+    QColor disabledColor = button->disabledTextColor();
-    {
-    case Material::Primary:
-        color = button->primaryTextColor();
-        bg = button->primaryBgColor();
-        break;
-    case Material::Secondary:
-        color = button->secondaryTextColor();
-        bg = button->secondaryBgColor();
-        break;
-    case Material::Default:
-    default:
-        color = button->defaultTextColor();
-        bg = button->defaultBgColor();
-    }
-
-    if (Qt::OpaqueMode == button->bgMode()) {
-        color = Qt::white;
-    }
 
     QPalette palette(button->palette());
-    palette.setColor(QPalette::Active, QPalette::ButtonText, color);
+    palette.setColor(QPalette::Active, QPalette::ButtonText, textColor);
-    palette.setColor(QPalette::Inactive, QPalette::ButtonText, color);
+    palette.setColor(QPalette::Inactive, QPalette::ButtonText, textColor);
-    palette.setColor(QPalette::Disabled, QPalette::ButtonText, button->disabledTextColor());
+    palette.setColor(QPalette::Disabled, QPalette::ButtonText, disabledColor);
     button->setPalette(palette);
 
     _normalState->assignProperty(this, "backgroundOpacity", 0);
-    _normalState->assignProperty(this, "backgroundColor", bg);
+    _normalState->assignProperty(this, "backgroundColor", bgColor);
     _normalState->assignProperty(this, "focusHaloOpacity", 0);
 
     _normalFocusedState->assignProperty(this, "backgroundOpacity", 0);
-    _normalFocusedState->assignProperty(this, "backgroundColor", bg);
+    _normalFocusedState->assignProperty(this, "backgroundColor", bgColor);
     _normalFocusedState->assignProperty(this, "focusHaloOpacity", button->peakOpacity());
 
     _hoveredState->assignProperty(this, "backgroundOpacity", button->peakOpacity());
-    _hoveredState->assignProperty(this, "backgroundColor", bg);
+    _hoveredState->assignProperty(this, "backgroundColor", bgColor);
     _hoveredState->assignProperty(this, "focusHaloOpacity", 0);
 
     _hoveredFocusedState->assignProperty(this, "backgroundOpacity", button->peakOpacity());
-    _hoveredFocusedState->assignProperty(this, "backgroundColor", bg);
+    _hoveredFocusedState->assignProperty(this, "backgroundColor", bgColor);
     _normalFocusedState->assignProperty(this, "focusHaloOpacity", button->peakOpacity());
 
     _pressedState->assignProperty(this, "backgroundOpacity", 0);
-    _pressedState->assignProperty(this, "backgroundColor", bg);
+    _pressedState->assignProperty(this, "backgroundColor", bgColor);
     _pressedState->assignProperty(this, "focusHaloOpacity", 0);
 
     _releaseState->assignProperty(this, "backgroundOpacity", 0);
-    _releaseState->assignProperty(this, "backgroundColor", bg);
+    _releaseState->assignProperty(this, "backgroundColor", bgColor);
     _releaseState->assignProperty(this, "focusHaloOpacity", 0);
 
     button->update();

components/flatbutton_p.h

@@ -27,13 +27,10 @@ public:
     Material::RippleStyle rippleStyle;
     qreal                 cornerRadius;
     Qt::BGMode            bgMode;
-    QColor                primaryTextColor;
+    QColor                textColor;
-    QColor                secondaryTextColor;
+    QColor                backgroundColor;
-    QColor                defaultTextColor;
     QColor                disabledTextColor;
-    QColor                primaryBgColor;
+    bool                  useThemeColors;
-    QColor                secondaryBgColor;
-    QColor                defaultBgColor;
     qreal                 peakOpacity;
 };
 

components/raisedbutton.cpp

@@ -23,8 +23,7 @@ void RaisedButtonPrivate::init()
 {
     Q_Q(RaisedButton);
 
-    q->setPrimaryTextColor(Qt::white);
+    q->setTextColor(Qt::white);
-    q->setSecondaryTextColor(Qt::white);
     q->setPeakOpacity(0.25);
 
     QGraphicsDropShadowEffect *effect = new QGraphicsDropShadowEffect;
@@ -137,24 +136,10 @@ void RaisedButton::paintEvent(QPaintEvent *event)
 
     const qreal cr = d->cornerRadius;
 
-    QColor bg;
-    switch (d->role)
-    {
-    case Material::Primary:
-        bg = d->primaryBgColor;
-        break;
-    case Material::Secondary:
-        bg = d->secondaryBgColor;
-        break;
-    case Material::Default:
-    default:
-        bg = d->defaultBgColor;
-    }
-
     QBrush brush;
     brush.setStyle(Qt::SolidPattern);
     brush.setColor(isEnabled()
-       ? bg : palette().color(QPalette::Disabled, QPalette::Background));
+       ? backgroundColor() : palette().color(QPalette::Disabled, QPalette::Background));
     painter.setBrush(brush);
     painter.setPen(Qt::NoPen);
     painter.drawRoundedRect(rect(), cr, cr);

components/tabs.cpp

@@ -9,7 +9,8 @@
 
 TabsPrivate::TabsPrivate(Tabs *q)
     : q_ptr(q),
-      tab(-1)
+      tab(-1),
+      useThemeColors(true)
 {
 }
 
@@ -17,13 +18,12 @@ void TabsPrivate::init()
 {
     Q_Q(Tabs);
 
-    delegate = new TabsDelegate(q);
+    inkBar = new TabsInkBar(q);
 
     tabLayout = new QHBoxLayout;
     q->setLayout(tabLayout);
     tabLayout->setSpacing(0);
     tabLayout->setMargin(0);
-    tabLayout->setContentsMargins(0, 0, 0, 2);
 }
 
 Tabs::Tabs(QWidget *parent)
@@ -37,6 +37,93 @@ Tabs::~Tabs()
 {
 }
 
+void Tabs::setUseThemeColors(bool value)
+{
+    Q_D(Tabs);
+
+    d->useThemeColors = value;
+}
+
+bool Tabs::useThemeColors() const
+{
+    Q_D(const Tabs);
+
+    return d->useThemeColors;
+}
+
+void Tabs::setInkColor(const QColor &color)
+{
+    Q_D(Tabs);
+
+    d->inkColor = color;
+    setUseThemeColors(false);
+}
+
+QColor Tabs::inkColor() const
+{
+    Q_D(const Tabs);
+
+    if (d->useThemeColors || !d->inkColor.isValid()) {
+        return Style::instance().themeColor("accent1");
+    } else {
+        return d->inkColor;
+    }
+}
+
+void Tabs::setBackgroundColor(const QColor &color)
+{
+    Q_D(Tabs);
+
+    d->backgroundColor = color;
+    setUseThemeColors(false);
+
+    Tab *tab;
+    for (int i = 0; i < d->tabLayout->count(); ++i) {
+        QLayoutItem *item = d->tabLayout->itemAt(i);
+        if ((tab = static_cast<Tab *>(item->widget()))) {
+            tab->setBackgroundColor(color);
+        }
+    }
+}
+
+QColor Tabs::backgroundColor() const
+{
+    Q_D(const Tabs);
+
+    if (d->useThemeColors || !d->backgroundColor.isValid()) {
+        return Style::instance().themeColor("primary1");
+    } else {
+        return d->backgroundColor;
+    }
+}
+
+void Tabs::setTextColor(const QColor &color)
+{
+    Q_D(Tabs);
+
+    d->textColor = color;
+    setUseThemeColors(false);
+
+    Tab *tab;
+    for (int i = 0; i < d->tabLayout->count(); ++i) {
+        QLayoutItem *item = d->tabLayout->itemAt(i);
+        if ((tab = static_cast<Tab *>(item->widget()))) {
+            tab->setTextColor(color);
+        }
+    }
+}
+
+QColor Tabs::textColor() const
+{
+    Q_D(const Tabs);
+
+    if (d->useThemeColors || !d->textColor.isValid()) {
+        return Style::instance().themeColor("canvas");
+    } else {
+        return d->textColor;
+    }
+}
+
 void Tabs::addTab(const QString &text)
 {
     Q_D(Tabs);
@@ -45,15 +132,14 @@ void Tabs::addTab(const QString &text)
     tab->setCornerRadius(0);
     tab->setRippleStyle(Material::CenteredRipple);
     tab->setRole(Material::Primary);
-    tab->setBgMode(Qt::OpaqueMode);
+    tab->setBackgroundMode(Qt::OpaqueMode);
-    tab->setPrimaryTextColor(Qt::white);
     tab->setPeakOpacity(0.25);
 
     d->tabLayout->addWidget(tab);
 
     if (-1 == d->tab) {
         d->tab = 0;
-        d->delegate->updateInkBar();
+        d->inkBar->refreshGeometry();
     }
 
     connect(tab, SIGNAL(clicked()), this, SLOT(switchTab()));
@@ -87,24 +173,13 @@ int Tabs::currentIndex() const
     return d->tab;
 }
 
-void Tabs::paintEvent(QPaintEvent *event)
-{
-    Q_D(Tabs);
-
-    QPainter painter(this);
-    painter.fillRect(d->delegate->inkBarGeometry(),
-        Style::instance().themeColor("accent1"));
-
-    QWidget::paintEvent(event);
-}
-
 void Tabs::moveEvent(QMoveEvent *event)
 {
     Q_UNUSED(event)
 
     Q_D(Tabs);
 
-    d->delegate->updateInkBar();
+    d->inkBar->refreshGeometry();
 }
 
 void Tabs::resizeEvent(QResizeEvent *event)
@@ -113,7 +188,7 @@ void Tabs::resizeEvent(QResizeEvent *event)
 
     Q_D(Tabs);
 
-    d->delegate->updateInkBar();
+    d->inkBar->refreshGeometry();
 }
 
 void Tabs::switchTab()
@@ -123,7 +198,7 @@ void Tabs::switchTab()
     Tab *tab = static_cast<Tab *>(sender());
     if (tab) {
         d->tab = d->tabLayout->indexOf(tab);
-        d->delegate->setInkBarGeometry(d->tabLayout->itemAt(d->tab)->geometry());
+        d->inkBar->animate();
         emit currentChanged(d->tab);
     }
 }

components/tabs.h

@@ -10,10 +10,26 @@ class Tabs : public QWidget
 {
     Q_OBJECT
 
+    Q_PROPERTY(QColor inkColor WRITE setInkColor READ inkColor)
+    Q_PROPERTY(QColor backgroundColor WRITE setBackgroundColor READ backgroundColor)
+    Q_PROPERTY(QColor textColor WRITE setTextColor READ textColor)
+
 public:
     explicit Tabs(QWidget *parent = 0);
     ~Tabs();
 
+    void setUseThemeColors(bool value);
+    bool useThemeColors() const;
+
+    void setInkColor(const QColor &color);
+    QColor inkColor() const;
+
+    void setBackgroundColor(const QColor &color);
+    QColor backgroundColor() const;
+
+    void setTextColor(const QColor &color);
+    QColor textColor() const;
+
     void addTab(const QString &text);
 
     void setRippleStyle(Material::RippleStyle style);
@@ -25,7 +41,6 @@ signals:
     void currentChanged(int);
 
 protected:
-    void paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE;
     void moveEvent(QMoveEvent *event) Q_DECL_OVERRIDE;
     void resizeEvent(QResizeEvent *event) Q_DECL_OVERRIDE;
 

components/tabs_internal.cpp

@@ -1,34 +1,54 @@
 #include "tabs_internal.h"
 #include <QLayout>
+#include <QPainter>
+#include <QEvent>
 #include <QPropertyAnimation>
 #include "tabs.h"
 
-TabsDelegate::TabsDelegate(Tabs *parent)
+TabsInkBar::TabsInkBar(Tabs *parent)
-    : QObject(parent),
+    : QWidget(parent->parentWidget()),
       tabs(parent),
       _animation(new QPropertyAnimation(parent)),
       _tween(0)
 {
-    _animation->setPropertyName("tween");
+    parent->installEventFilter(this);
+
+    _animation->setPropertyName("tweenValue");
     _animation->setEasingCurve(QEasingCurve::OutCirc);
     _animation->setTargetObject(this);
     _animation->setDuration(700);
 }
 
-TabsDelegate::~TabsDelegate()
+TabsInkBar::~TabsInkBar()
 {
 }
 
-void TabsDelegate::setTween(qreal tween)
+void TabsInkBar::setTweenValue(qreal value)
 {
-    _tween = tween;
+    _tween = value;
-    updateInkBar();
+    refreshGeometry();
 }
 
-void TabsDelegate::setInkBarGeometry(const QRect &newGeometry)
+void TabsInkBar::refreshGeometry()
 {
-    _previousGeometry = _inkBarGeometry;
+    QLayoutItem *item = tabs->tabLayout()->itemAt(tabs->currentIndex());
-    _inkBarGeometry = newGeometry;
+    if (item) {
+        const QRect &r = item->geometry();
+        const qreal s = 1-_tween;
+        if (QAbstractAnimation::Running != _animation->state()) {
+            setGeometry(r.left(), r.bottom()-1, r.width(), 2);
+        } else {
+            const qreal left = _previousGeometry.left()*s + r.left()*_tween;
+            const qreal width = _previousGeometry.width()*s + r.width()*_tween;
+            setGeometry(left, r.bottom()-1, width, 2);
+        }
+        tabs->update();
+    }
+}
+
+void TabsInkBar::animate()
+{
+    _previousGeometry = geometry();
 
     _animation->stop();
     _animation->setStartValue(0);
@@ -36,21 +56,31 @@ void TabsDelegate::setInkBarGeometry(const QRect &newGeometry)
     _animation->start();
 }
 
-void TabsDelegate::updateInkBar()
+bool TabsInkBar::eventFilter(QObject *obj, QEvent *event)
 {
-    QLayoutItem *item = tabs->tabLayout()->itemAt(tabs->currentIndex());
+    QEvent::Type type = event->type();
-    if (item) {
+
-        const QRect &r = item->geometry();
+    if (QEvent::ParentChange == type) {
-        const qreal s = 1-_tween;
+        setParent(tabs->parentWidget());
-        if (QAbstractAnimation::Running != _animation->state()) {
+    } else if (QEvent::Resize == type || QEvent::Move == type) {
-            _inkBarGeometry = QRect(r.left(), r.bottom()+1, r.width(), 2);
+        QWidget *widget;
-        } else {
+        if ((widget = parentWidget())) {
-            const qreal left = _previousGeometry.left()*s + r.left()*_tween;
+            setGeometry(widget->rect());
-            const qreal width = _previousGeometry.width()*s + r.width()*_tween;
-            _inkBarGeometry = QRect(left, r.bottom()+1, width, 2);
         }
-        tabs->update();
     }
+    return QWidget::eventFilter(obj, event);
+}
+
+void TabsInkBar::paintEvent(QPaintEvent *event)
+{
+    QPainter painter(this);
+
+    painter.setBrush(tabs->inkColor());
+    painter.setOpacity(1);
+    painter.setPen(Qt::NoPen);
+    painter.drawRect(rect());
+
+    QWidget::paintEvent(event);
 }
 
 Tab::Tab(QWidget *parent)

components/tabs_internal.h

@@ -4,35 +4,36 @@
 #include <QObject>
 #include "flatbutton.h"
 
-class QPropertyAnimation;
 class Tabs;
+class QPropertyAnimation;
 
-class TabsDelegate : public QObject
+class TabsInkBar : public QWidget
 {
     Q_OBJECT
 
-    Q_PROPERTY(qreal tween WRITE setTween READ tween)
+    Q_PROPERTY(qreal tweenValue WRITE setTweenValue READ tweenValue)
 
 public:
-    TabsDelegate(Tabs *parent);
+    TabsInkBar(Tabs *parent);
-    ~TabsDelegate();
+    ~TabsInkBar();
 
-    void setTween(qreal tween);
+    void setTweenValue(qreal value);
-    inline qreal tween() const { return _tween; }
+    inline qreal tweenValue() const { return _tween; }
 
-    void setInkBarGeometry(const QRect &newGeometry);
+    void refreshGeometry();
-    inline QRect inkBarGeometry() const { return _inkBarGeometry; }
+    void animate();
-    \
+
-    void updateInkBar();
+protected:
+    bool eventFilter(QObject *obj, QEvent *event);
+    void paintEvent(QPaintEvent *event);
 
 private:
-    Q_DISABLE_COPY(TabsDelegate)
+    Q_DISABLE_COPY(TabsInkBar)
 
-    Tabs *const tabs;
+    Tabs               *const tabs;
     QPropertyAnimation *_animation;
-    qreal _tween;
+    qreal               _tween;
-    QRect _inkBarGeometry;
+    QRect               _previousGeometry;
-    QRect _previousGeometry;
 };
 
 class Tab : public FlatButton

components/tabs_p.h

@@ -2,10 +2,11 @@
 #define TABS_P_H
 
 #include <QRect>
+#include <QColor>
 
 class QHBoxLayout;
 class Tabs;
-class TabsDelegate;
+class TabsInkBar;
 
 class TabsPrivate
 {
@@ -17,10 +18,14 @@ public:
 
     void init();
 
-    Tabs *const q_ptr;
+    Tabs        *const q_ptr;
-    TabsDelegate *delegate;
+    TabsInkBar  *inkBar;
-    QHBoxLayout  *tabLayout;
+    QHBoxLayout *tabLayout;
-    int tab;
+    QColor       inkColor;
+    QColor       backgroundColor;
+    QColor       textColor;
+    int          tab;
+    bool         useThemeColors;
 };
 
 #endif // TABS_P_H

examples/flatbuttonexamples.cpp

@@ -1,6 +1,8 @@
 #include <QLayout>
 #include <QPushButton>
+#include <QDebug>
 #include "flatbuttonexamples.h"
+#include "lib/style.h"
 #include "components/flatbutton.h"
 #include "exampleview.h"
 #include "frame.h"
@@ -58,7 +60,8 @@ FlatButtonExamples::FlatButtonExamples(QWidget *parent)
         flatButton->setMinimumSize(200, 42);
 
         flatButton->setRole(Material::Secondary);
-        flatButton->setSecondaryBgColor(QColor(0, 0, 0, 80));
+        flatButton->setBackgroundColor(QColor(0, 0, 0, 80));
+        //flatButton->setTextColor(Style::instance().themeColor("primary1"));
 //        flatButton->setDisabled(true);
 
         ExampleView *view = new ExampleView;
@@ -80,7 +83,7 @@ FlatButtonExamples::FlatButtonExamples(QWidget *parent)
         flatButton->setMinimumSize(200, 42);
 
         flatButton->setRole(Material::Primary);
-        flatButton->setBgMode(Qt::OpaqueMode);
+        flatButton->setBackgroundMode(Qt::OpaqueMode);
         //flatButton->setPrimaryTextColor(Qt::white);
         flatButton->setPeakOpacity(0.25);
 
@@ -103,7 +106,30 @@ FlatButtonExamples::FlatButtonExamples(QWidget *parent)
         flatButton->setMinimumSize(200, 42);
 
         flatButton->setRole(Material::Secondary);
-        flatButton->setBgMode(Qt::OpaqueMode);
+        flatButton->setBackgroundMode(Qt::OpaqueMode);
+        flatButton->setPeakOpacity(0.25);
+
+        ExampleView *view = new ExampleView;
+        view->setWidget(flatButton);
+        view->setBackgroundRole(QPalette::Base);
+
+        Frame *frame = new Frame;
+        frame->setCodeSnippet(
+            "FlatButton *flatButton = new FlatButton;\n"
+            "flatButton->setText(\"Press me!\");"
+        );
+        frame->setWidget(view);
+
+        layout->addWidget(frame);
+    }
+    {
+        FlatButton *flatButton = new FlatButton;
+        flatButton->setText("Press me!");
+        flatButton->setMinimumSize(200, 42);
+
+        //flatButton->setRole(Material::Secondary);
+        flatButton->setBackgroundMode(Qt::OpaqueMode);
+        flatButton->setBackgroundColor(Qt::green);
         flatButton->setPeakOpacity(0.25);
 
         ExampleView *view = new ExampleView;

examples/tabsexamples.cpp

@@ -30,6 +30,9 @@ TabsExamples::TabsExamples(QWidget *parent)
         tabs->addTab("Second");
         tabs->addTab("Third");
 
+        tabs->setBackgroundColor(Qt::green);
+        tabs->setTextColor(Qt::blue);
+
         //tabs->addTab(new Tab("First"));
         //tabs->addTab(new Tab("Second"));
         //tabs->addTab(new Tab("Third"));