From 09094affed055087a72fb383034a6ce35b4f8484 Mon Sep 17 00:00:00 2001 From: John Preston Date: Thu, 21 Sep 2023 08:59:08 +0400 Subject: [PATCH] Improve boosted channel replacement design. --- .../Resources/icons/stories/boost_mini.png | Bin 0 -> 366 bytes .../Resources/icons/stories/boost_mini@2x.png | Bin 0 -> 589 bytes .../Resources/icons/stories/boost_mini@3x.png | Bin 0 -> 863 bytes .../ui/controls/userpic_button.cpp | 55 ++++++++++++++++++ .../SourceFiles/ui/controls/userpic_button.h | 5 ++ Telegram/SourceFiles/ui/effects/premium.style | 13 +++++ .../window/window_session_controller.cpp | 27 ++++++--- 7 files changed, 91 insertions(+), 9 deletions(-) create mode 100644 Telegram/Resources/icons/stories/boost_mini.png create mode 100644 Telegram/Resources/icons/stories/boost_mini@2x.png create mode 100644 Telegram/Resources/icons/stories/boost_mini@3x.png diff --git a/Telegram/Resources/icons/stories/boost_mini.png b/Telegram/Resources/icons/stories/boost_mini.png new file mode 100644 index 0000000000000000000000000000000000000000..90a24d8f10410ed262c46896bcf323543a904cf2 GIT binary patch literal 366 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61SBU+%rFB|jKx9jP7LeL$-D$|Tv8)E(|mmy zw18|52FCVG1{RPKAeI7R1_tH@j10^`nh_+nfC(-uuz(rC1}QWNE&K$eZg{#lhG>W; zCoE9n;NlVz5>mS6ps&B)zW(2d6DI_gI);aTzr5T(et%tRN{Y%F$C#Ku2bZt`1MmN^laMWnaIqwUyQ7!^z3&8Jk|*X=`KaxGC`I{r&y& zb~QVSpYv_<56B4!47|A^@$lN{?Fwp!hK3(Mew;dO8q?RsvwP3zYiKmw4vvoQ)@hw< zn|)2Eqiw2ocv5(yTGg8yh6~y@r=Kq>EL`ZB_?*f1*Q2A{NslE~yaPI6+O%mmcn^!P hvUN8%GcU9Fsl-qym-VhI-0(HXub!@cF6*2UngBHPe4GFP literal 0 HcmV?d00001 diff --git a/Telegram/Resources/icons/stories/boost_mini@2x.png b/Telegram/Resources/icons/stories/boost_mini@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..fd746a03ad095a0a6ae381461910e16e20893195 GIT binary patch literal 589 zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE1SJ1Ryj={W7>k44ofy`glX(f`xTHpSruq6Z zXaU(A42G$TlC0TWzSVF5FO4N|zKE$K5**>+DC#}E(R zx6}5oI%FVnEH~7JePgioPxd269bc&EITZ>n-Pf>qa-W^k!O$b(0`A|NN`#L%ZV4#Z zbh)%daAjA(k?I9^f+l@&%AE7=Y(UYzIe+%4_)d0Hs^5O(@kf5YxM@#+|Gk%EX8$N~ zWr)t{s{Qxhmd)PRsKBxOGUtl`ucbn%%_&AZ@8-$w%Dp`$p82pr_t8TO4_`L%J#{!- zeYQ;#QZIysk2^ zI=yN8ZQg}HS~sv3?VK~8@$vP5_1Eu)o=Y)Wd{JYn*Ta(q2_BQS#I66hEa6n%cI9&m zuD@nw7To+$r087wkz}Kp0-u??H-vFWIr&~rkY`U5wB8b>d*nfdO_7YdkDH5FXJ_Kh zm~XGHzZPA0=JeA?qRv;Jf8J@`eEqfSf317(zpp!3V8LS=vB$Wkr2qI~!x?AODx4yg zM(9|5Ih!`wL*>w;5C7)+vGY9eZ+c$2XKGW>+A!Y30}6RMn=|q}0sE$Mpj?2spMnaOtvc z+_1qYL%pNJ)!|CUiQWA7qs^>$zqa~a=K0WUXYsRn)qLj0n;+l1dv{(mdtCy%jhz3^ z7&EC}`$MxYzr2&TJw86Z)rs-&1d-;$PL(w^Iooe*P30;&Am+VHBKSeFiIijhIe!Zo zG3TkC&Po$aW}mH3`}e2RLdNH0(t{02C-M}+R$ooxxSXXT#Mw3bXp-Y>O|}Z-KTxjf>&P+(wZvr^JR&bqXl23#~^#6JC^9N%gkHIxNvGtFO10;5jijq3dBti|vWLS(#yn zOd213t+EyCUTC4aDQfMs)2fwR=Q={PT-_>;?u_YMDKAragZ=;8Qt4hd%T=3}O!ZQY z(^WjNLCS14Z@18NO}o`y1)t0tW{0o8{&>-;Da^-(-u~`eRdQ8g+b{h~i?6@#KB_dC z*@&-w+S#<-Ufjkvv$jrZ&3t_Ry#N0D{h9^3y!W1OQ9F@fHFw`Oow_=;$%@&F3)hAn zUf*|+#r6tIBTu`t#ZALgkAjaqHdOTIe9*?fU*e;8vO%iR&AR=|e^~IB@1A@5>7f-T zyOYdjXWnIy=s#XL^_VhyvtyKVg}lTEo0{a*&5>6GYSJcnt>2wct9>f{LWYS(o7&`) zN4urvk8;OMP?wHcf8F2TU) CreateUploadSubButton( return upload; } +object_ptr CreateBoostReplaceUserpics( + not_null parent, + not_null from, + not_null to) { + const auto full = st::boostReplaceUserpic.size.height() + + st::boostReplaceIconAdd.y() + + st::lineWidth; + auto result = object_ptr(parent, full); + const auto raw = result.data(); + const auto &st = st::boostReplaceUserpic; + const auto left = CreateChild(raw, from, st); + const auto right = CreateChild(raw, to, st); + const auto overlay = CreateChild(raw); + raw->widthValue( + ) | rpl::start_with_next([=](int width) { + const auto skip = st::boostReplaceUserpicsSkip; + const auto total = left->width() + skip + right->width(); + left->moveToLeft((width - total) / 2, 0); + right->moveToLeft(left->x() + left->width() + skip, 0); + overlay->setGeometry(QRect(0, 0, width, raw->height())); + }, raw->lifetime()); + overlay->paintRequest( + ) | rpl::start_with_next([=] { + const auto outerw = overlay->width(); + const auto add = st::boostReplaceIconAdd; + const auto skip = st::boostReplaceIconSkip; + const auto w = st::boostReplaceIcon.width() + 2 * skip; + const auto h = st::boostReplaceIcon.height() + 2 * skip; + const auto x = left->x() + left->width() - w + add.x(); + const auto y = left->y() + left->height() - h + add.y(); + const auto stroke = st::boostReplaceIconOutline; + const auto half = stroke / 2.; + auto p = QPainter(overlay); + auto hq = PainterHighQualityEnabler(p); + auto pen = st::windowBg->p; + pen.setWidthF(stroke); + p.setPen(pen); + auto brush = QLinearGradient(QPointF(x + w, y + h), QPointF(x, y)); + brush.setStops(Premium::ButtonGradientStops()); + p.setBrush(brush); + p.drawEllipse(x - half, y - half, w + stroke, h + stroke); + st::boostReplaceIcon.paint(p, x + skip, y + skip, outerw); + + const auto size = st::boostReplaceArrow.size(); + st::boostReplaceArrow.paint( + p, + (outerw - size.width()) / 2, + (left->height() - size.height()) / 2, + outerw); + }, overlay->lifetime()); + return result; +} + } // namespace Ui diff --git a/Telegram/SourceFiles/ui/controls/userpic_button.h b/Telegram/SourceFiles/ui/controls/userpic_button.h index 8d2eb2adf..db3cdd3fd 100644 --- a/Telegram/SourceFiles/ui/controls/userpic_button.h +++ b/Telegram/SourceFiles/ui/controls/userpic_button.h @@ -204,4 +204,9 @@ private: not_null contact, not_null controller); +[[nodiscard]] object_ptr CreateBoostReplaceUserpics( + not_null parent, + not_null from, + not_null to); + } // namespace Ui diff --git a/Telegram/SourceFiles/ui/effects/premium.style b/Telegram/SourceFiles/ui/effects/premium.style index d0eb5cdc5..39bf21ed4 100644 --- a/Telegram/SourceFiles/ui/effects/premium.style +++ b/Telegram/SourceFiles/ui/effects/premium.style @@ -6,6 +6,7 @@ For license and copyright information please follow this link: https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL */ using "ui/basic.style"; +using "boxes/boxes.style"; using "ui/widgets/widgets.style"; using "ui/layers/layers.style"; @@ -230,3 +231,15 @@ boostBox: Box(premiumPreviewDoubledLimitsBox) { font: font(13px semibold); } } + +boostReplaceUserpicsPadding: margins(0px, 18px, 0px, 20px); +boostReplaceUserpicsSkip: 42px; +boostReplaceUserpic: UserpicButton(defaultUserpicButton) { + size: size(60px, 60px); + photoSize: 60px; +} +boostReplaceIcon: icon{{ "stories/boost_mini", windowBg }}; +boostReplaceIconSkip: 3px; +boostReplaceIconOutline: 2px; +boostReplaceIconAdd: point(4px, 2px); +boostReplaceArrow: icon{{ "mediaview/next", windowSubTextFg }}; diff --git a/Telegram/SourceFiles/window/window_session_controller.cpp b/Telegram/SourceFiles/window/window_session_controller.cpp index 7f2a4b6f0..4b69e4f2e 100644 --- a/Telegram/SourceFiles/window/window_session_controller.cpp +++ b/Telegram/SourceFiles/window/window_session_controller.cpp @@ -51,6 +51,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "core/core_settings.h" #include "core/click_handler_types.h" #include "base/unixtime.h" +#include "ui/controls/userpic_button.h" #include "ui/layers/generic_box.h" #include "ui/text/text_utilities.h" #include "ui/text/format_values.h" // Ui::FormatPhone. @@ -86,6 +87,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "styles/style_window.h" #include "styles/style_dialogs.h" #include "styles/style_layers.h" // st::boxLabel +#include "styles/style_premium.h" namespace Window { namespace { @@ -728,15 +730,22 @@ void SessionNavigation::replaceBoostConfirm( applyBoostChecked(channel, done); close(); }; - const auto box = uiShow()->show(Ui::MakeConfirmBox({ - .text = tr::lng_boost_now_instead( - lt_channel, - rpl::single(Ui::Text::Bold(from->name())), - lt_other, - rpl::single(Ui::Text::Bold(channel->name())), - Ui::Text::WithEntities), - .confirmed = confirmed, - .confirmText = tr::lng_boost_now_replace(), + const auto box = uiShow()->show(Box([=](not_null box) { + Ui::ConfirmBox(box, { + .text = tr::lng_boost_now_instead( + lt_channel, + rpl::single(Ui::Text::Bold(from->name())), + lt_other, + rpl::single(Ui::Text::Bold(channel->name())), + Ui::Text::WithEntities), + .confirmed = confirmed, + .confirmText = tr::lng_boost_now_replace(), + .labelPadding = st::boxRowPadding, + }); + box->verticalLayout()->insert( + 0, + Ui::CreateBoostReplaceUserpics(box, from, channel), + st::boxRowPadding + st::boostReplaceUserpicsPadding); })); box->boxClosing() | rpl::filter([=] { return !*forwarded;