Adjust the widget size of the room list items

This commit is contained in:
Konstantinos Sideris 2018-10-06 17:21:03 +03:00
parent 420937ab83
commit 844443a324
7 changed files with 100 additions and 70 deletions

View file

@ -31,14 +31,47 @@
constexpr int MaxUnreadCountDisplayed = 99; constexpr int MaxUnreadCountDisplayed = 99;
constexpr int Padding = 9; constexpr int IconSize = 44;
constexpr int UnreadLineWidth = 6; // constexpr int MaxHeight = IconSize + 2 * Padding;
constexpr int UnreadLineOffset = 4;
constexpr int IconSize = 44;
constexpr int MaxHeight = IconSize + 2 * Padding;
constexpr int InviteBtnX = IconSize + 2 * Padding; struct WidgetMetrics
constexpr int InviteBtnY = IconSize / 2 + Padding + Padding / 3; {
int maxHeight;
int iconSize;
int padding;
int unit;
int unreadLineWidth;
int unreadLineOffset;
int inviteBtnX;
int inviteBtnY;
};
WidgetMetrics
getMetrics(const QFont &font)
{
WidgetMetrics m;
const int height = QFontMetrics(font).lineSpacing();
m.unit = height;
m.maxHeight = std::ceil((double)height * 3.5);
m.iconSize = std::ceil((double)height * 2.5);
m.padding = std::ceil((double)height / 2.0);
m.unreadLineWidth = m.padding - m.padding / 3;
m.unreadLineOffset = m.padding - m.padding / 4;
m.inviteBtnX = m.iconSize + 2 * m.padding;
m.inviteBtnX = m.iconSize / 2.0 + m.padding + m.padding / 3.0;
// std::cout << "unit " << m.unit << '\n';
// std::cout << "maxHeight " << m.maxHeight << '\n';
// std::cout << "iconSize " << m.iconSize << '\n';
// std::cout << "padding " << m.padding << '\n';
return m;
}
void void
RoomInfoListItem::init(QWidget *parent) RoomInfoListItem::init(QWidget *parent)
@ -47,7 +80,7 @@ RoomInfoListItem::init(QWidget *parent)
setMouseTracking(true); setMouseTracking(true);
setAttribute(Qt::WA_Hover); setAttribute(Qt::WA_Hover);
setFixedHeight(MaxHeight); setFixedHeight(getMetrics(QFont{}).maxHeight);
QPainterPath path; QPainterPath path;
path.addRect(0, 0, parent->width(), height()); path.addRect(0, 0, parent->width(), height());
@ -56,21 +89,11 @@ RoomInfoListItem::init(QWidget *parent)
ripple_overlay_->setClipPath(path); ripple_overlay_->setClipPath(path);
ripple_overlay_->setClipping(true); ripple_overlay_->setClipping(true);
usernameFont_ = font_; unreadCountFont_.setPointSizeF(unreadCountFont_.pointSizeF() * 0.8);
bubbleFont_ = font_;
bubbleFont_.setPointSizeF(font_.pointSizeF() * 1.3);
unreadCountFont_.setPointSizeF(font_.pointSizeF() * 0.8);
unreadCountFont_.setBold(true); unreadCountFont_.setBold(true);
bubbleDiameter_ = QFontMetrics(unreadCountFont_).averageCharWidth() * 3; bubbleDiameter_ = QFontMetrics(unreadCountFont_).averageCharWidth() * 3;
timestampFont_ = font_;
timestampFont_.setBold(false);
headingFont_ = font_;
headingFont_.setWeight(60);
menu_ = new Menu(this); menu_ = new Menu(this);
leaveRoom_ = new QAction(tr("Leave room"), this); leaveRoom_ = new QAction(tr("Leave room"), this);
connect(leaveRoom_, &QAction::triggered, this, [this]() { emit leaveRoom(roomId_); }); connect(leaveRoom_, &QAction::triggered, this, [this]() { emit leaveRoom(roomId_); });
@ -126,11 +149,13 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
p.setRenderHint(QPainter::SmoothPixmapTransform); p.setRenderHint(QPainter::SmoothPixmapTransform);
p.setRenderHint(QPainter::Antialiasing); p.setRenderHint(QPainter::Antialiasing);
QFontMetrics metrics(font_); QFontMetrics metrics(QFont{});
QPen titlePen(titleColor_); QPen titlePen(titleColor_);
QPen subtitlePen(subtitleColor_); QPen subtitlePen(subtitleColor_);
auto wm = getMetrics(QFont{});
if (isPressed_) { if (isPressed_) {
p.fillRect(rect(), highlightedBackgroundColor_); p.fillRect(rect(), highlightedBackgroundColor_);
titlePen.setColor(highlightedTitleColor_); titlePen.setColor(highlightedTitleColor_);
@ -141,57 +166,59 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
p.fillRect(rect(), backgroundColor_); p.fillRect(rect(), backgroundColor_);
} }
QRect avatarRegion(Padding, Padding, IconSize, IconSize); QRect avatarRegion(wm.padding, wm.padding, wm.iconSize, wm.iconSize);
// Description line with the default font. // Description line with the default font.
int bottom_y = MaxHeight - Padding - metrics.ascent() / 2; int bottom_y = wm.maxHeight - wm.padding - metrics.ascent() / 2;
if (width() > ui::sidebar::SmallSize) { if (width() > ui::sidebar::SmallSize) {
p.setFont(headingFont_); QFont headingFont;
headingFont.setWeight(QFont::Medium);
p.setFont(headingFont);
p.setPen(titlePen); p.setPen(titlePen);
const int msgStampWidth = const int msgStampWidth = QFontMetrics(QFont{}).width(lastMsgInfo_.timestamp) + 4;
QFontMetrics(timestampFont_).width(lastMsgInfo_.timestamp) + 4;
// We use the full width of the widget if there is no unread msg bubble. // We use the full width of the widget if there is no unread msg bubble.
const int bottomLineWidthLimit = (unreadMsgCount_ > 0) ? msgStampWidth : 0; const int bottomLineWidthLimit = (unreadMsgCount_ > 0) ? msgStampWidth : 0;
// Name line. // Name line.
QFontMetrics fontNameMetrics(headingFont_); QFontMetrics fontNameMetrics(headingFont);
int top_y = 2 * Padding + fontNameMetrics.ascent() / 2; int top_y = 2 * wm.padding + fontNameMetrics.ascent() / 2;
const auto name = const auto name = metrics.elidedText(
metrics.elidedText(roomName(), roomName(),
Qt::ElideRight, Qt::ElideRight,
(width() - IconSize - 2 * Padding - msgStampWidth) * 0.8); (width() - wm.iconSize - 2 * wm.padding - msgStampWidth) * 0.8);
p.drawText(QPoint(2 * Padding + IconSize, top_y), name); p.drawText(QPoint(2 * wm.padding + wm.iconSize, top_y), name);
if (roomType_ == RoomType::Joined) { if (roomType_ == RoomType::Joined) {
p.setFont(font_); p.setFont(QFont{});
p.setPen(subtitlePen); p.setPen(subtitlePen);
// The limit is the space between the end of the avatar and the start of the // The limit is the space between the end of the avatar and the start of the
// timestamp. // timestamp.
int usernameLimit = int usernameLimit =
std::max(0, width() - 3 * Padding - msgStampWidth - IconSize - 20); std::max(0, width() - 3 * wm.padding - msgStampWidth - wm.iconSize - 20);
auto userName = auto userName =
metrics.elidedText(lastMsgInfo_.username, Qt::ElideRight, usernameLimit); metrics.elidedText(lastMsgInfo_.username, Qt::ElideRight, usernameLimit);
p.setFont(usernameFont_); p.setFont(QFont{});
p.drawText(QPoint(2 * Padding + IconSize, bottom_y), userName); p.drawText(QPoint(2 * wm.padding + wm.iconSize, bottom_y), userName);
int nameWidth = QFontMetrics(usernameFont_).width(userName); int nameWidth = QFontMetrics(QFont{}).width(userName);
p.setFont(font_); p.setFont(QFont{});
// The limit is the space between the end of the username and the start of // The limit is the space between the end of the username and the start of
// the timestamp. // the timestamp.
int descriptionLimit = std::max( int descriptionLimit =
0, std::max(0,
width() - 3 * Padding - bottomLineWidthLimit - IconSize - nameWidth - 5); width() - 3 * wm.padding - bottomLineWidthLimit - wm.iconSize -
nameWidth - 5);
auto description = auto description =
metrics.elidedText(lastMsgInfo_.body, Qt::ElideRight, descriptionLimit); metrics.elidedText(lastMsgInfo_.body, Qt::ElideRight, descriptionLimit);
p.drawText(QPoint(2 * Padding + IconSize + nameWidth, bottom_y), p.drawText(QPoint(2 * wm.padding + wm.iconSize + nameWidth, bottom_y),
description); description);
// We show the last message timestamp. // We show the last message timestamp.
@ -201,16 +228,16 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
else else
p.setPen(QPen(timestampColor_)); p.setPen(QPen(timestampColor_));
p.setFont(timestampFont_); p.setFont(QFont{});
p.drawText(QPoint(width() - Padding - msgStampWidth, top_y), p.drawText(QPoint(width() - wm.padding - msgStampWidth, top_y),
lastMsgInfo_.timestamp); lastMsgInfo_.timestamp);
p.restore(); p.restore();
} else { } else {
int btnWidth = (width() - IconSize - 6 * Padding) / 2; int btnWidth = (width() - wm.iconSize - 6 * wm.padding) / 2;
acceptBtnRegion_ = QRectF(InviteBtnX, InviteBtnY, btnWidth, 20); acceptBtnRegion_ = QRectF(wm.inviteBtnX, wm.inviteBtnY, btnWidth, 20);
declineBtnRegion_ = declineBtnRegion_ = QRectF(
QRectF(InviteBtnX + btnWidth + 2 * Padding, InviteBtnY, btnWidth, 20); wm.inviteBtnX + btnWidth + 2 * wm.padding, wm.inviteBtnY, btnWidth, 20);
QPainterPath acceptPath; QPainterPath acceptPath;
acceptPath.addRoundedRect(acceptBtnRegion_, 10, 10); acceptPath.addRoundedRect(acceptBtnRegion_, 10, 10);
@ -227,7 +254,7 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
p.drawPath(declinePath); p.drawPath(declinePath);
p.setPen(QPen(btnTextColor_)); p.setPen(QPen(btnTextColor_));
p.setFont(font_); p.setFont(QFont{});
p.drawText(acceptBtnRegion_, Qt::AlignCenter, tr("Accept")); p.drawText(acceptBtnRegion_, Qt::AlignCenter, tr("Accept"));
p.drawText(declineBtnRegion_, Qt::AlignCenter, tr("Decline")); p.drawText(declineBtnRegion_, Qt::AlignCenter, tr("Decline"));
} }
@ -244,9 +271,11 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
p.setPen(Qt::NoPen); p.setPen(Qt::NoPen);
p.setBrush(brush); p.setBrush(brush);
p.drawEllipse(avatarRegion.center(), IconSize / 2, IconSize / 2); p.drawEllipse(avatarRegion.center(), wm.iconSize / 2, wm.iconSize / 2);
p.setFont(bubbleFont_); QFont bubbleFont;
bubbleFont.setPointSizeF(bubbleFont.pointSizeF() * 1.4);
p.setFont(bubbleFont);
p.setPen(avatarFgColor()); p.setPen(avatarFgColor());
p.setBrush(Qt::NoBrush); p.setBrush(Qt::NoBrush);
p.drawText( p.drawText(
@ -255,7 +284,7 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
p.save(); p.save();
QPainterPath path; QPainterPath path;
path.addEllipse(Padding, Padding, IconSize, IconSize); path.addEllipse(wm.padding, wm.padding, wm.iconSize, wm.iconSize);
p.setClipPath(path); p.setClipPath(path);
p.drawPixmap(avatarRegion, roomAvatar_); p.drawPixmap(avatarRegion, roomAvatar_);
@ -280,7 +309,7 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
? QFontMetrics(p.font()).averageCharWidth() ? QFontMetrics(p.font()).averageCharWidth()
: 0; : 0;
QRectF r(width() - bubbleDiameter_ - Padding - x_width, QRectF r(width() - bubbleDiameter_ - wm.padding - x_width,
bottom_y - bubbleDiameter_ / 2 - 5, bottom_y - bubbleDiameter_ / 2 - 5,
bubbleDiameter_ + x_width, bubbleDiameter_ + x_width,
bubbleDiameter_); bubbleDiameter_);
@ -309,11 +338,11 @@ RoomInfoListItem::paintEvent(QPaintEvent *event)
if (!isPressed_ && hasUnreadMessages_) { if (!isPressed_ && hasUnreadMessages_) {
QPen pen; QPen pen;
pen.setWidth(UnreadLineWidth); pen.setWidth(wm.unreadLineWidth);
pen.setColor(highlightedBackgroundColor_); pen.setColor(highlightedBackgroundColor_);
p.setPen(pen); p.setPen(pen);
p.drawLine(0, UnreadLineOffset, 0, height() - UnreadLineOffset); p.drawLine(0, wm.unreadLineOffset, 0, height() - wm.unreadLineOffset);
} }
} }

View file

@ -193,11 +193,6 @@ private:
QRectF declineBtnRegion_; QRectF declineBtnRegion_;
// Fonts // Fonts
QFont bubbleFont_;
QFont font_;
QFont headingFont_;
QFont timestampFont_;
QFont usernameFont_;
QFont unreadCountFont_; QFont unreadCountFont_;
int bubbleDiameter_; int bubbleDiameter_;

View file

@ -56,13 +56,16 @@ TypingDisplay::paintEvent(QPaintEvent *)
Painter p(this); Painter p(this);
PainterHighQualityEnabler hq(p); PainterHighQualityEnabler hq(p);
p.setFont(font()); QFont f;
f.setPointSizeF(f.pointSizeF() * 0.9);
p.setFont(f);
p.setPen(QPen(textColor())); p.setPen(QPen(textColor()));
QRect region = rect(); QRect region = rect();
region.translate(LEFT_PADDING, 0); region.translate(LEFT_PADDING, 0);
QFontMetrics fm(font()); QFontMetrics fm(f);
text_ = fm.elidedText(text_, Qt::ElideRight, (double)(width() * 0.75)); text_ = fm.elidedText(text_, Qt::ElideRight, (double)(width() * 0.75));
QPainterPath path; QPainterPath path;

View file

@ -48,9 +48,8 @@ UserInfoWidget::UserInfoWidget(QWidget *parent)
avatarLayout_ = new QHBoxLayout(); avatarLayout_ = new QHBoxLayout();
textLayout_ = new QVBoxLayout(); textLayout_ = new QVBoxLayout();
textLayout_->setSpacing(widgetMargin); textLayout_->setSpacing(widgetMargin / 2);
textLayout_->setContentsMargins( textLayout_->setContentsMargins(widgetMargin * 2, widgetMargin, widgetMargin, widgetMargin);
widgetMargin * 1.5, widgetMargin, widgetMargin, widgetMargin);
userAvatar_ = new Avatar(this); userAvatar_ = new Avatar(this);
userAvatar_->setObjectName("userAvatar"); userAvatar_->setObjectName("userAvatar");

View file

@ -56,6 +56,13 @@ UserSettings::load()
applyTheme(); applyTheme();
} }
void
UserSettings::setFontSize(double size)
{
baseFontSize_ = size;
save();
}
void void
UserSettings::setTheme(QString theme) UserSettings::setTheme(QString theme)
{ {

View file

@ -53,11 +53,7 @@ public:
save(); save();
} }
void setFontSize(double size) void setFontSize(double size);
{
baseFontSize_ = size;
save();
}
void setRoomOrdering(bool state) void setRoomOrdering(bool state)
{ {

View file

@ -518,6 +518,7 @@ TimelineView::init()
// Height of the typing display. // Height of the typing display.
QFont f; QFont f;
f.setPointSizeF(f.pointSizeF() * 0.9);
const int bottomMargin = QFontMetrics(f).height() + 6; const int bottomMargin = QFontMetrics(f).height() + 6;
scroll_layout_ = new QVBoxLayout(scroll_widget_); scroll_layout_ = new QVBoxLayout(scroll_widget_);