Add full emoji support

This commit is contained in:
Konstantinos Sideris 2017-04-23 21:31:08 +03:00
parent ebbce440bf
commit 42bb9bb63a
40 changed files with 2715 additions and 17 deletions

84
src/EmojiCategory.cc Normal file
View file

@ -0,0 +1,84 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* 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 <http://www.gnu.org/licenses/>.
*/
#include <QDebug>
#include <QScrollBar>
#include "EmojiCategory.h"
EmojiCategory::EmojiCategory(QString category, QList<Emoji> emoji, QWidget *parent)
: QWidget(parent)
{
mainLayout_ = new QVBoxLayout(this);
mainLayout_->setMargin(0);
emojiListView_ = new QListView();
itemModel_ = new QStandardItemModel(this);
delegate_ = new EmojiItemDelegate(this);
data_ = new Emoji;
emojiListView_->setItemDelegate(delegate_);
emojiListView_->setSpacing(5);
emojiListView_->setModel(itemModel_);
emojiListView_->setViewMode(QListView::IconMode);
emojiListView_->setFlow(QListView::LeftToRight);
emojiListView_->setResizeMode(QListView::Adjust);
emojiListView_->verticalScrollBar()->setEnabled(false);
emojiListView_->horizontalScrollBar()->setEnabled(false);
const int cols = 7;
const int rows = emoji.size() / 7;
// TODO: Be precise here. Take the parent into consideration.
emojiListView_->setFixedSize(cols * 50 + 20, rows * 50 + 20);
emojiListView_->setGridSize(QSize(50, 50));
emojiListView_->setDragEnabled(false);
emojiListView_->setEditTriggers(QAbstractItemView::NoEditTriggers);
for (const auto &e : emoji) {
data_->unicode = e.unicode;
auto item = new QStandardItem;
item->setSizeHint(QSize(24, 24));
QVariant unicode(data_->unicode);
item->setData(unicode.toString(), Qt::UserRole);
itemModel_->appendRow(item);
}
category_ = new QLabel(category, this);
category_->setStyleSheet(
"color: #ccc;"
"margin: 20px 0px 15px 8px;"
"font-weight: 500;"
"font-size: 12px;");
auto labelLayout_ = new QHBoxLayout();
labelLayout_->addWidget(category_);
labelLayout_->addStretch(1);
mainLayout_->addLayout(labelLayout_);
mainLayout_->addWidget(emojiListView_);
connect(emojiListView_, &QListView::clicked, this, &EmojiCategory::clickIndex);
}
EmojiCategory::~EmojiCategory()
{
}

47
src/EmojiItemDelegate.cc Normal file
View file

@ -0,0 +1,47 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* 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 <http://www.gnu.org/licenses/>.
*/
#include <QDebug>
#include <QPainter>
#include "EmojiItemDelegate.h"
EmojiItemDelegate::EmojiItemDelegate(QObject *parent)
: QStyledItemDelegate(parent)
{
data_ = new Emoji;
}
EmojiItemDelegate::~EmojiItemDelegate()
{
delete data_;
}
void EmojiItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
Q_UNUSED(index);
QStyleOptionViewItem viewOption(option);
auto emoji = index.data(Qt::UserRole).toString();
QFont font("Emoji One");
font.setPixelSize(19);
painter->setFont(font);
painter->drawText(viewOption.rect, emoji);
}

247
src/EmojiPanel.cc Normal file
View file

