Fix emoji picker's theme

This commit is contained in:
Konstantinos Sideris 2017-11-22 21:03:53 +02:00
parent 552941118b
commit 56d8be5a27
6 changed files with 42 additions and 63 deletions

View file

@ -37,6 +37,9 @@ public:
signals: signals:
void emojiSelected(const QString &emoji); void emojiSelected(const QString &emoji);
protected:
void paintEvent(QPaintEvent *event) override;
private slots: private slots:
void clickIndex(const QModelIndex &index) void clickIndex(const QModelIndex &index)
{ {

View file

@ -17,8 +17,6 @@
#pragma once #pragma once
#include <QGraphicsOpacityEffect>
#include <QPropertyAnimation>
#include <QScrollArea> #include <QScrollArea>
#include "EmojiProvider.h" #include "EmojiProvider.h"
@ -32,9 +30,6 @@ class EmojiPanel : public QWidget
public: public:
EmojiPanel(QWidget *parent = nullptr); EmojiPanel(QWidget *parent = nullptr);
void fadeOut();
void fadeIn();
signals: signals:
void mouseLeft(); void mouseLeft();
void emojiSelected(const QString &emoji); void emojiSelected(const QString &emoji);
@ -46,9 +41,6 @@ protected:
private: private:
void showEmojiCategory(const EmojiCategory *category); void showEmojiCategory(const EmojiCategory *category);
QPropertyAnimation *animation_;
QGraphicsOpacityEffect *opacity_;
EmojiProvider emoji_provider_; EmojiProvider emoji_provider_;
QScrollArea *scrollArea_; QScrollArea *scrollArea_;
@ -59,6 +51,5 @@ private:
int width_; int width_;
int height_; int height_;
int animationDuration_;
int categoryIconSize_; int categoryIconSize_;
}; };

View file

@ -77,3 +77,15 @@ RegisterPage {
background-color: white; background-color: white;
color: #333; color: #333;
} }
EmojiPanel,
EmojiPanel > * {
background-color: white;
color: #333;
}
EmojiCategory,
EmojiCategory > * {
background-color: white;
color: #ccc;
}

View file

