diff --git a/Telegram/Resources/animations/show_or_premium_lastseen.tgs b/Telegram/Resources/animations/show_or_premium_lastseen.tgs new file mode 100644 index 0000000000..1048f5806e Binary files /dev/null and b/Telegram/Resources/animations/show_or_premium_lastseen.tgs differ diff --git a/Telegram/Resources/animations/show_or_premium_readtime.tgs b/Telegram/Resources/animations/show_or_premium_readtime.tgs new file mode 100644 index 0000000000..ac3ea3f758 Binary files /dev/null and b/Telegram/Resources/animations/show_or_premium_readtime.tgs differ diff --git a/Telegram/Resources/icons/settings/premium/large_lastseen.png b/Telegram/Resources/icons/settings/premium/large_lastseen.png deleted file mode 100644 index e47bd7935b..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_lastseen.png and /dev/null differ diff --git a/Telegram/Resources/icons/settings/premium/large_lastseen@2x.png b/Telegram/Resources/icons/settings/premium/large_lastseen@2x.png deleted file mode 100644 index 305b6a4919..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_lastseen@2x.png and /dev/null differ diff --git a/Telegram/Resources/icons/settings/premium/large_lastseen@3x.png b/Telegram/Resources/icons/settings/premium/large_lastseen@3x.png deleted file mode 100644 index 0cd1e12ab0..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_lastseen@3x.png and /dev/null differ diff --git a/Telegram/Resources/icons/settings/premium/large_readtime.png b/Telegram/Resources/icons/settings/premium/large_readtime.png deleted file mode 100644 index c06294a82e..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_readtime.png and /dev/null differ diff --git a/Telegram/Resources/icons/settings/premium/large_readtime@2x.png b/Telegram/Resources/icons/settings/premium/large_readtime@2x.png deleted file mode 100644 index f30a355ee8..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_readtime@2x.png and /dev/null differ diff --git a/Telegram/Resources/icons/settings/premium/large_readtime@3x.png b/Telegram/Resources/icons/settings/premium/large_readtime@3x.png deleted file mode 100644 index 1e7d022a30..0000000000 Binary files a/Telegram/Resources/icons/settings/premium/large_readtime@3x.png and /dev/null differ diff --git a/Telegram/Resources/qrc/telegram/animations.qrc b/Telegram/Resources/qrc/telegram/animations.qrc index c02e93eb23..5a52c5f380 100644 --- a/Telegram/Resources/qrc/telegram/animations.qrc +++ b/Telegram/Resources/qrc/telegram/animations.qrc @@ -48,6 +48,8 @@ ../../animations/my_gifts_empty.tgs ../../animations/toast/chats_filter_in.tgs ../../animations/rtmp.tgs + ../../animations/show_or_premium_lastseen.tgs + ../../animations/show_or_premium_readtime.tgs ../../animations/profile/profile_muting.tgs ../../animations/profile/profile_unmuting.tgs diff --git a/Telegram/SourceFiles/ui/boxes/show_or_premium_box.cpp b/Telegram/SourceFiles/ui/boxes/show_or_premium_box.cpp index f99b9ff439..42e325ec02 100644 --- a/Telegram/SourceFiles/ui/boxes/show_or_premium_box.cpp +++ b/Telegram/SourceFiles/ui/boxes/show_or_premium_box.cpp @@ -9,6 +9,8 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "base/object_ptr.h" #include "lang/lang_keys.h" +#include "lottie/lottie_icon.h" +#include "settings/settings_common.h" #include "ui/effects/premium_graphics.h" #include "ui/layers/generic_box.h" #include "ui/text/text_utilities.h" @@ -16,42 +18,18 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "ui/widgets/gradient_round_button.h" #include "ui/widgets/labels.h" #include "ui/painter.h" +#include "ui/rect.h" +#include "ui/vertical_list.h" #include "styles/style_layers.h" #include "styles/style_premium.h" +#include "styles/style_boxes.h" +#include "styles/style_settings.h" namespace Ui { namespace { constexpr auto kShowOrLineOpacity = 0.3; -[[nodiscard]] object_ptr MakeShowOrPremiumIcon( - not_null parent, - not_null icon) { - const auto margin = st::showOrIconMargin; - const auto padding = st::showOrIconPadding; - const auto inner = padding.top() + icon->height() + padding.bottom(); - const auto full = margin.top() + inner + margin.bottom(); - auto result = object_ptr(parent, full); - const auto raw = result.data(); - - raw->resize(st::boxWideWidth, full); - raw->paintRequest( - ) | rpl::start_with_next([=] { - auto p = QPainter(raw); - auto hq = PainterHighQualityEnabler(p); - const auto width = raw->width(); - const auto position = QPoint((width - inner) / 2, margin.top()); - const auto rect = QRect(position, QSize(inner, inner)); - const auto shift = QPoint(padding.left(), padding.top()); - p.setPen(Qt::NoPen); - p.setBrush(st::showOrIconBg); - p.drawEllipse(rect); - icon->paint(p, position + shift, width); - }, raw->lifetime()); - - return result; -} - } // namespace object_ptr MakeShowOrLabel( @@ -97,7 +75,7 @@ void ShowOrPremiumBox( rpl::producer premiumAbout; rpl::producer premiumButton; QString toast; - const style::icon *icon = nullptr; + QString lottie; }; auto skin = (type == ShowOrPremium::LastSeen) ? Skin{ @@ -115,7 +93,7 @@ void ShowOrPremiumBox( Text::RichLangValue), tr::lng_lastseen_premium_button(), tr::lng_lastseen_shown_toast(tr::now), - &st::showOrIconLastSeen, + u"show_or_premium_lastseen"_q, } : Skin{ tr::lng_readtime_show_title(), @@ -132,7 +110,7 @@ void ShowOrPremiumBox( Text::RichLangValue), tr::lng_readtime_premium_button(), tr::lng_readtime_shown_toast(tr::now), - &st::showOrIconReadTime, + u"show_or_premium_readtime"_q, }; box->setStyle(st::showOrBox); @@ -146,7 +124,40 @@ void ShowOrPremiumBox( 0, st::showOrBox.buttonPadding.right(), 0); - box->addRow(MakeShowOrPremiumIcon(box, skin.icon)); + + auto icon = Settings::CreateLottieIcon( + box, + { + .name = skin.lottie, + .sizeOverride = st::normalBoxLottieSize + - Size(st::showOrTitleIconMargin * 2), + }, + { 0, st::showOrTitleIconMargin, 0, st::showOrTitleIconMargin }); + { + const auto iconRow = box->addRow( + std::move(icon.widget), + st::settingsBlockedListIconPadding, + style::al_top); + + const auto circle = Ui::CreateChild( + iconRow->parentWidget()); + circle->lower(); + circle->paintRequest() | rpl::start_with_next([=] { + auto p = QPainter(circle); + auto hq = PainterHighQualityEnabler(p); + const auto size = st::normalBoxLottieSize; + const auto left = (circle->width() - size.width()) / 2; + const auto top = (circle->height() - size.height()) / 2; + p.setPen(Qt::NoPen); + p.setBrush(st::activeButtonBg); + p.drawEllipse(QRect(QPoint(left, top), size)); + }, circle->lifetime()); + + iconRow->geometryValue() | rpl::start_with_next([=](const QRect &g) { + circle->setGeometry(g); + }, circle->lifetime()); + } + Ui::AddSkip(box->verticalLayout()); box->addRow( object_ptr( box, @@ -208,8 +219,9 @@ void ShowOrPremiumBox( outer); }, label->lifetime()); - box->setShowFinishedCallback([=] { + box->setShowFinishedCallback([=, animate = std::move(icon.animate)] { premium->startGlareAnimation(); + animate(anim::repeat::once); }); box->addButton( diff --git a/Telegram/SourceFiles/ui/effects/premium.style b/Telegram/SourceFiles/ui/effects/premium.style index 7a480a51d7..f8e0368a6d 100644 --- a/Telegram/SourceFiles/ui/effects/premium.style +++ b/Telegram/SourceFiles/ui/effects/premium.style @@ -334,11 +334,7 @@ boostReplaceUserpicsRow: UserpicsRow { complex: true; } -showOrIconLastSeen: icon{{ "settings/premium/large_lastseen", windowFgActive }}; -showOrIconReadTime: icon{{ "settings/premium/large_readtime", windowFgActive }}; -showOrIconBg: windowBgActive; -showOrIconPadding: margins(12px, 12px, 12px, 12px); -showOrIconMargin: margins(0px, 28px, 0px, 12px); +showOrTitleIconMargin: 8px; showOrTitlePadding: margins(0px, 0px, 0px, 5px); showOrAboutPadding: margins(0px, 0px, 0px, 16px); showOrShowButton: RoundButton(defaultActiveButton) {