Improved service messages layout.

This commit is contained in:
John Preston 2016-07-08 13:06:41 +03:00
parent d98a6d3f82
commit 5c474aee27
8 changed files with 49 additions and 23 deletions

View File

@ -666,7 +666,7 @@ scrollDef: flatScroll {
}
msgRadius: 16px;
serviceMsgRadius: 10px;
dateRadius: 10px;
buttonRadius: 3px;
scrollCountries: flatScroll(scrollDef) {

View File

@ -2112,12 +2112,12 @@ namespace {
::cornersMaskSmall[i]->setDevicePixelRatio(cRetinaFactor());
}
prepareCorners(WhiteCorners, st::buttonRadius, st::white);
prepareCorners(ServiceCorners, st::serviceMsgRadius, st::msgServiceBg);
prepareCorners(ServiceSelectedCorners, st::serviceMsgRadius, st::msgServiceSelectBg);
prepareCorners(StickerCorners, st::dateRadius, st::msgServiceBg);
prepareCorners(StickerSelectedCorners, st::dateRadius, st::msgServiceSelectBg);
prepareCorners(SelectedOverlaySmallCorners, st::buttonRadius, st::msgSelectOverlay);
prepareCorners(SelectedOverlayLargeCorners, st::msgRadius, st::msgSelectOverlay);
prepareCorners(DateCorners, st::serviceMsgRadius, st::msgDateImgBg);
prepareCorners(DateSelectedCorners, st::serviceMsgRadius, st::msgDateImgBgSelected);
prepareCorners(DateCorners, st::dateRadius, st::msgDateImgBg);
prepareCorners(DateSelectedCorners, st::dateRadius, st::msgDateImgBgSelected);
prepareCorners(InShadowCorners, st::msgRadius, st::msgInShadow);
prepareCorners(InSelectedShadowCorners, st::msgRadius, st::msgInShadowSelected);
prepareCorners(ForwardCorners, st::msgRadius, st::forwardBg);
@ -2768,8 +2768,8 @@ namespace {
uchar bsel = snap(qRound(((1. - alphaSel) * b + addSel) / alphaSel), 0, 0xFF);
_msgServiceSelectBg = style::color(r, g, b, qRound(alphaSel * 0xFF));
prepareCorners(ServiceCorners, st::serviceMsgRadius, _msgServiceBg);
prepareCorners(ServiceSelectedCorners, st::serviceMsgRadius, _msgServiceSelectBg);
prepareCorners(StickerCorners, st::dateRadius, _msgServiceBg);
prepareCorners(StickerSelectedCorners, st::dateRadius, _msgServiceSelectBg);
uchar rScroll = uchar(componentsScroll[0]), gScroll = uchar(componentsScroll[1]), bScroll = uchar(componentsScroll[2]);
_historyScrollBarColor = style::color(rScroll, gScroll, bScroll, qRound(st::historyScroll.barColor->c.alphaF() * 0xFF));

View File

@ -5043,7 +5043,7 @@ void HistorySticker::draw(Painter &p, const QRect &r, TextSelection selection, u
// Make the bottom of the rect at the same level as the bottom of the info rect.
recty -= st::msgDateImgDelta;
App::roundRect(p, rectx, recty, rectw, recth, selected ? App::msgServiceSelectBg() : App::msgServiceBg(), selected ? ServiceSelectedCorners : ServiceCorners);
App::roundRect(p, rectx, recty, rectw, recth, selected ? App::msgServiceSelectBg() : App::msgServiceBg(), selected ? StickerSelectedCorners : StickerCorners);
rectx += st::msgReplyPadding.left();
rectw -= st::msgReplyPadding.left() + st::msgReplyPadding.right();
if (via) {
@ -6561,7 +6561,7 @@ void HistoryMessage::KeyboardStyle::repaint(const HistoryItem *item) const {
}
void HistoryMessage::KeyboardStyle::paintButtonBg(Painter &p, const QRect &rect, bool down, float64 howMuchOver) const {
App::roundRect(p, rect, App::msgServiceBg(), ServiceCorners);
App::roundRect(p, rect, App::msgServiceBg(), StickerCorners);
if (down) {
howMuchOver = 1.;
}
@ -7289,7 +7289,7 @@ void HistoryMessage::drawInfo(Painter &p, int32 right, int32 bottom, int32 width
App::roundRect(p, dateX - st::msgDateImgPadding.x(), dateY - st::msgDateImgPadding.y(), dateW, dateH, selected ? st::msgDateImgBgSelected : st::msgDateImgBg, selected ? DateSelectedCorners : DateCorners);
} else if (type == InfoDisplayOverBackground) {
int32 dateW = infoW + 2 * st::msgDateImgPadding.x(), dateH = st::msgDateFont->height + 2 * st::msgDateImgPadding.y();
App::roundRect(p, dateX - st::msgDateImgPadding.x(), dateY - st::msgDateImgPadding.y(), dateW, dateH, selected ? App::msgServiceSelectBg() : App::msgServiceBg(), selected ? ServiceSelectedCorners : ServiceCorners);
App::roundRect(p, dateX - st::msgDateImgPadding.x(), dateY - st::msgDateImgPadding.y(), dateW, dateH, selected ? App::msgServiceSelectBg() : App::msgServiceBg(), selected ? StickerSelectedCorners : StickerCorners);
}
dateX += HistoryMessage::timeLeft();

View File

@ -45,3 +45,7 @@ membersInnerDropdown: InnerDropdown(defaultInnerDropdown) {
}
historyToDownBadgeFont: semiboldFont;
historyToDownBadgeSize: 22px;
historyServiceMsgRadius: 12px;
historyServiceMsgInvertedRadius: 6px;
historyServiceMsgInvertedShrink: 4px;

View File

@ -22,6 +22,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
#include "history/history_service_layout.h"
#include "data/data_abstract_structure.h"
#include "styles/style_history.h"
#include "mainwidget.h"
#include "lang.h"
@ -58,14 +59,17 @@ void createCircleMasks() {
serviceMessageStyle.createIfNull();
if (!serviceMessageStyle->circle[NormalMask].isNull()) return;
int size = st::serviceMsgRadius * 2;
int size = st::historyServiceMsgRadius * 2;
serviceMessageStyle->circle[NormalMask] = style::createCircleMask(size);
serviceMessageStyle->circle[InvertedMask] = style::createInvertedCircleMask(size);
int sizeInverted = st::historyServiceMsgInvertedRadius * 2;
serviceMessageStyle->circle[InvertedMask] = style::createInvertedCircleMask(sizeInverted);
}
QPixmap circleCorner(int corner) {
if (serviceMessageStyle->corners[corner].isNull()) {
int size = st::serviceMsgRadius * cIntRetinaFactor();
int maskType = corner / MaskMultiplier;
int radius = (maskType == NormalMask ? st::historyServiceMsgRadius : st::historyServiceMsgInvertedRadius);
int size = radius * cIntRetinaFactor();
int xoffset = 0, yoffset = 0;
if (corner & CornerRight) {
@ -74,7 +78,6 @@ QPixmap circleCorner(int corner) {
if (corner & CornerBottom) {
yoffset = size;
}
int maskType = corner / MaskMultiplier;
auto part = QRect(xoffset, yoffset, size, size);
auto result = style::colorizeImage(serviceMessageStyle->circle[maskType], App::msgServiceBg(), part);
result.setDevicePixelRatio(cRetinaFactor());
@ -116,11 +119,22 @@ int paintBubbleSide(Painter &p, int x, int y, int width, SideStyle style, Corner
}
void paintBubblePart(Painter &p, int x, int y, int width, int height, SideStyle topStyle, SideStyle bottomStyle) {
if (topStyle == SideStyle::Inverted || bottomStyle == SideStyle::Inverted) {
width -= st::historyServiceMsgInvertedShrink * 2;
x += st::historyServiceMsgInvertedShrink;
}
if (int skip = paintBubbleSide(p, x, y, width, topStyle, CornerTop)) {
y += skip;
height -= skip;
}
if (int skip = paintBubbleSide(p, x, y + height - st::serviceMsgRadius, width, bottomStyle, CornerBottom)) {
int bottomSize = 0;
if (bottomStyle == SideStyle::Rounded) {
bottomSize = st::historyServiceMsgRadius;
} else if (bottomStyle == SideStyle::Inverted) {
bottomSize = st::historyServiceMsgInvertedRadius;
}
if (int skip = paintBubbleSide(p, x, y + height - bottomSize, width, bottomStyle, CornerBottom)) {
height -= skip;
}
@ -137,7 +151,7 @@ void paintPreparedDate(Painter &p, const QString &dateText, int dateTextWidth, i
left += (w - dateTextWidth - st::msgServicePadding.left() - st::msgServicePadding.right()) / 2;
int height = st::msgServicePadding.top() + st::msgServiceFont->height + st::msgServicePadding.bottom();
App::roundRect(p, left, y + st::msgServiceMargin.top(), dateTextWidth + st::msgServicePadding.left() + st::msgServicePadding.left(), height, App::msgServiceBg(), ServiceCorners);
ServiceMessagePainter::paintBubble(p, left, y + st::msgServiceMargin.top(), dateTextWidth + st::msgServicePadding.left() + st::msgServicePadding.left(), height);
p.setFont(st::msgServiceFont);
p.setPen(st::msgServiceColor);
@ -180,7 +194,7 @@ void ServiceMessagePainter::paint(Painter &p, const HistoryService *message, con
QRect trect(QRect(left, st::msgServiceMargin.top(), width, height).marginsAdded(-st::msgServicePadding));
paintBubble(p, left, width, message->_text, trect);
paintComplexBubble(p, left, width, message->_text, trect);
if (width > message->maxWidth()) {
left += (width - message->maxWidth()) / 2;
@ -205,7 +219,13 @@ void ServiceMessagePainter::paintDate(Painter &p, const QString &dateText, int d
paintPreparedDate(p, dateText, dateTextWidth, y, w);
}
void ServiceMessagePainter::paintBubble(Painter &p, int left, int width, const Text &text, const QRect &textRect) {
void ServiceMessagePainter::paintBubble(Painter &p, int x, int y, int w, int h) {
createCircleMasks();
paintBubblePart(p, x, y, w, h, SideStyle::Rounded, SideStyle::Rounded);
}
void ServiceMessagePainter::paintComplexBubble(Painter &p, int left, int width, const Text &text, const QRect &textRect) {
createCircleMasks();
auto lineWidths = countLineWidths(text, textRect);
@ -258,7 +278,7 @@ QVector<int> ServiceMessagePainter::countLineWidths(const Text &text, const QRec
lineWidths.reserve(linesCount);
text.countLineWidths(textRect.width(), &lineWidths);
int minDelta = 4 * st::serviceMsgRadius;
int minDelta = 2 * (st::historyServiceMsgRadius + st::historyServiceMsgInvertedRadius - st::historyServiceMsgInvertedShrink);
for (int i = 0, count = lineWidths.size(); i < count; ++i) {
int width = qMax(lineWidths.at(i), 0);
if (i > 0) {

View File

@ -40,8 +40,10 @@ public:
static void paintDate(Painter &p, const QDateTime &date, int y, int w);
static void paintDate(Painter &p, const QString &dateText, int dateTextWidth, int y, int w);
static void paintBubble(Painter &p, int x, int y, int w, int h);
private:
static void paintBubble(Painter &p, int left, int width, const Text &text, const QRect &textRect);
static void paintComplexBubble(Painter &p, int left, int width, const Text &text, const QRect &textRect);
static QVector<int> countLineWidths(const Text &text, const QRect &textRect);
};

View File

@ -8525,7 +8525,7 @@ void HistoryWidget::paintEvent(QPaintEvent *e) {
style::font font(st::msgServiceFont);
int32 w = font->width(lang(lng_willbe_history)) + st::msgPadding.left() + st::msgPadding.right(), h = font->height + st::msgServicePadding.top() + st::msgServicePadding.bottom() + 2;
QRect tr((width() - w) / 2, (height() - _field.height() - 2 * st::sendPadding - h) / 2, w, h);
App::roundRect(p, tr, App::msgServiceBg(), ServiceCorners);
HistoryLayout::ServiceMessagePainter::paintBubble(p, tr.x(), tr.y(), tr.width(), tr.height());
p.setPen(st::msgServiceColor->p);
p.setFont(font->f);

View File

@ -33,8 +33,8 @@ enum RoundCorners {
LargeMaskCorners,
WhiteCorners,
ServiceCorners,
ServiceSelectedCorners,
StickerCorners,
StickerSelectedCorners,
SelectedOverlaySmallCorners,
SelectedOverlayLargeCorners,
DateCorners,