diff --git a/include/Config.h b/include/Config.h new file mode 100644 index 0000000..147f444 --- /dev/null +++ b/include/Config.h @@ -0,0 +1,63 @@ +#pragma once + +// Non-theme app configuration. Layouts, fonts spacing etc. +// +// Font sizes are in pixels. + +namespace conf +{ +// Global settings. +static const int fontSize = 12; +static const int emojiSize = 14; +static const int headerFontSize = 21; + +// Button settings. +namespace btn +{ +static const int fontSize = 20; +static const int cornerRadius = 3; +} + +// RoomList specific. +namespace roomlist +{ +namespace fonts +{ +static const int heading = 13; +static const int badge = 10; +static const int bubble = 20; +} // namespace fonts +} // namespace roomlist + +namespace userInfoWidget +{ +namespace fonts +{ +static const int displayName = 16; +static const int userid = 14; +} // namespace fonts +} // namespace userInfoWidget + +namespace topRoomBar +{ +namespace fonts +{ +static const int roomName = 15; +static const int roomDescription = 13; +} // namespace fonts +} // namespace topRoomBar + +namespace timeline +{ +static const int msgMargin = 11; +static const int avatarSize = 36; +static const int headerSpacing = 5; +static const int headerLeftMargin = 12; + +namespace fonts +{ +static const int timestamp = 9; +} +} + +} // namespace conf diff --git a/include/RoomInfoListItem.h b/include/RoomInfoListItem.h index f725dc0..12d5abb 100644 --- a/include/RoomInfoListItem.h +++ b/include/RoomInfoListItem.h @@ -75,12 +75,6 @@ private: QPixmap roomAvatar_; - // Sizes are relative to the default font size of the Widget. - static const float UnreadCountFontRatio; - static const float RoomNameFontRatio; - static const float RoomDescriptionFontRatio; - static const float RoomAvatarLetterFontRatio; - Menu *menu_; QAction *toggleNotifications_; diff --git a/include/TextInputWidget.h b/include/TextInputWidget.h index e176d48..225750f 100644 --- a/include/TextInputWidget.h +++ b/include/TextInputWidget.h @@ -63,7 +63,4 @@ private: FlatButton *send_file_button_; FlatButton *send_message_button_; EmojiPickButton *emoji_button_; - - const float TextFontRatio = 1.1; - const float EmojiFontRatio = 1.3; }; diff --git a/include/TimelineItem.h b/include/TimelineItem.h index 6fd26f5..50a21df 100644 --- a/include/TimelineItem.h +++ b/include/TimelineItem.h @@ -69,16 +69,10 @@ private: QHBoxLayout *headerLayout_; // Username (&) Timestamp - int MessageMargin; - - const int AvatarSize = 36; - const float TimestampFontRatio = 0.8; - const float EmojiFontRatio = 1.4; - - float EmojiSize = 13; - Avatar *userAvatar_; + QFont font_; + QLabel *timestamp_; QLabel *userName_; QLabel *body_; diff --git a/include/TopRoomBar.h b/include/TopRoomBar.h index ad24609..d5cb8e8 100644 --- a/include/TopRoomBar.h +++ b/include/TopRoomBar.h @@ -68,9 +68,6 @@ private: Avatar *avatar_; int buttonSize_; - - const float RoomNameFontRatio = 1.2; - const float RoomDescriptionFontRatio = 1; }; inline void TopRoomBar::updateRoomAvatar(const QImage &avatar_image) diff --git a/include/UserInfoWidget.h b/include/UserInfoWidget.h index 35f7a6f..10c770d 100644 --- a/include/UserInfoWidget.h +++ b/include/UserInfoWidget.h @@ -72,7 +72,4 @@ private: LogoutDialog *logoutDialog_; int logoutButtonSize_; - - const float DisplayNameFontRatio = 1.3; - const float UserIdFontRatio = 1.1; }; diff --git a/include/ui/Menu.h b/include/ui/Menu.h index 44c13b7..7794b2d 100644 --- a/include/ui/Menu.h +++ b/include/ui/Menu.h @@ -2,13 +2,18 @@ #include +#include "Config.h" + class Menu : public QMenu { public: Menu(QWidget *parent = nullptr) : QMenu(parent) { - setFont(QFont("Open Sans", 10)); + QFont font; + font.setPixelSize(conf::fontSize); + + setFont(font); setStyleSheet( "QMenu { color: black; background-color: white; margin: 0px;}" "QMenu::item { color: black; padding: 7px 20px; border: 1px solid transparent; margin: 2px 0px; }" diff --git a/src/EmojiCategory.cc b/src/EmojiCategory.cc index 3aa3009..f633e5e 100644 --- a/src/EmojiCategory.cc +++ b/src/EmojiCategory.cc @@ -18,6 +18,7 @@ #include #include +#include "Config.h" #include "EmojiCategory.h" EmojiCategory::EmojiCategory(QString category, QList emoji, QWidget *parent) @@ -62,12 +63,12 @@ EmojiCategory::EmojiCategory(QString category, QList emoji, QWidget *pare itemModel_->appendRow(item); } + QFont font("Open Sans SemiBold"); + font.setPixelSize(conf::fontSize); + category_ = new QLabel(category, this); - category_->setStyleSheet( - "color: #ccc;" - "margin: 20px 0px 15px 8px;" - "font-weight: 500;" - "font-size: 12px;"); + category_->setFont(font); + category_->setStyleSheet("color: #ccc; margin: 20px 0px 15px 8px;"); auto labelLayout_ = new QHBoxLayout(); labelLayout_->addWidget(category_); diff --git a/src/LoginPage.cc b/src/LoginPage.cc index 24bfd14..329cdeb 100644 --- a/src/LoginPage.cc +++ b/src/LoginPage.cc @@ -17,6 +17,7 @@ #include +#include "Config.h" #include "InputValidator.h" #include "LoginPage.h" @@ -119,15 +120,19 @@ LoginPage::LoginPage(QSharedPointer client, QWidget *parent) login_button_->setBackgroundColor(QColor("#333333")); login_button_->setForegroundColor(QColor("white")); login_button_->setMinimumSize(350, 65); - login_button_->setFontSize(17); + login_button_->setFontSize(20); login_button_->setCornerRadius(3); button_layout_->addStretch(1); button_layout_->addWidget(login_button_); button_layout_->addStretch(1); + QFont font; + font.setPixelSize(conf::fontSize); + error_label_ = new QLabel(this); - error_label_->setStyleSheet("color: #E22826; font-size: 11pt;"); + error_label_->setFont(font); + error_label_->setStyleSheet("color: #E22826"); top_layout_->addLayout(top_bar_layout_); top_layout_->addStretch(1); diff --git a/src/LogoutDialog.cc b/src/LogoutDialog.cc index b8d5544..db3ab34 100644 --- a/src/LogoutDialog.cc +++ b/src/LogoutDialog.cc @@ -18,6 +18,7 @@ #include #include +#include "Config.h" #include "LogoutDialog.h" #include "Theme.h" @@ -36,17 +37,20 @@ LogoutDialog::LogoutDialog(QWidget *parent) buttonLayout->setMargin(0); confirmBtn_ = new FlatButton("OK", this); - confirmBtn_->setFontSize(12); + confirmBtn_->setFontSize(conf::btn::fontSize); cancelBtn_ = new FlatButton(tr("CANCEL"), this); - cancelBtn_->setFontSize(12); + cancelBtn_->setFontSize(conf::btn::fontSize); buttonLayout->addStretch(1); buttonLayout->addWidget(confirmBtn_); buttonLayout->addWidget(cancelBtn_); + QFont font; + font.setPixelSize(conf::headerFontSize); + auto label = new QLabel(tr("Logout. Are you sure?"), this); - label->setFont(QFont("Open Sans", 14)); + label->setFont(font); label->setStyleSheet("color: #333333"); layout->addWidget(label); diff --git a/src/RegisterPage.cc b/src/RegisterPage.cc index 867ac7f..d6120c3 100644 --- a/src/RegisterPage.cc +++ b/src/RegisterPage.cc @@ -18,6 +18,7 @@ #include #include +#include "Config.h" #include "InputValidator.h" #include "RegisterPage.h" @@ -101,15 +102,19 @@ RegisterPage::RegisterPage(QSharedPointer client, QWidget *parent) button_layout_->setSpacing(0); button_layout_->setMargin(0); + QFont font; + font.setPixelSize(conf::fontSize); + error_label_ = new QLabel(this); - error_label_->setStyleSheet("margin-bottom: 10px; color: #E22826; font-size: 11pt;"); + error_label_->setFont(font); + error_label_->setStyleSheet("color: #E22826"); register_button_ = new RaisedButton(tr("REGISTER"), this); register_button_->setBackgroundColor(QColor("#333333")); register_button_->setForegroundColor(QColor("white")); register_button_->setMinimumSize(350, 65); - register_button_->setFontSize(17); - register_button_->setCornerRadius(3); + register_button_->setFontSize(conf::btn::fontSize); + register_button_->setCornerRadius(conf::btn::cornerRadius); button_layout_->addStretch(1); button_layout_->addWidget(register_button_); diff --git a/src/RoomInfoListItem.cc b/src/RoomInfoListItem.cc index eec53ce..11d4da5 100644 --- a/src/RoomInfoListItem.cc +++ b/src/RoomInfoListItem.cc @@ -19,16 +19,12 @@ #include #include +#include "Config.h" #include "Ripple.h" #include "RoomInfoListItem.h" #include "RoomState.h" #include "Theme.h" -const float RoomInfoListItem::UnreadCountFontRatio = 0.8; -const float RoomInfoListItem::RoomNameFontRatio = 1.1; -const float RoomInfoListItem::RoomDescriptionFontRatio = 1.1; -const float RoomInfoListItem::RoomAvatarLetterFontRatio = 1.8; - RoomInfoListItem::RoomInfoListItem(QSharedPointer settings, RoomState state, QString room_id, @@ -90,14 +86,15 @@ void RoomInfoListItem::paintEvent(QPaintEvent *event) p.fillRect(rect(), QColor("#F8FBFE")); QFont font; + font.setPixelSize(conf::fontSize); QFontMetrics metrics(font); p.setPen(QColor("#333")); QRect avatarRegion(Padding, Padding, IconSize, IconSize); - // Description line - int bottom_y = maxHeight_ - Padding - metrics.height() / 2 + Padding / 2; + // Description line with the default font. + int bottom_y = maxHeight_ - Padding - Padding / 3 - metrics.ascent() / 2; if (width() > ui::sidebar::SmallSize) { if (isPressed_) { @@ -105,11 +102,15 @@ void RoomInfoListItem::paintEvent(QPaintEvent *event) p.setPen(pen); } - font.setPointSize(this->font().pointSize() * RoomNameFontRatio); + font.setPixelSize(conf::roomlist::fonts::heading); p.setFont(font); + // Name line. + QFontMetrics fontNameMetrics(font); + int top_y = 2 * Padding + fontNameMetrics.ascent() / 2; + auto name = metrics.elidedText(state_.getName(), Qt::ElideRight, (width() - IconSize - 2 * Padding) * 0.8); - p.drawText(QPoint(2 * Padding + IconSize, Padding + metrics.height()), name); + p.drawText(QPoint(2 * Padding + IconSize, top_y), name); if (!isPressed_) { QPen pen(QColor("#5d6565")); @@ -121,7 +122,7 @@ void RoomInfoListItem::paintEvent(QPaintEvent *event) if (unreadMsgCount_ > 0) descPercentage = 0.8; - font.setPointSize(this->font().pointSize() * RoomDescriptionFontRatio); + font.setPixelSize(conf::fontSize); p.setFont(font); auto description = metrics.elidedText(state_.getTopic(), Qt::ElideRight, width() * descPercentage - 2 * Padding - IconSize); @@ -141,7 +142,7 @@ void RoomInfoListItem::paintEvent(QPaintEvent *event) p.drawEllipse(avatarRegion.center(), IconSize / 2, IconSize / 2); - font.setPointSize(this->font().pointSize() * RoomAvatarLetterFontRatio); + font.setPixelSize(conf::roomlist::fonts::bubble); p.setFont(font); p.setPen(QColor("#333")); p.setBrush(Qt::NoBrush); @@ -169,7 +170,7 @@ void RoomInfoListItem::paintEvent(QPaintEvent *event) brush.setColor(textColor); QFont unreadCountFont; - unreadCountFont.setPointSize(this->font().pointSize() * UnreadCountFontRatio); + unreadCountFont.setPixelSize(conf::roomlist::fonts::badge); unreadCountFont.setBold(true); p.setBrush(brush); diff --git a/src/TextInputWidget.cc b/src/TextInputWidget.cc index f09608a..9b70cd9 100644 --- a/src/TextInputWidget.cc +++ b/src/TextInputWidget.cc @@ -20,6 +20,7 @@ #include #include +#include "Config.h" #include "TextInputWidget.h" FilteredTextEdit::FilteredTextEdit(QWidget *parent) @@ -58,7 +59,7 @@ TextInputWidget::TextInputWidget(QWidget *parent) send_file_button_->setIconSize(QSize(24, 24)); QFont font; - font.setPointSize(this->font().pointSize() * TextFontRatio); + font.setPixelSize(conf::fontSize); input_ = new FilteredTextEdit(this); input_->setFixedHeight(45); @@ -99,10 +100,10 @@ void TextInputWidget::addSelectedEmoji(const QString &emoji) QTextCursor cursor = input_->textCursor(); QFont emoji_font("Emoji One"); - emoji_font.setPointSize(this->font().pointSize() * EmojiFontRatio); + emoji_font.setPixelSize(conf::emojiSize); QFont text_font("Open Sans"); - text_font.setPixelSize(this->font().pointSize() * TextFontRatio); + text_font.setPixelSize(conf::fontSize); QTextCharFormat charfmt; charfmt.setFont(emoji_font); diff --git a/src/TimelineItem.cc b/src/TimelineItem.cc index 66c55f0..7db1c7c 100644 --- a/src/TimelineItem.cc +++ b/src/TimelineItem.cc @@ -22,6 +22,7 @@ #include #include "AvatarProvider.h" +#include "Config.h" #include "ImageItem.h" #include "TimelineItem.h" #include "TimelineViewManager.h" @@ -39,19 +40,16 @@ void TimelineItem::init() userName_ = nullptr; body_ = nullptr; - // Initialize layout spacing variables based on the current font. - QFontMetrics fm(this->font()); - const int baseWidth = fm.width('A'); - MessageMargin = baseWidth * 1.5; + font_.setPixelSize(conf::fontSize); - EmojiSize = this->font().pointSize() * EmojiFontRatio; + QFontMetrics fm(font_); topLayout_ = new QHBoxLayout(this); sideLayout_ = new QVBoxLayout(); mainLayout_ = new QVBoxLayout(); headerLayout_ = new QHBoxLayout(); - topLayout_->setContentsMargins(MessageMargin, MessageMargin, 0, 0); + topLayout_->setContentsMargins(conf::timeline::msgMargin, conf::timeline::msgMargin, 0, 0); topLayout_->setSpacing(0); topLayout_->addLayout(sideLayout_); @@ -60,11 +58,11 @@ void TimelineItem::init() sideLayout_->setMargin(0); sideLayout_->setSpacing(0); - mainLayout_->setContentsMargins(baseWidth * 2, 0, 0, 0); + mainLayout_->setContentsMargins(conf::timeline::headerLeftMargin, 0, 0, 0); mainLayout_->setSpacing(0); headerLayout_->setMargin(0); - headerLayout_->setSpacing(baseWidth / 2); + headerLayout_->setSpacing(conf::timeline::headerSpacing); } /* @@ -228,6 +226,7 @@ void TimelineItem::generateBody(const QString &body) QString content(" %1 "); body_ = new QLabel(this); + body_->setFont(font_); body_->setWordWrap(true); body_->setText(content.arg(replaceEmoji(body))); body_->setMargin(0); @@ -248,7 +247,7 @@ void TimelineItem::generateBody(const QString &userid, const QString &color, con QString userContent(" %2 "); QString bodyContent(" %1 "); - QFont usernameFont; + QFont usernameFont = font_; usernameFont.setBold(true); userName_ = new QLabel(this); @@ -259,6 +258,7 @@ void TimelineItem::generateBody(const QString &userid, const QString &color, con return; body_ = new QLabel(this); + body_->setFont(font_); body_->setWordWrap(true); body_->setText(bodyContent.arg(replaceEmoji(body))); body_->setTextInteractionFlags(Qt::TextSelectableByMouse | Qt::TextBrowserInteraction); @@ -271,10 +271,10 @@ void TimelineItem::generateTimestamp(const QDateTime &time) QString msg(" %1 "); QFont timestampFont; - timestampFont.setPointSize(this->font().pointSize() * TimestampFontRatio); + timestampFont.setPixelSize(conf::timeline::fonts::timestamp); QFontMetrics fm(timestampFont); - int topMargin = QFontMetrics(this->font()).height() - fm.height(); + int topMargin = QFontMetrics(font_).ascent() - fm.ascent(); timestamp_ = new QLabel(this); timestamp_->setFont(timestampFont); @@ -291,7 +291,7 @@ QString TimelineItem::replaceEmoji(const QString &body) // TODO: Be more precise here. if (code > 9000) - fmtBody += QString("").arg(EmojiSize) + + fmtBody += QString("").arg(conf::emojiSize) + QString(c) + ""; else @@ -303,13 +303,13 @@ QString TimelineItem::replaceEmoji(const QString &body) void TimelineItem::setupAvatarLayout(const QString &userName) { - topLayout_->setContentsMargins(MessageMargin, MessageMargin, 0, 0); + topLayout_->setContentsMargins(conf::timeline::msgMargin, conf::timeline::msgMargin, 0, 0); userAvatar_ = new Avatar(this); userAvatar_->setLetter(QChar(userName[0]).toUpper()); userAvatar_->setBackgroundColor(QColor("#eee")); userAvatar_->setTextColor(QColor("black")); - userAvatar_->setSize(AvatarSize); + userAvatar_->setSize(conf::timeline::avatarSize); // TODO: The provided user name should be a UserId class if (userName[0] == '@' && userName.size() > 1) @@ -332,14 +332,13 @@ void TimelineItem::setupSimpleLayout() // Align the end of the avatar bubble with the end of the timestamp for // messages with and without avatar. Otherwise their bodies would not be aligned. - int timestampWidth = timestamp_->fontMetrics().boundingRect(plainText).width(); - int offset = std::max(0, AvatarSize - timestampWidth) / 2; + int offset = std::max(0, conf::timeline::avatarSize - timestamp_->fontMetrics().width(plainText)); - int defaultFontHeight = QFontMetrics(this->font()).height(); + int defaultFontHeight = QFontMetrics(font_).ascent(); timestamp_->setAlignment(Qt::AlignTop); - timestamp_->setContentsMargins(offset, defaultFontHeight - timestamp_->fontMetrics().height(), offset, 0); - topLayout_->setContentsMargins(MessageMargin, MessageMargin / 3, 0, 0); + timestamp_->setContentsMargins(offset, defaultFontHeight - timestamp_->fontMetrics().ascent(), 0, 0); + topLayout_->setContentsMargins(conf::timeline::msgMargin, conf::timeline::msgMargin / 3, 0, 0); } void TimelineItem::setUserAvatar(const QImage &avatar) diff --git a/src/TopRoomBar.cc b/src/TopRoomBar.cc index 74e255a..9de19e8 100644 --- a/src/TopRoomBar.cc +++ b/src/TopRoomBar.cc @@ -17,6 +17,7 @@ #include +#include "Config.h" #include "TopRoomBar.h" TopRoomBar::TopRoomBar(QWidget *parent) @@ -41,18 +42,17 @@ TopRoomBar::TopRoomBar(QWidget *parent) text_layout_->setSpacing(0); text_layout_->setContentsMargins(0, 0, 0, 0); - QFont font; - font.setPointSize(this->font().pointSize() * RoomNameFontRatio); - font.setBold(true); + QFont roomFont("Open Sans SemiBold"); + roomFont.setPixelSize(conf::topRoomBar::fonts::roomName); name_label_ = new QLabel(this); - name_label_->setFont(font); + name_label_->setFont(roomFont); - font.setBold(false); - font.setPointSize(this->font().pointSize() * RoomDescriptionFontRatio); + QFont descriptionFont("Open Sans"); + descriptionFont.setPixelSize(conf::topRoomBar::fonts::roomDescription); topic_label_ = new QLabel(this); - topic_label_->setFont(font); + topic_label_->setFont(descriptionFont); text_layout_->addWidget(name_label_); text_layout_->addWidget(topic_label_); diff --git a/src/UserInfoWidget.cc b/src/UserInfoWidget.cc index a8fddcd..57e2cdd 100644 --- a/src/UserInfoWidget.cc +++ b/src/UserInfoWidget.cc @@ -18,6 +18,7 @@ #include #include +#include "Config.h" #include "FlatButton.h" #include "MainWindow.h" #include "UserInfoWidget.h" @@ -47,20 +48,19 @@ UserInfoWidget::UserInfoWidget(QWidget *parent) userAvatar_->setBackgroundColor("#f9f9f9"); userAvatar_->setTextColor("#333333"); - QFont font; - font.setBold(true); - font.setPointSize(this->font().pointSize() * DisplayNameFontRatio); + QFont nameFont("Open Sans SemiBold"); + nameFont.setPixelSize(conf::userInfoWidget::fonts::displayName); displayNameLabel_ = new QLabel(this); - displayNameLabel_->setFont(font); + displayNameLabel_->setFont(nameFont); displayNameLabel_->setStyleSheet("padding: 0 9px; color: #171919; margin-bottom: -10px;"); displayNameLabel_->setAlignment(Qt::AlignLeading | Qt::AlignLeft | Qt::AlignTop); - font.setBold(false); - font.setPointSize(this->font().pointSize() * UserIdFontRatio); + QFont useridFont("Open Sans"); + useridFont.setPixelSize(conf::userInfoWidget::fonts::userid); userIdLabel_ = new QLabel(this); - userIdLabel_->setFont(font); + userIdLabel_->setFont(useridFont); userIdLabel_->setStyleSheet("padding: 0 8px 8px 8px; color: #555459;"); userIdLabel_->setAlignment(Qt::AlignLeading | Qt::AlignLeft | Qt::AlignVCenter); @@ -129,7 +129,7 @@ void UserInfoWidget::resizeEvent(QResizeEvent *event) Q_UNUSED(event); if (width() <= ui::sidebar::SmallSize) { - topLayout_->setContentsMargins(0, 0, 10, 0); + topLayout_->setContentsMargins(0, 0, logoutButtonSize_ / 2 - 5 / 2, 0); userAvatar_->hide(); displayNameLabel_->hide(); diff --git a/src/WelcomePage.cc b/src/WelcomePage.cc index 67d6412..a39683f 100644 --- a/src/WelcomePage.cc +++ b/src/WelcomePage.cc @@ -18,6 +18,7 @@ #include #include +#include "Config.h" #include "WelcomePage.h" WelcomePage::WelcomePage(QWidget *parent) @@ -61,15 +62,15 @@ WelcomePage::WelcomePage(QWidget *parent) register_button_->setBackgroundColor(QColor("#333333")); register_button_->setForegroundColor(QColor("white")); register_button_->setMinimumSize(240, 60); - register_button_->setFontSize(14); - register_button_->setCornerRadius(3); + register_button_->setFontSize(conf::btn::fontSize); + register_button_->setCornerRadius(conf::btn::cornerRadius); login_button_ = new RaisedButton(tr("LOGIN"), this); login_button_->setBackgroundColor(QColor("#333333")); login_button_->setForegroundColor(QColor("white")); login_button_->setMinimumSize(240, 60); - login_button_->setFontSize(14); - login_button_->setCornerRadius(3); + login_button_->setFontSize(conf::btn::fontSize); + login_button_->setCornerRadius(conf::btn::cornerRadius); button_spacer_ = new QSpacerItem(20, 20, QSizePolicy::MinimumExpanding, QSizePolicy::Minimum); diff --git a/src/ui/FlatButton.cc b/src/ui/FlatButton.cc index 183b229..7526ba9 100644 --- a/src/ui/FlatButton.cc +++ b/src/ui/FlatButton.cc @@ -189,7 +189,7 @@ void FlatButton::setFontSize(qreal size) font_size_ = size; QFont f(font()); - f.setPointSizeF(size); + f.setPixelSize(size); setFont(f); update(); diff --git a/src/ui/TextField.cc b/src/ui/TextField.cc index a93d801..fea808b 100644 --- a/src/ui/TextField.cc +++ b/src/ui/TextField.cc @@ -74,7 +74,7 @@ void TextField::setLabelFontSize(qreal size) if (label_) { QFont font(label_->font()); - font.setPointSizeF(size); + font.setPixelSize(size); label_->setFont(font); label_->update(); }