@ -0,0 +1,247 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* 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 <http://www.gnu.org/licenses/>.
*/
#include <QDebug>
#include <QLabel>
#include <QPushButton>
#include <QScrollArea>
#include <QScrollBar>
#include <QVBoxLayout>
#include "Avatar.h"
#include "EmojiCategory.h"
#include "EmojiPanel.h"
#include "FlatButton.h"
EmojiPanel::EmojiPanel(QWidget *parent)
: QFrame(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::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);
// TODO: Make it MainWindow aware
auto main_frame_ = new QFrame(this);
main_frame_->setMinimumSize(370, 350);
main_frame_->setMaximumSize(370, 350);
auto top_layout = new QVBoxLayout(this);
top_layout->addWidget(main_frame_);
top_layout->setMargin(0);
auto content_layout = new QVBoxLayout(main_frame_);
content_layout->setMargin(0);
auto emoji_categories = new QFrame(main_frame_);
emoji_categories->setStyleSheet("background-color: #f2f2f2");
auto categories_layout = new QHBoxLayout(emoji_categories);
categories_layout->setSpacing(6);
categories_layout->setMargin(5);
auto people_category = new FlatButton(emoji_categories);
people_category->setIcon(QIcon(":/icons/icons/emoji-categories/people.png"));
people_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
people_category->setForegroundColor("gray");
auto nature_category = new FlatButton(emoji_categories);
nature_category->setIcon(QIcon(":/icons/icons/emoji-categories/nature.png"));
nature_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
nature_category->setForegroundColor("gray");
auto food_category = new FlatButton(emoji_categories);
food_category->setIcon(QIcon(":/icons/icons/emoji-categories/foods.png"));
food_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
food_category->setForegroundColor("gray");
auto activity_category = new FlatButton(emoji_categories);
activity_category->setIcon(QIcon(":/icons/icons/emoji-categories/activity.png"));
activity_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
activity_category->setForegroundColor("gray");
auto travel_category = new FlatButton(emoji_categories);
travel_category->setIcon(QIcon(":/icons/icons/emoji-categories/travel.png"));
travel_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
travel_category->setForegroundColor("gray");
auto objects_category = new FlatButton(emoji_categories);
objects_category->setIcon(QIcon(":/icons/icons/emoji-categories/objects.png"));
objects_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
objects_category->setForegroundColor("gray");
auto symbols_category = new FlatButton(emoji_categories);
symbols_category->setIcon(QIcon(":/icons/icons/emoji-categories/symbols.png"));
symbols_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
symbols_category->setForegroundColor("gray");
auto flags_category = new FlatButton(emoji_categories);
flags_category->setIcon(QIcon(":/icons/icons/emoji-categories/flags.png"));
flags_category->setIconSize(QSize(category_icon_size_, category_icon_size_));
flags_category->setForegroundColor("gray");
categories_layout->addWidget(people_category);
categories_layout->addWidget(nature_category);
categories_layout->addWidget(food_category);
categories_layout->addWidget(activity_category);
categories_layout->addWidget(travel_category);
categories_layout->addWidget(objects_category);
categories_layout->addWidget(symbols_category);
categories_layout->addWidget(flags_category);
scroll_area_ = new QScrollArea(this);
scroll_area_->setWidgetResizable(true);
scroll_area_->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
auto scroll_widget_ = new QWidget(this);
auto scroll_layout_ = new QVBoxLayout(scroll_widget_);
scroll_layout_->setMargin(0);
scroll_area_->setWidget(scroll_widget_);
auto people_emoji = new EmojiCategory("Smileys & People", emoji_provider_.people, scroll_widget_);
scroll_layout_->addWidget(people_emoji);
auto nature_emoji = new EmojiCategory("Animals & Nature", emoji_provider_.nature, scroll_widget_);
scroll_layout_->addWidget(nature_emoji);
auto food_emoji = new EmojiCategory("Food & Drink", emoji_provider_.food, scroll_widget_);
scroll_layout_->addWidget(food_emoji);
auto activity_emoji = new EmojiCategory("Activity", emoji_provider_.activity, scroll_widget_);
scroll_layout_->addWidget(activity_emoji);
auto travel_emoji = new EmojiCategory("Travel & Places", emoji_provider_.travel, scroll_widget_);
scroll_layout_->addWidget(travel_emoji);
auto objects_emoji = new EmojiCategory("Objects", emoji_provider_.objects, scroll_widget_);
scroll_layout_->addWidget(objects_emoji);
auto symbols_emoji = new EmojiCategory("Symbols", emoji_provider_.symbols, scroll_widget_);
scroll_layout_->addWidget(symbols_emoji);
auto flags_emoji = new EmojiCategory("Flags", emoji_provider_.flags, scroll_widget_);
scroll_layout_->addWidget(flags_emoji);
content_layout->addStretch(1);
content_layout->addWidget(scroll_area_);
content_layout->addWidget(emoji_categories);
setLayout(top_layout);
// TODO: Add parallel animation with geometry
opacity_ = new QGraphicsOpacityEffect(this);
opacity_->setOpacity(1.0);
setGraphicsEffect(opacity_);
animation_ = new QPropertyAnimation(opacity_, "opacity", this);
animation_->setDuration(180);
animation_->setStartValue(1.0);
animation_->setEndValue(0.0);
connect(people_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(people_category, &QPushButton::clicked, [this, people_emoji]() {
this->showEmojiCategory(people_emoji);
});
connect(nature_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(nature_category, &QPushButton::clicked, [this, nature_emoji]() {
this->showEmojiCategory(nature_emoji);
});
connect(food_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(food_category, &QPushButton::clicked, [this, food_emoji]() {
this->showEmojiCategory(food_emoji);
});
connect(activity_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(activity_category, &QPushButton::clicked, [this, activity_emoji]() {
this->showEmojiCategory(activity_emoji);
});
connect(travel_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(travel_category, &QPushButton::clicked, [this, travel_emoji]() {
this->showEmojiCategory(travel_emoji);
});
connect(objects_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(objects_category, &QPushButton::clicked, [this, objects_emoji]() {
this->showEmojiCategory(objects_emoji);
});
connect(symbols_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(symbols_category, &QPushButton::clicked, [this, symbols_emoji]() {
this->showEmojiCategory(symbols_emoji);
});
connect(flags_emoji, &EmojiCategory::emojiSelected, this, &EmojiPanel::emojiSelected);
connect(flags_category, &QPushButton::clicked, [this, flags_emoji]() {
this->showEmojiCategory(flags_emoji);
});
connect(animation_, &QPropertyAnimation::finished, [this]() {
if (animation_->direction() == QAbstractAnimation::Forward)
this->hide();
});
}
void EmojiPanel::showEmojiCategory(const EmojiCategory *category)
{
auto posToGo = category->mapToParent(QPoint()).y();
auto current = scroll_area_->verticalScrollBar()->value();
if (current == posToGo)
return;
// HACK
// If we want to go to a previous category and position the label at the top
// the 6*50 offset won't work because not all the categories have the same height.
// To ensure the category is at the top, we move to the top
// and go as normal to the next category.
if (current > posToGo)
this->scroll_area_->ensureVisible(0, 0, 0, 0);
posToGo += 6 * 50;
this->scroll_area_->ensureVisible(0, posToGo, 0, 0);
}
void EmojiPanel::leaveEvent(QEvent *event)
{
Q_UNUSED(event);
fadeOut();
}
void EmojiPanel::fadeOut()
{
animation_->setDirection(QAbstractAnimation::Forward);
animation_->start();
}
void EmojiPanel::fadeIn()
{
animation_->setDirection(QAbstractAnimation::Backward);
animation_->start();
}

65
src/EmojiPickButton.cc Normal file
View file

@ -0,0 +1,65 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* 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 <http://www.gnu.org/licenses/>.
*/
#include <QDebug>
#include "EmojiPickButton.h"
EmojiPickButton::EmojiPickButton(QWidget *parent)
: FlatButton(parent)
, panel_{nullptr}
{
}
void EmojiPickButton::enterEvent(QEvent *e)
{
Q_UNUSED(e);
if (panel_ == nullptr) {
panel_ = new EmojiPanel(this);
connect(panel_, &EmojiPanel::emojiSelected, this, &EmojiPickButton::emojiSelected);
}
QPoint pos(rect().x(), rect().y());
pos = this->mapToGlobal(pos);
auto panel_size = panel_->sizeHint();
auto x = pos.x() - panel_size.width() + horizontal_distance_;
auto y = pos.y() - panel_size.height() - vertical_distance_;
panel_->move(x, y);
panel_->fadeIn();
panel_->show();
}
void EmojiPickButton::leaveEvent(QEvent *e)
{
Q_UNUSED(e);
if (panel_->underMouse())
return;
auto pos = QCursor::pos();
auto panel_geometry = panel_->geometry();
panel_geometry.adjust(0, 0, 0, vertical_distance_);
if (panel_geometry.contains(pos))
return;
panel_->fadeOut();
}

1470
src/EmojiProvider.cc Normal file

File diff suppressed because it is too large Load diff

View file

@ -142,10 +142,10 @@ QString HistoryViewItem::replaceEmoji(const QString &body)
QString fmtBody = "";
for (auto &c : body) {
auto code = c.unicode();
int code = c.unicode();
// TODO: A map should be used with the unicode codes supported by emoji one
if (code > 127)
// TODO: Be more precise here.
if (code > 9000)
fmtBody += "<span style=\"font-family: Emoji One; font-size: 16px\">" + QString(c) + "</span>";
else
fmtBody += c;

View file

@ -16,11 +16,25 @@
*/
#include <QDebug>
#include <QFile>
#include <QPainter>
#include <QStyleOption>
#include "TextInputWidget.h"
FilteredTextEdit::FilteredTextEdit(QWidget *parent)
: QTextEdit(parent)
{
}
void FilteredTextEdit::keyPressEvent(QKeyEvent *event)
{
if (event->key() == Qt::Key_Return || event->key() == Qt::Key_Enter)
emit enterPressed();
else
QTextEdit::keyPressEvent(event);
}
TextInputWidget::TextInputWidget(QWidget *parent)
: QWidget(parent)
{
@ -31,8 +45,8 @@ TextInputWidget::TextInputWidget(QWidget *parent)
setStyleSheet("background-color: #f8fbfe; height: 45px;");
top_layout_ = new QHBoxLayout();
top_layout_->setSpacing(6);
top_layout_->setContentsMargins(6, 0, 0, 0);
top_layout_->setSpacing(0);
top_layout_->setMargin(0);
send_file_button_ = new FlatButton(this);
send_file_button_->setCursor(Qt::PointingHandCursor);
@ -43,9 +57,10 @@ TextInputWidget::TextInputWidget(QWidget *parent)
send_file_button_->setIcon(send_file_icon);
send_file_button_->setIconSize(QSize(24, 24));
input_ = new QLineEdit(this);
input_ = new FilteredTextEdit(this);
input_->setFixedHeight(45);
input_->setPlaceholderText("Write a message...");
input_->setStyleSheet("color: black; font-size: 10pt; border-radius: 0; padding: 2px; margin-bottom: 4px;");
input_->setStyleSheet("color: #333333; font-size: 13px; border-radius: 0; padding-top: 10px;");
send_message_button_ = new FlatButton(this);
send_message_button_->setCursor(Qt::PointingHandCursor);
@ -56,24 +71,59 @@ TextInputWidget::TextInputWidget(QWidget *parent)
send_message_button_->setIcon(send_message_icon);
send_message_button_->setIconSize(QSize(24, 24));
emoji_button_ = new EmojiPickButton(this);
emoji_button_->setCursor(Qt::PointingHandCursor);
emoji_button_->setForegroundColor(QColor("#acc7dc"));
QIcon emoji_icon;
emoji_icon.addFile(":/icons/icons/smile.png", QSize(), QIcon::Normal, QIcon::Off);
emoji_button_->setIcon(emoji_icon);
emoji_button_->setIconSize(QSize(24, 24));
top_layout_->addWidget(send_file_button_);
top_layout_->addWidget(input_);
top_layout_->addWidget(emoji_button_);
top_layout_->addWidget(send_message_button_);
setLayout(top_layout_);
connect(send_message_button_, SIGNAL(clicked()), this, SLOT(onSendButtonClicked()));
connect(input_, SIGNAL(returnPressed()), send_message_button_, SIGNAL(clicked()));
connect(input_, SIGNAL(enterPressed()), send_message_button_, SIGNAL(clicked()));
connect(emoji_button_, SIGNAL(emojiSelected(const QString &)), this, SLOT(addSelectedEmoji(const QString &)));
}
void TextInputWidget::addSelectedEmoji(const QString &emoji)
{
QTextCursor cursor = input_->textCursor();
QFont emoji_font("Emoji One");
emoji_font.setPixelSize(18);
QFont text_font("Open Sans");
text_font.setPixelSize(13);
QTextCharFormat charfmt;
charfmt.setFont(emoji_font);
input_->setCurrentCharFormat(charfmt);
input_->insertPlainText(emoji);
cursor.movePosition(QTextCursor::End);
charfmt.setFont(text_font);
input_->setCurrentCharFormat(charfmt);
input_->show();
}
void TextInputWidget::onSendButtonClicked()
{
auto msg_text = input_->text().trimmed();
auto msg_text = input_->document()->toPlainText().trimmed();
if (msg_text.isEmpty())
return;
emit sendTextMessage(msg_text);
input_->clear();
}

View file

@ -472,11 +472,11 @@ void FlatButton::paintForeground(QPainter *painter)
QRect textGeometry(pos + QPoint(0, base.height() / 2), textSize);
QRect iconGeometry(pos + QPoint(0, (height() - iconSize().height()) / 2), iconSize());
if (ui::LeftIcon == icon_placement_) {
textGeometry.translate(iw, 0);
} else {
iconGeometry.translate(textSize.width() + IconPadding, 0);
}
/* if (ui::LeftIcon == icon_placement_) { */
/* textGeometry.translate(iw, 0); */
/* } else { */
/* iconGeometry.translate(textSize.width() + IconPadding, 0); */
/* } */
painter->drawText(textGeometry, Qt::AlignCenter, text());