@ -16,6 +16,8 @@
*/ */
#include <QScrollBar> #include <QScrollBar>
#include <QStyleOption>
#include <QPainter>
#include "Config.h" #include "Config.h"
#include "EmojiCategory.h" #include "EmojiCategory.h"
@ -25,6 +27,7 @@ EmojiCategory::EmojiCategory(QString category, QList<Emoji> emoji, QWidget *pare
{ {
mainLayout_ = new QVBoxLayout(this); mainLayout_ = new QVBoxLayout(this);
mainLayout_->setMargin(0); mainLayout_->setMargin(0);
mainLayout_->setSpacing(0);
emojiListView_ = new QListView(); emojiListView_ = new QListView();
itemModel_ = new QStandardItemModel(this); itemModel_ = new QStandardItemModel(this);
@ -33,7 +36,6 @@ EmojiCategory::EmojiCategory(QString category, QList<Emoji> emoji, QWidget *pare
data_ = new Emoji; data_ = new Emoji;
emojiListView_->setItemDelegate(delegate_); emojiListView_->setItemDelegate(delegate_);
emojiListView_->setSpacing(5);
emojiListView_->setModel(itemModel_); emojiListView_->setModel(itemModel_);
emojiListView_->setViewMode(QListView::IconMode); emojiListView_->setViewMode(QListView::IconMode);
emojiListView_->setFlow(QListView::LeftToRight); emojiListView_->setFlow(QListView::LeftToRight);
@ -67,16 +69,21 @@ EmojiCategory::EmojiCategory(QString category, QList<Emoji> emoji, QWidget *pare
category_ = new QLabel(category, this); category_ = new QLabel(category, this);
category_->setFont(font); category_->setFont(font);
category_->setStyleSheet("color: #ccc; margin: 20px 0px 15px 8px;"); category_->setStyleSheet("margin: 20px 0 20px 8px;");
auto labelLayout_ = new QHBoxLayout(); mainLayout_->addWidget(category_);
labelLayout_->addWidget(category_);
labelLayout_->addStretch(1);
mainLayout_->addLayout(labelLayout_);
mainLayout_->addWidget(emojiListView_); mainLayout_->addWidget(emojiListView_);
connect(emojiListView_, &QListView::clicked, this, &EmojiCategory::clickIndex); connect(emojiListView_, &QListView::clicked, this, &EmojiCategory::clickIndex);
} }
void
EmojiCategory::paintEvent(QPaintEvent *)
{
QStyleOption opt;
opt.init(this);
QPainter p(this);
style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}
EmojiCategory::~EmojiCategory() {} EmojiCategory::~EmojiCategory() {}

View file

@ -29,14 +29,11 @@ EmojiPanel::EmojiPanel(QWidget *parent)
, shadowMargin_{2} , shadowMargin_{2}
, width_{370} , width_{370}
, height_{350} , height_{350}
, animationDuration_{100}
, categoryIconSize_{20} , categoryIconSize_{20}
{ {
setStyleSheet("QWidget {border: none;}" setStyleSheet("QWidget {border: none;}"
"QScrollBar:vertical { width: 8px; margin: 0px 2px 0 2px; }" "QScrollBar:vertical { width: 0px; margin: 0px; }"
"QScrollBar::handle:vertical { min-height: 20px; }" "QScrollBar::handle:vertical { min-height: 30px; }");
"QScrollBar::add-line:vertical { border: none; background: none; }"
"QScrollBar::sub-line:vertical { border: none; background: none; }");
setAttribute(Qt::WA_TranslucentBackground, true); setAttribute(Qt::WA_TranslucentBackground, true);
setAttribute(Qt::WA_ShowWithoutActivating, true); setAttribute(Qt::WA_ShowWithoutActivating, true);
@ -48,16 +45,18 @@ EmojiPanel::EmojiPanel(QWidget *parent)
auto topLayout = new QVBoxLayout(this); auto topLayout = new QVBoxLayout(this);
topLayout->addWidget(mainWidget); topLayout->addWidget(mainWidget);
topLayout->setMargin(shadowMargin_); topLayout->setMargin(shadowMargin_);
topLayout->setSpacing(0);
auto contentLayout = new QVBoxLayout(mainWidget); auto contentLayout = new QVBoxLayout(mainWidget);
contentLayout->setMargin(0); contentLayout->setMargin(0);
contentLayout->setSpacing(0);
auto emojiCategories = new QFrame(mainWidget); auto emojiCategories = new QFrame(mainWidget);
// emojiCategories->setStyleSheet("background-color: #f2f2f2"); emojiCategories->setStyleSheet("background-color: #f2f2f2");
auto categoriesLayout = new QHBoxLayout(emojiCategories); auto categoriesLayout = new QHBoxLayout(emojiCategories);
categoriesLayout->setSpacing(6); categoriesLayout->setSpacing(0);
categoriesLayout->setMargin(5); categoriesLayout->setMargin(0);
QIcon icon; QIcon icon;
@ -126,6 +125,7 @@ EmojiPanel::EmojiPanel(QWidget *parent)
auto scrollLayout = new QVBoxLayout(scrollWidget); auto scrollLayout = new QVBoxLayout(scrollWidget);
scrollLayout->setMargin(0); scrollLayout->setMargin(0);
scrollLayout->setSpacing(0);
scrollArea_->setWidget(scrollWidget); scrollArea_->setWidget(scrollWidget);
auto peopleEmoji = auto peopleEmoji =
@ -156,20 +156,9 @@ EmojiPanel::EmojiPanel(QWidget *parent)
auto flagsEmoji = new EmojiCategory(tr("Flags"), emoji_provider_.flags, scrollWidget); auto flagsEmoji = new EmojiCategory(tr("Flags"), emoji_provider_.flags, scrollWidget);
scrollLayout->addWidget(flagsEmoji); scrollLayout->addWidget(flagsEmoji);
contentLayout->addStretch(1);
contentLayout->addWidget(scrollArea_); contentLayout->addWidget(scrollArea_);
contentLayout->addWidget(emojiCategories); contentLayout->addWidget(emojiCategories);
opacity_ = new QGraphicsOpacityEffect(this);
opacity_->setOpacity(1.0);
setGraphicsEffect(opacity_);
animation_ = new QPropertyAnimation(opacity_, "opacity", this);
animation_->setDuration(animationDuration_);
animation_->setStartValue(1);
animation_->setEndValue(0);
connect(peopleEmoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected); connect(peopleEmoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(peopleCategory, &QPushButton::clicked, [this, peopleEmoji]() { connect(peopleCategory, &QPushButton::clicked, [this, peopleEmoji]() {
this->showEmojiCategory(peopleEmoji); this->showEmojiCategory(peopleEmoji);
@ -209,11 +198,6 @@ EmojiPanel::EmojiPanel(QWidget *parent)
connect(flagsCategory, &QPushButton::clicked, [this, flagsEmoji]() { connect(flagsCategory, &QPushButton::clicked, [this, flagsEmoji]() {
this->showEmojiCategory(flagsEmoji); this->showEmojiCategory(flagsEmoji);
}); });
connect(animation_, &QAbstractAnimation::finished, [this]() {
if (animation_->direction() == QAbstractAnimation::Forward)
this->hide();
});
} }
void void
@ -238,11 +222,9 @@ EmojiPanel::showEmojiCategory(const EmojiCategory *category)
} }
void void
EmojiPanel::leaveEvent(QEvent *event) EmojiPanel::leaveEvent(QEvent *)
{ {
Q_UNUSED(event); hide();
fadeOut();
} }
void void
@ -253,6 +235,8 @@ EmojiPanel::paintEvent(QPaintEvent *event)
QStyleOption opt; QStyleOption opt;
opt.init(this); opt.init(this);
QPainter p(this); QPainter p(this);
style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
DropShadow::draw(p, DropShadow::draw(p,
shadowMargin_, shadowMargin_,
4.0, 4.0,
@ -263,21 +247,4 @@ EmojiPanel::paintEvent(QPaintEvent *event)
0.6, 0.6,
width(), width(),
height()); height());
style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
// QWidget::paintEvent(event);
}
void
EmojiPanel::fadeOut()
{
animation_->setDirection(QAbstractAnimation::Forward);
animation_->start();
}
void
EmojiPanel::fadeIn()
{
animation_->setDirection(QAbstractAnimation::Backward);
animation_->start();
} }

View file

@ -43,7 +43,6 @@ EmojiPickButton::enterEvent(QEvent *e)
auto y = pos.y() - panel_size.height() - vertical_distance_; auto y = pos.y() - panel_size.height() - vertical_distance_;
panel_->move(x, y); panel_->move(x, y);
panel_->fadeIn();
panel_->show(); panel_->show();
} }
@ -62,5 +61,5 @@ EmojiPickButton::leaveEvent(QEvent *e)
if (panel_geometry.contains(pos)) if (panel_geometry.contains(pos))
return; return;
panel_->fadeOut(); panel_->hide();
} }