From 60bf6b1f70e18063191a41e24cd733006f55b393 Mon Sep 17 00:00:00 2001 From: John Preston Date: Mon, 8 Sep 2025 18:02:10 +0400 Subject: [PATCH] Improve gifts display. --- Telegram/Resources/langs/lang.strings | 2 +- Telegram/SourceFiles/boxes/star_gift_box.cpp | 4 +-- .../SourceFiles/data/data_media_types.cpp | 4 +-- .../view/media/history_view_premium_gift.cpp | 8 ++--- .../view/media/history_view_service_box.cpp | 6 ++-- .../media/history_view_theme_document.cpp | 4 +-- .../view/media/history_view_unique_gift.cpp | 36 ++++++++++--------- .../peer_gifts/info_peer_gifts_common.cpp | 20 +++++++---- .../info/peer_gifts/info_peer_gifts_common.h | 4 ++- Telegram/SourceFiles/ui/chat/chat.style | 30 +++++++++------- Telegram/SourceFiles/ui/effects/credits.style | 7 +++- Telegram/SourceFiles/ui/effects/premium.style | 3 ++ 12 files changed, 75 insertions(+), 53 deletions(-) diff --git a/Telegram/Resources/langs/lang.strings b/Telegram/Resources/langs/lang.strings index 65492b1c0a..e41a6023a4 100644 --- a/Telegram/Resources/langs/lang.strings +++ b/Telegram/Resources/langs/lang.strings @@ -3662,7 +3662,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL "lng_gift_self_about" = "Buy yourself a gift to display on your page or reserve for later.\n\nLimited-edition gifts upgraded to collectibles can be gifted to others later."; "lng_gift_channel_title" = "Send a Gift"; "lng_gift_channel_about" = "Select a gift to show appreciation for {name}."; -"lng_gift_released_by" = "Released by {name}"; +"lng_gift_released_by" = "released by {name}"; "lng_gift_unique_owner" = "Owner"; "lng_gift_unique_address_copied" = "Address copied to clipboard."; "lng_gift_unique_status" = "Status"; diff --git a/Telegram/SourceFiles/boxes/star_gift_box.cpp b/Telegram/SourceFiles/boxes/star_gift_box.cpp index 0a89d2b02b..e1d1efbba4 100644 --- a/Telegram/SourceFiles/boxes/star_gift_box.cpp +++ b/Telegram/SourceFiles/boxes/star_gift_box.cpp @@ -636,7 +636,7 @@ auto GenerateGiftMedia( Ui::Text::Link('@' + by->username()), Ui::Text::WithEntities), st::giftBoxReleasedByMargin, - st::defaultTextStyle)); + st::uniqueGiftReleasedBy.style)); } } @@ -4052,7 +4052,7 @@ void AddUniqueGiftCover( QColor bg; }; const auto released = cover->lifetime().make_state(); - released->st = st::uniqueGiftSubtitle; + released->st = st::uniqueGiftReleasedBy; released->st.palette.linkFg = released->white.color(); if (resalePrice) { diff --git a/Telegram/SourceFiles/data/data_media_types.cpp b/Telegram/SourceFiles/data/data_media_types.cpp index 6f1001b20c..7c1b3e44bb 100644 --- a/Telegram/SourceFiles/data/data_media_types.cpp +++ b/Telegram/SourceFiles/data/data_media_types.cpp @@ -2594,9 +2594,7 @@ std::unique_ptr MediaGiftBox::createView( message, HistoryView::GenerateUniqueGiftMedia(message, replacing, unique), HistoryView::MediaGenericDescriptor{ - .maxWidth = (_data.stargiftReleasedBy - ? st::msgServiceStarGiftByWidth - : st::msgServiceGiftBoxSize.width()), + .maxWidth = st::msgServiceGiftBoxSize.width(), .paintBg = HistoryView::UniqueGiftBg(message, unique), .service = true, }); diff --git a/Telegram/SourceFiles/history/view/media/history_view_premium_gift.cpp b/Telegram/SourceFiles/history/view/media/history_view_premium_gift.cpp index 68ac6ee543..d433f11e3b 100644 --- a/Telegram/SourceFiles/history/view/media/history_view_premium_gift.cpp +++ b/Telegram/SourceFiles/history/view/media/history_view_premium_gift.cpp @@ -55,9 +55,7 @@ int PremiumGift::top() { } int PremiumGift::width() { - return _data.stargiftReleasedBy - ? st::msgServiceStarGiftByWidth - : st::msgServiceStarGiftBoxWidth; + return st::msgServiceStarGiftBoxWidth; } QSize PremiumGift::size() { @@ -388,7 +386,9 @@ QImage PremiumGift::cornerTag(const PaintContext &context) { } if (_badgeCache.isNull() || _badgeKey != badge) { _badgeKey = badge; - _badgeCache = ValidateRotatedBadge(badge, 0); + _badgeCache = ValidateRotatedBadge( + badge, + st::msgServiceGiftBoxBadgePadding); } return _badgeCache; } diff --git a/Telegram/SourceFiles/history/view/media/history_view_service_box.cpp b/Telegram/SourceFiles/history/view/media/history_view_service_box.cpp index 4e5e11d65f..5b5864b2a6 100644 --- a/Telegram/SourceFiles/history/view/media/history_view_service_box.cpp +++ b/Telegram/SourceFiles/history/view/media/history_view_service_box.cpp @@ -53,7 +53,7 @@ ServiceBox::ServiceBox( .repaint = [parent] { parent->customEmojiRepaint(); }, })) , _author( - st::defaultTextStyle, + st::uniqueGiftReleasedBy.style, _content->author(), kMarkupTextOptions, _maxWidth) @@ -88,7 +88,7 @@ ServiceBox::ServiceBox( + (_author.isEmpty() ? 0 : (st::giftBoxReleasedByMargin.top() - + st::defaultTextStyle.font->height + + st::uniqueGiftReleasedBy.style.font->height + st::giftBoxReleasedByMargin.bottom() + st::msgServiceGiftBoxTitlePadding.bottom())) + _subtitle.countHeight(_maxWidth) @@ -185,7 +185,7 @@ void ServiceBox::draw(Painter &p, const PaintContext &context) const { + st::giftBoxReleasedByMargin.right(); const auto left = st::msgPadding.left() + (_maxWidth - use) / 2; const auto height = st::giftBoxReleasedByMargin.top() - + st::defaultTextStyle.font->height + + st::uniqueGiftReleasedBy.style.font->height + st::giftBoxReleasedByMargin.bottom(); const auto radius = height / 2.; p.drawRoundedRect(left, top, use, height, radius, radius); diff --git a/Telegram/SourceFiles/history/view/media/history_view_theme_document.cpp b/Telegram/SourceFiles/history/view/media/history_view_theme_document.cpp index 84add9cfb5..498274e963 100644 --- a/Telegram/SourceFiles/history/view/media/history_view_theme_document.cpp +++ b/Telegram/SourceFiles/history/view/media/history_view_theme_document.cpp @@ -623,9 +623,7 @@ int GiftThemeBox::top() { } int GiftThemeBox::width() { - return _data.stargiftReleasedBy - ? st::msgServiceStarGiftByWidth - : st::msgServiceStarGiftBoxWidth; + return st::msgServiceStarGiftBoxWidth; } QSize GiftThemeBox::size() { diff --git a/Telegram/SourceFiles/history/view/media/history_view_unique_gift.cpp b/Telegram/SourceFiles/history/view/media/history_view_unique_gift.cpp index 350b7846c5..3fc36c36ee 100644 --- a/Telegram/SourceFiles/history/view/media/history_view_unique_gift.cpp +++ b/Telegram/SourceFiles/history/view/media/history_view_unique_gift.cpp @@ -119,7 +119,7 @@ TextBubblePart::TextBubblePart( : MediaGenericTextPart( std::move(text), margins, - st::defaultTextStyle, + st::uniqueGiftReleasedBy.style, {}, {}, style::al_top) @@ -132,6 +132,7 @@ void TextBubblePart::draw( not_null owner, const PaintContext &context, int outerWidth) const { + auto hq = PainterHighQualityEnabler(p); p.setPen(Qt::NoPen); p.setOpacity(0.5); p.setBrush(_backdrop.patternColor); @@ -369,7 +370,7 @@ auto GenerateUniqueGiftMedia( st::chatUniqueTitlePadding); pushText( Ui::Text::Bold(Data::UniqueGiftName(*gift)), - st::defaultTextStyle, + st::chatUniqueTextStyle, gift->backdrop.textColor, st::chatUniqueTextPadding); @@ -396,9 +397,12 @@ auto GenerateUniqueGiftMedia( { tr::lng_gift_unique_backdrop(tr::now), name(gift->backdrop) }, { tr::lng_gift_unique_symbol(tr::now), name(gift->pattern) }, }; + const auto tableAddedMargins = gift->releasedBy + ? QMargins(0, st::chatUniqueAuthorSkip, 0, 0) + : QMargins(); push(std::make_unique( std::move(attributes), - st::chatUniqueTextPadding, + st::chatUniqueTextPadding + tableAddedMargins, [c = gift->backdrop.textColor](const auto&) { return c; }, [](const auto&) { return QColor(255, 255, 255); })); @@ -440,13 +444,15 @@ auto UniqueGiftBg( auto hq = PainterHighQualityEnabler(p); p.setPen(Qt::NoPen); const auto webpreview = (media.get() != view->media()); + const auto sub = webpreview ? 0 : (st::chatUniqueGiftBorder / 2); const auto thickness = webpreview ? 0 : st::chatUniqueGiftBorder * 2; + const auto removed = thickness + sub; const auto radius = webpreview ? st::roundRadiusLarge - : (st::msgServiceGiftBoxRadius - thickness); + : (st::msgServiceGiftBoxRadius - thickness + sub); const auto full = QRect(0, 0, media->width(), media->height()); const auto inner = full.marginsRemoved( - { thickness, thickness, thickness, thickness }); + { removed, removed, removed, removed }); if (!webpreview) { auto pen = context.st->msgServiceBg()->p; pen.setWidthF(thickness); @@ -478,12 +484,10 @@ auto UniqueGiftBg( outer); p.setClipping(false); - const auto add = webpreview ? 0 : style::ConvertScale(2); - p.setClipRect( - inner.x() - add, - inner.y() - add, - inner.width() + 2 * add, - inner.height() + 2 * add); + const auto padding = webpreview + ? QMargins() + : st::chatUniqueGiftBadgePadding; + p.setClipRect(inner.marginsAdded(padding)); auto badge = Info::PeerGifts::GiftBadge{ .text = tr::lng_gift_collectible_tag(tr::now), .bg1 = gift->backdrop.edgeColor, @@ -492,13 +496,13 @@ auto UniqueGiftBg( }; if (state->badgeCache.isNull() || state->badgeKey != badge) { state->badgeKey = badge; - state->badgeCache = ValidateRotatedBadge(badge, add); + state->badgeCache = ValidateRotatedBadge(badge, padding); } const auto badgeRatio = state->badgeCache.devicePixelRatio(); const auto badgeWidth = state->badgeCache.width() / badgeRatio; p.drawImage( - inner.x() + inner.width() + add - badgeWidth, - inner.y() - add, + inner.x() + inner.width() - badgeWidth, + inner.y(), state->badgeCache); p.setClipping(false); }; @@ -569,9 +573,9 @@ AttributeTable::AttributeTable( for (const auto &entry : entries) { _parts.emplace_back(); auto &part = _parts.back(); - part.label.setText(st::defaultTextStyle, entry.label); + part.label.setText(st::chatUniqueTextStyle, entry.label); part.value.setMarkedText( - st::defaultTextStyle, + st::chatUniqueTextStyle, entry.value, kMarkupTextOptions, context); diff --git a/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.cpp b/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.cpp index 940f1c2671..06e8198f1c 100644 --- a/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.cpp +++ b/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.cpp @@ -34,6 +34,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "ui/effects/premium_graphics.h" #include "ui/painter.h" #include "window/window_session_controller.h" +#include "styles/style_chat.h" #include "styles/style_credits.h" #include "styles/style_layers.h" #include "styles/style_overview.h" @@ -937,7 +938,8 @@ QImage Delegate::cachedBadge(const GiftBadge &badge) { auto &image = _badges[badge]; if (image.isNull()) { const auto &extend = buttonExtend(); - image = ValidateRotatedBadge(badge, extend.top()); + const auto padding = QMargins(extend.top(), 0, extend.top(), 0); + image = ValidateRotatedBadge(badge, padding); } return image; } @@ -979,17 +981,19 @@ rpl::producer> GiftStickerValue( }); } -QImage ValidateRotatedBadge(const GiftBadge &badge, int added) { +QImage ValidateRotatedBadge(const GiftBadge &badge, QMargins padding) { const auto &font = badge.small ? st::giftBoxGiftBadgeFont - : st::semiboldFont; - const auto twidth = font->width(badge.text) + 2 * added; + : st::msgServiceGiftBoxBadgeFont; + const auto twidth = font->width(badge.text) + + padding.left() + + padding.right(); const auto skip = int(std::ceil(twidth / M_SQRT2)); const auto ratio = style::DevicePixelRatio(); const auto multiplier = ratio * 3; const auto size = (twidth + font->height * 2); - const auto height = font->height + st::lineWidth; - const auto textpos = QPoint(size - skip, added); + const auto height = padding.top() + font->height + padding.bottom(); + const auto textpos = QPoint(size - skip, padding.top()); auto image = QImage( QSize(size, size) * multiplier, QImage::Format_ARGB32_Premultiplied); @@ -1002,7 +1006,9 @@ QImage ValidateRotatedBadge(const GiftBadge &badge, int added) { p.rotate(45.); p.setFont(font); p.setPen(badge.fg); - p.drawText(QPoint(added, font->ascent), badge.text); + p.drawText( + QPoint(padding.left(), padding.top() + font->ascent), + badge.text); } auto scaled = image.scaled( diff --git a/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.h b/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.h index 5f02908e7a..6ced2bf1c7 100644 --- a/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.h +++ b/Telegram/SourceFiles/info/peer_gifts/info_peer_gifts_common.h @@ -266,7 +266,9 @@ private: not_null session, const GiftDescriptor &descriptor); -[[nodiscard]] QImage ValidateRotatedBadge(const GiftBadge &badge, int added); +[[nodiscard]] QImage ValidateRotatedBadge( + const GiftBadge &badge, + QMargins padding); void SelectGiftToUnpin( std::shared_ptr show, diff --git a/Telegram/SourceFiles/ui/chat/chat.style b/Telegram/SourceFiles/ui/chat/chat.style index c6e969af25..c630781ba2 100644 --- a/Telegram/SourceFiles/ui/chat/chat.style +++ b/Telegram/SourceFiles/ui/chat/chat.style @@ -938,14 +938,15 @@ msgServiceGiftPreview: 172px; msgServiceGiftBoxSize: size(236px, 231px); // Plus msgServiceGiftBoxTopSkip. msgServiceGiftBoxRadius: 20px; msgServiceGiftBoxTopSkip: 4px; -msgServiceGiftBoxButtonHeight: 32px; -msgServiceGiftBoxButtonPadding: margins(2px, 0px, 2px, 0px); -msgServiceGiftBoxButtonMargins: margins(0px, 13px, 0px, 17px); -msgServiceGiftBoxTitlePadding: margins(0px, 20px, 0px, 6px); +msgServiceGiftBoxButtonHeight: 30px; +msgServiceGiftBoxButtonPadding: margins(1px, 0px, 1px, 0px); +msgServiceGiftBoxButtonMargins: margins(0px, 10px, 0px, 20px); +msgServiceGiftBoxTitlePadding: margins(0px, 24px, 0px, 7px); +msgServiceGiftBoxBadgeFont: font(11px semibold); +msgServiceGiftBoxBadgePadding: margins(3px, 2px, 3px, 2px); msgServiceGiftBoxStickerTop: -19px; msgServiceGiftBoxStickerSize: 140px; msgServiceStarGiftBoxWidth: 224px; -msgServiceStarGiftByWidth: 272px; msgServiceStarGiftStickerTop: 24px; msgServiceStarGiftStickerSize: 100px; msgServiceGiftThemeStickerSize: 64px; @@ -1125,7 +1126,7 @@ chatIntroWidth: 224px; chatIntroTitleMargin: margins(11px, 16px, 11px, 4px); chatIntroMargin: margins(11px, 0px, 11px, 0px); chatIntroStickerPadding: margins(10px, 8px, 10px, 16px); -chatGiftPreviewWidth: 264px; +chatGiftPreviewWidth: 224px; liveLocationLongInIcon: icon {{ "chat/live_location_long", msgInServiceFg }}; liveLocationLongInIconSelected: icon {{ "chat/live_location_long", msgInServiceFgSelected }}; @@ -1270,17 +1271,22 @@ botDownloadCancel: IconButton { ripple: defaultRippleAnimationBgOver; } chatUniqueGiftBorder: 4px; +chatUniqueGiftBadgePadding: margins(12px, 0px, 12px, 2px); -chatUniqueStickerPadding: margins(10px, 30px, 10px, 9px); +chatUniqueStickerPadding: margins(10px, 40px, 10px, 9px); chatUniquePreviewPadding: margins(10px, 30px, 10px, 32px); chatUniqueTitle: TextStyle(defaultTextStyle) { - font: font(16px semibold); + font: font(15px semibold); } -chatUniqueTitlePadding: margins(12px, 12px, 12px, 2px); -chatUniqueTextPadding: margins(12px, 2px, 12px, 8px); +chatUniqueTitlePadding: margins(12px, 8px, 12px, 0px); +chatUniqueTextPadding: margins(12px, 2px, 12px, 7px); +chatUniqueTextStyle: TextStyle(defaultTextStyle) { + font: font(12px); +} +chatUniqueAuthorSkip: 6px; chatUniqueTableSkip: 9px; -chatUniqueRowSkip: 4px; -chatUniqueButtonPadding: margins(12px, 4px, 12px, 16px); +chatUniqueRowSkip: 2px; +chatUniqueButtonPadding: margins(12px, 5px, 12px, 26px); markupWebview: icon {{ "chat/markup_webview", windowFg }}; diff --git a/Telegram/SourceFiles/ui/effects/credits.style b/Telegram/SourceFiles/ui/effects/credits.style index ad72d685cc..4e7d898b47 100644 --- a/Telegram/SourceFiles/ui/effects/credits.style +++ b/Telegram/SourceFiles/ui/effects/credits.style @@ -200,7 +200,7 @@ giftBoxButtonBottomByStars: 18px; giftBoxButtonPadding: margins(8px, 4px, 8px, 4px); giftBoxPreviewStickerPadding: margins(10px, 12px, 10px, 16px); giftBoxPreviewTitlePadding: margins(12px, 4px, 12px, 4px); -giftBoxReleasedByMargin: margins(12px, 2px, 12px, 2px); +giftBoxReleasedByMargin: margins(6px, 1px, 6px, 2px); giftBoxPreviewTextPadding: margins(12px, 4px, 12px, 4px); giftBoxButtonMargin: margins(12px, 8px, 12px, 12px); giftBoxStickerTop: 0px; @@ -276,6 +276,11 @@ uniqueGiftSubtitle: FlatLabel(defaultFlatLabel) { minWidth: 256px; align: align(top); } +uniqueGiftReleasedBy: FlatLabel(uniqueGiftSubtitle) { + style: TextStyle(defaultTextStyle) { + font: font(10px); + } +} uniqueGiftSubtitleTop: 170px; uniqueGiftUserpicTop: 48px; uniqueGiftUserpicSize: 80px; diff --git a/Telegram/SourceFiles/ui/effects/premium.style b/Telegram/SourceFiles/ui/effects/premium.style index ee65962849..719d59b768 100644 --- a/Telegram/SourceFiles/ui/effects/premium.style +++ b/Telegram/SourceFiles/ui/effects/premium.style @@ -120,6 +120,9 @@ premiumPreviewAbout: FlatLabel(defaultFlatLabel) { minWidth: 240px; textFg: membersAboutLimitFg; align: align(top); + style: TextStyle(defaultTextStyle) { + font: font(12px); + } } premiumPreviewAboutPadding: margins(18px, 8px, 18px, 8px); premiumPreviewButtonLabel: FlatLabel(defaultFlatLabel) {