From 251f569a5c2306b711e6b24c43c393f169132df4 Mon Sep 17 00:00:00 2001 From: Konstantinos Sideris Date: Wed, 24 May 2017 22:45:13 +0300 Subject: [PATCH] Add custom scrollbar on the timeline --- CMakeLists.txt | 2 + include/TimelineView.h | 2 + include/ui/ScrollBar.h | 53 +++++++++++++++++++++ src/EmojiPanel.cc | 6 +-- src/RoomList.cc | 5 +- src/TimelineView.cc | 3 ++ src/main.cc | 6 --- src/ui/ScrollBar.cc | 106 +++++++++++++++++++++++++++++++++++++++++ 8 files changed, 170 insertions(+), 13 deletions(-) create mode 100644 include/ui/ScrollBar.h create mode 100644 src/ui/ScrollBar.cc diff --git a/CMakeLists.txt b/CMakeLists.txt index e8e814ca..d83fb8d1 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -111,6 +111,7 @@ set(SRC_FILES src/ui/CircularProgress.cc src/ui/FlatButton.cc src/ui/OverlayModal.cc + src/ui/ScrollBar.cc src/ui/RaisedButton.cc src/ui/Ripple.cc src/ui/RippleOverlay.cc @@ -181,6 +182,7 @@ qt5_wrap_cpp(MOC_HEADERS include/ui/CircularProgress.h include/ui/FlatButton.h include/ui/OverlayWidget.h + include/ui/ScrollBar.h include/ui/RaisedButton.h include/ui/Ripple.h include/ui/RippleOverlay.h diff --git a/include/TimelineView.h b/include/TimelineView.h index 7aeb4d47..67ea28b2 100644 --- a/include/TimelineView.h +++ b/include/TimelineView.h @@ -23,6 +23,7 @@ #include #include +#include "ScrollBar.h" #include "Sync.h" #include "TimelineItem.h" @@ -97,6 +98,7 @@ private: QVBoxLayout *scroll_layout_; QScrollArea *scroll_area_; + ScrollBar *scrollbar_; QWidget *scroll_widget_; QString last_sender_; diff --git a/include/ui/ScrollBar.h b/include/ui/ScrollBar.h new file mode 100644 index 00000000..483a73c4 --- /dev/null +++ b/include/ui/ScrollBar.h @@ -0,0 +1,53 @@ +/* + * nheko Copyright (C) 2017 Konstantinos Sideris + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +#pragma once + +#include +#include +#include +#include +#include + +class ScrollBar : public QScrollBar +{ + Q_OBJECT +public: + ScrollBar(QScrollArea *area, QWidget *parent = nullptr); + + void fadeIn(); + void fadeOut(); + +protected: + void paintEvent(QPaintEvent *e) override; + void sliderChange(SliderChange change) override; + +private: + int roundRadius_ = 4; + int handleWidth_ = 7; + int minHandleHeight_ = 20; + bool isActive; + + const int AnimationDuration = 300; + const int Padding = 4; + + QGraphicsOpacityEffect *eff; + QTimer hideTimer_; + + QScrollArea *area_; + QRect handle_; +}; diff --git a/src/EmojiPanel.cc b/src/EmojiPanel.cc index 4176be0e..02fe2f14 100644 --- a/src/EmojiPanel.cc +++ b/src/EmojiPanel.cc @@ -32,13 +32,11 @@ EmojiPanel::EmojiPanel(QWidget *parent) { setStyleSheet( "QWidget {background: #f8fbfe; color: #e8e8e8; border: none;}" - "QScrollBar:vertical { background-color: #f8fbfe; width: 8px; border-radius: 20px; margin: 0px 2px 0 2px; }" - "QScrollBar::handle:vertical { border-radius : 50px; background-color : #d6dde3; }" + "QScrollBar:vertical { background-color: #f8fbfe; width: 8px; margin: 0px 2px 0 2px; }" + "QScrollBar::handle:vertical { background-color: #d6dde3; min-height: 20px; }" "QScrollBar::add-line:vertical { border: none; background: none; }" "QScrollBar::sub-line:vertical { border: none; background: none; }"); - setParent(0); // Create TopLevel-Widget - setAttribute(Qt::WA_NoSystemBackground, true); setAttribute(Qt::WA_TranslucentBackground, true); setWindowFlags(Qt::FramelessWindowHint | Qt::ToolTip); diff --git a/src/RoomList.cc b/src/RoomList.cc index f9957bd3..3e381340 100644 --- a/src/RoomList.cc +++ b/src/RoomList.cc @@ -27,9 +27,7 @@ RoomList::RoomList(QSharedPointer client, QWidget *parent) : QWidget(parent) , client_(client) { - setStyleSheet( - "QWidget { border: none; }" - "QScrollBar:vertical { width: 4px; margin: 2px 0; }"); + setStyleSheet("QWidget { border: none; }"); QSizePolicy sizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); sizePolicy.setHorizontalStretch(0); @@ -42,6 +40,7 @@ RoomList::RoomList(QSharedPointer client, QWidget *parent) scrollArea_ = new QScrollArea(this); scrollArea_->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff); + scrollArea_->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff); scrollArea_->setSizeAdjustPolicy(QAbstractScrollArea::AdjustToContents); scrollArea_->setWidgetResizable(true); scrollArea_->setAlignment(Qt::AlignLeading | Qt::AlignLeft | Qt::AlignVCenter); diff --git a/src/TimelineView.cc b/src/TimelineView.cc index 7881aee4..dbea0ad4 100644 --- a/src/TimelineView.cc +++ b/src/TimelineView.cc @@ -240,6 +240,9 @@ void TimelineView::init() scroll_area_->setWidgetResizable(true); scroll_area_->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff); + scrollbar_ = new ScrollBar(scroll_area_); + scroll_area_->setVerticalScrollBar(scrollbar_); + scroll_widget_ = new QWidget(); scroll_layout_ = new QVBoxLayout(); diff --git a/src/main.cc b/src/main.cc index 8f5dba1e..993eea82 100644 --- a/src/main.cc +++ b/src/main.cc @@ -41,12 +41,6 @@ int main(int argc, char *argv[]) app.setWindowIcon(QIcon(":/logos/nheko.png")); - app.setStyleSheet( - "QScrollBar:vertical { background-color: #f8fbfe; width: 8px; border: none; margin: 2px; }" - "QScrollBar::handle:vertical { min-height: 40px; background-color : #d6dde3; }" - "QScrollBar::add-line:vertical { border: none; background: none; }" - "QScrollBar::sub-line:vertical { border: none; background: none; }"); - QFont font("Open Sans"); app.setFont(font); diff --git a/src/ui/ScrollBar.cc b/src/ui/ScrollBar.cc new file mode 100644 index 00000000..300b9a04 --- /dev/null +++ b/src/ui/ScrollBar.cc @@ -0,0 +1,106 @@ +/* + * nheko Copyright (C) 2017 Konstantinos Sideris + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +#include +#include +#include + +#include "ScrollBar.h" + +ScrollBar::ScrollBar(QScrollArea *area, QWidget *parent) + : QScrollBar(parent) + , area_{area} +{ + hideTimer_.setSingleShot(true); + + connect(&hideTimer_, &QTimer::timeout, this, &ScrollBar::fadeOut); + + eff = new QGraphicsOpacityEffect(this); + setGraphicsEffect(eff); +} + +void ScrollBar::fadeOut() +{ + isActive = false; + + QPropertyAnimation *anim = new QPropertyAnimation(eff, "opacity"); + anim->setDuration(AnimationDuration); + anim->setStartValue(1); + anim->setEndValue(0); + anim->setEasingCurve(QEasingCurve::Linear); + anim->start(QPropertyAnimation::DeleteWhenStopped); +} + +void ScrollBar::fadeIn() +{ + QPropertyAnimation *anim = new QPropertyAnimation(eff, "opacity"); + anim->setDuration(AnimationDuration); + anim->setStartValue(0); + anim->setEndValue(1); + anim->setEasingCurve(QEasingCurve::Linear); + anim->start(QPropertyAnimation::DeleteWhenStopped); +} + +void ScrollBar::sliderChange(SliderChange change) +{ + if (!isActive) + fadeIn(); + + hideTimer_.stop(); + hideTimer_.start(1500); + isActive = true; + + QScrollBar::sliderChange(change); +} + +void ScrollBar::paintEvent(QPaintEvent *) +{ + if (!width() && !height()) { + hide(); + return; + } + + QPainter p(this); + p.setRenderHint(QPainter::TextAntialiasing); + p.setRenderHint(QPainter::Antialiasing); + p.setRenderHint(QPainter::SmoothPixmapTransform); + + p.setPen(Qt::NoPen); + + QColor bg(33, 33, 33, 30); + QColor handle(0, 0, 0, 80); + + p.setBrush(bg); + QRect backgroundArea(Padding, 0, handleWidth_, height()); + p.drawRoundedRect(backgroundArea, roundRadius_, roundRadius_); + + int areaHeight = area_->height(); + int widgetHeight = area_->widget()->height(); + + double visiblePercentage = (double)areaHeight / (double)widgetHeight; + int handleHeight = std::max(visiblePercentage * areaHeight, (double)minHandleHeight_); + + if (maximum() == 0) { + return; + } + + int handle_y = (value() * (areaHeight - handleHeight - roundRadius_ / 2)) / maximum(); + + p.setBrush(handle); + QRect handleArea(Padding, handle_y, handleWidth_, handleHeight); + p.drawRoundedRect(handleArea, roundRadius_, roundRadius_); +}