Improved style of buttons in stickers search results.

This commit is contained in:
23rd 2023-07-26 04:23:14 +03:00 committed by John Preston
parent 16820139dd
commit 16e5792f3a
4 changed files with 58 additions and 35 deletions

View file

@ -105,7 +105,6 @@ EmojiPan {
trendingHeaderFg: color; trendingHeaderFg: color;
trendingSubheaderFg: color; trendingSubheaderFg: color;
trendingUnreadFg: color; trendingUnreadFg: color;
trendingInstalled: icon;
overBg: color; overBg: color;
pathBg: color; pathBg: color;
pathFg: color; pathFg: color;
@ -330,7 +329,6 @@ stickersFeaturedUnreadBg: msgFileInBg;
stickersFeaturedUnreadSize: 5px; stickersFeaturedUnreadSize: 5px;
stickersFeaturedUnreadSkip: 5px; stickersFeaturedUnreadSkip: 5px;
stickersFeaturedUnreadTop: 7px; stickersFeaturedUnreadTop: 7px;
stickersFeaturedInstalled: icon {{ "chat/input_save", lightButtonFg }};
stickersMaxHeight: 320px; stickersMaxHeight: 320px;
stickersPadding: margins(19px, 13px, 19px, 13px); stickersPadding: margins(19px, 13px, 19px, 13px);
@ -597,7 +595,6 @@ defaultEmojiPan: EmojiPan {
trendingHeaderFg: stickersTrendingHeaderFg; trendingHeaderFg: stickersTrendingHeaderFg;
trendingSubheaderFg: stickersTrendingSubheaderFg; trendingSubheaderFg: stickersTrendingSubheaderFg;
trendingUnreadFg: stickersFeaturedUnreadBg; trendingUnreadFg: stickersFeaturedUnreadBg;
trendingInstalled: stickersFeaturedInstalled;
overBg: emojiPanHover; overBg: emojiPanHover;
pathBg: windowBgRipple; pathBg: windowBgRipple;
pathFg: windowBgOver; pathFg: windowBgOver;

View file

@ -186,7 +186,7 @@ StickersListWidget::StickersListWidget(
, _mode(descriptor.mode) , _mode(descriptor.mode)
, _show(std::move(descriptor.show)) , _show(std::move(descriptor.show))
, _features(descriptor.features) , _features(descriptor.features)
, _overBg(st::roundRadiusSmall, st().overBg) , _overBg(st::roundRadiusLarge, st().overBg)
, _api(&session().mtp()) , _api(&session().mtp())
, _localSetsManager(std::make_unique<LocalStickersManager>(&session())) , _localSetsManager(std::make_unique<LocalStickersManager>(&session()))
, _section(Section::Stickers) , _section(Section::Stickers)
@ -194,22 +194,27 @@ StickersListWidget::StickersListWidget(
, _updateItemsTimer([=] { updateItems(); }) , _updateItemsTimer([=] { updateItems(); })
, _updateSetsTimer([=] { updateSets(); }) , _updateSetsTimer([=] { updateSets(); })
, _trendingAddBgOver( , _trendingAddBgOver(
ImageRoundRadius::Small, ImageRoundRadius::Large,
st::stickersTrendingAdd.textBgOver) st::stickersTrendingAdd.textBgOver)
, _trendingAddBg(ImageRoundRadius::Small, st::stickersTrendingAdd.textBg) , _trendingAddBg(ImageRoundRadius::Large, st::stickersTrendingAdd.textBg)
, _inactiveButtonBg(
ImageRoundRadius::Large,
st::stickersTrendingInstalled.textBg)
, _groupCategoryAddBgOver( , _groupCategoryAddBgOver(
ImageRoundRadius::Small, ImageRoundRadius::Large,
st::stickerGroupCategoryAdd.textBgOver) st::stickerGroupCategoryAdd.textBgOver)
, _groupCategoryAddBg( , _groupCategoryAddBg(
ImageRoundRadius::Small, ImageRoundRadius::Large,
st::stickerGroupCategoryAdd.textBg) st::stickerGroupCategoryAdd.textBg)
, _pathGradient(std::make_unique<Ui::PathShiftGradient>( , _pathGradient(std::make_unique<Ui::PathShiftGradient>(
st().pathBg, st().pathBg,
st().pathFg, st().pathFg,
[=] { update(); })) [=] { update(); }))
, _megagroupSetAbout(st::columnMinimalWidthThird - st::emojiScroll.width - st().headerLeft) , _megagroupSetAbout(st::columnMinimalWidthThird - st::emojiScroll.width - st().headerLeft)
, _addText(tr::lng_stickers_featured_add(tr::now).toUpper()) , _addText(tr::lng_stickers_featured_add(tr::now))
, _addWidth(st::stickersTrendingAdd.font->width(_addText)) , _addWidth(st::stickersTrendingAdd.font->width(_addText))
, _installedText(tr::lng_stickers_featured_installed(tr::now))
, _installedWidth(st::stickersTrendingInstalled.font->width(_installedText))
, _settings(this, tr::lng_stickers_you_have(tr::now)) , _settings(this, tr::lng_stickers_you_have(tr::now))
, _previewTimer([=] { showPreview(); }) , _previewTimer([=] { showPreview(); })
, _premiumMark(std::make_unique<StickerPremiumMark>(&session())) , _premiumMark(std::make_unique<StickerPremiumMark>(&session()))
@ -896,26 +901,40 @@ void StickersListWidget::paintStickers(Painter &p, QRect clip) {
: loadedCount; : loadedCount;
auto widthForTitle = stickersRight() - (st().headerLeft - st().margin.left()); auto widthForTitle = stickersRight() - (st().headerLeft - st().margin.left());
if (featuredHasAddButton(info.section)) { {
auto add = featuredAddRect(info); const auto installedSet = !featuredHasAddButton(info.section);
auto selected = selectedButton ? (selectedButton->section == info.section) : false; const auto add = featuredAddRect(info, installedSet);
(selected ? _trendingAddBgOver : _trendingAddBg).paint(p, myrtlrect(add)); const auto selected = selectedButton
? (selectedButton->section == info.section)
: false;
(installedSet
? _inactiveButtonBg
: selected
? _trendingAddBgOver
: _trendingAddBg).paint(p, myrtlrect(add));
if (set.ripple) { if (set.ripple) {
set.ripple->paint(p, add.x(), add.y(), width()); set.ripple->paint(p, add.x(), add.y(), width());
if (set.ripple->empty()) { if (set.ripple->empty()) {
set.ripple.reset(); set.ripple.reset();
} }
} }
p.setFont(st::stickersTrendingAdd.font); const auto &text = installedSet ? _installedText : _addText;
p.setPen(selected ? st::stickersTrendingAdd.textFgOver : st::stickersTrendingAdd.textFg); const auto textWidth = installedSet
p.drawTextLeft(add.x() - (st::stickersTrendingAdd.width / 2), add.y() + st::stickersTrendingAdd.textTop, width(), _addText, _addWidth); ? _installedWidth
: _addWidth;
const auto &st = installedSet
? st::stickersTrendingInstalled
: st::stickersTrendingAdd;
p.setFont(st.font);
p.setPen(selected ? st.textFgOver : st.textFg);
p.drawTextLeft(
add.x() - (st.width / 2),
add.y() + st.textTop,
width(),
text,
textWidth);
widthForTitle -= add.width() - (st::stickersTrendingAdd.width / 2); widthForTitle -= add.width() - (st.width / 2);
} else {
auto add = featuredAddRect(info);
int checkx = add.left() + (add.width() - st::stickersFeaturedInstalled.width()) / 2;
int checky = add.top() + (add.height() - st::stickersFeaturedInstalled.height()) / 2;
st().trendingInstalled.paint(p, QPoint(checkx, checky), width());
} }
if (set.flags & SetFlag::Unread) { if (set.flags & SetFlag::Unread) {
widthForTitle -= st::stickersFeaturedUnreadSize + st::stickersFeaturedUnreadSkip; widthForTitle -= st::stickersFeaturedUnreadSize + st::stickersFeaturedUnreadSkip;
@ -1453,14 +1472,17 @@ bool StickersListWidget::featuredHasAddButton(int index) const {
} }
QRect StickersListWidget::featuredAddRect(int index) const { QRect StickersListWidget::featuredAddRect(int index) const {
return featuredAddRect(sectionInfo(index)); return featuredAddRect(sectionInfo(index), false);
} }
QRect StickersListWidget::featuredAddRect(const SectionInfo &info) const { QRect StickersListWidget::featuredAddRect(
auto addw = _addWidth - st::stickersTrendingAdd.width; const SectionInfo &info,
auto addh = st::stickersTrendingAdd.height; bool installedSet) const {
auto addx = stickersRight() - addw; const auto addw = (installedSet ? _installedWidth : _addWidth)
auto addy = info.top + st::stickersTrendingAddTop; - st::stickersTrendingAdd.width;
const auto addh = st::stickersTrendingAdd.height;
const auto addx = stickersRight() - addw;
const auto addy = info.top + st::stickersTrendingAddTop;
return QRect(addx, addy, addw, addh); return QRect(addx, addy, addw, addh);
} }
@ -1536,7 +1558,7 @@ void StickersListWidget::setPressed(OverState newPressed) {
} else if (std::get_if<OverGroupAdd>(&_pressed)) { } else if (std::get_if<OverGroupAdd>(&_pressed)) {
if (!_megagroupSetButtonRipple) { if (!_megagroupSetButtonRipple) {
auto maskSize = _megagroupSetButtonRect.size(); auto maskSize = _megagroupSetButtonRect.size();
auto mask = Ui::RippleAnimation::RoundRectMask(maskSize, st::roundRadiusSmall); auto mask = Ui::RippleAnimation::RoundRectMask(maskSize, st::roundRadiusLarge);
_megagroupSetButtonRipple = std::make_unique<Ui::RippleAnimation>(st::stickerGroupCategoryAdd.ripple, std::move(mask), [this] { _megagroupSetButtonRipple = std::make_unique<Ui::RippleAnimation>(st::stickerGroupCategoryAdd.ripple, std::move(mask), [this] {
rtlupdate(megagroupSetButtonRectFinal()); rtlupdate(megagroupSetButtonRectFinal());
}); });
@ -1564,7 +1586,7 @@ std::unique_ptr<Ui::RippleAnimation> StickersListWidget::createButtonRipple(int
if (shownSets()[section].externalLayout) { if (shownSets()[section].externalLayout) {
auto maskSize = QSize(_addWidth - st::stickersTrendingAdd.width, st::stickersTrendingAdd.height); auto maskSize = QSize(_addWidth - st::stickersTrendingAdd.width, st::stickersTrendingAdd.height);
auto mask = Ui::RippleAnimation::RoundRectMask(maskSize, st::roundRadiusSmall); auto mask = Ui::RippleAnimation::RoundRectMask(maskSize, st::roundRadiusLarge);
return std::make_unique<Ui::RippleAnimation>( return std::make_unique<Ui::RippleAnimation>(
st::stickersTrendingAdd.ripple, st::stickersTrendingAdd.ripple,
std::move(mask), std::move(mask),
@ -1740,6 +1762,7 @@ void StickersListWidget::mouseReleaseEvent(QMouseEvent *e) {
Assert(button->section >= 0 && button->section < sets.size()); Assert(button->section >= 0 && button->section < sets.size());
if (sets[button->section].externalLayout) { if (sets[button->section].externalLayout) {
_localSetsManager->install(sets[button->section].id); _localSetsManager->install(sets[button->section].id);
update();
} else { } else {
removeSet(sets[button->section].id); removeSet(sets[button->section].id);
} }
@ -2354,7 +2377,7 @@ void StickersListWidget::updateSelected() {
if (p.y() >= info.top && p.y() < info.rowsTop) { if (p.y() >= info.top && p.y() < info.rowsTop) {
if (hasRemoveButton(section) && myrtlrect(removeButtonRect(info)).contains(p.x(), p.y())) { if (hasRemoveButton(section) && myrtlrect(removeButtonRect(info)).contains(p.x(), p.y())) {
newSelected = OverButton{ section }; newSelected = OverButton{ section };
} else if (featuredHasAddButton(section) && myrtlrect(featuredAddRect(info)).contains(p.x(), p.y())) { } else if (featuredHasAddButton(section) && myrtlrect(featuredAddRect(info, false)).contains(p.x(), p.y())) {
newSelected = OverButton{ section }; newSelected = OverButton{ section };
} else if (_features.openStickerSets } else if (_features.openStickerSets
&& !(sets[section].flags & SetFlag::Special)) { && !(sets[section].flags & SetFlag::Special)) {
@ -2557,7 +2580,7 @@ void StickersListWidget::showMegagroupSet(ChannelData *megagroup) {
_megagroupSetAbout.setText( _megagroupSetAbout.setText(
st::stickerGroupCategoryAbout, st::stickerGroupCategoryAbout,
tr::lng_group_stickers_description(tr::now)); tr::lng_group_stickers_description(tr::now));
_megagroupSetButtonText = tr::lng_group_stickers_add(tr::now).toUpper(); _megagroupSetButtonText = tr::lng_group_stickers_add(tr::now);
refreshMegagroupSetGeometry(); refreshMegagroupSetGeometry();
} }
_megagroupSetButtonRipple.reset(); _megagroupSetButtonRipple.reset();

View file

@ -302,7 +302,9 @@ private:
[[nodiscard]] int stickersRight() const; [[nodiscard]] int stickersRight() const;
[[nodiscard]] bool featuredHasAddButton(int index) const; [[nodiscard]] bool featuredHasAddButton(int index) const;
[[nodiscard]] QRect featuredAddRect(int index) const; [[nodiscard]] QRect featuredAddRect(int index) const;
[[nodiscard]] QRect featuredAddRect(const SectionInfo &info) const; [[nodiscard]] QRect featuredAddRect(
const SectionInfo &info,
bool installedSet) const;
[[nodiscard]] bool hasRemoveButton(int index) const; [[nodiscard]] bool hasRemoveButton(int index) const;
[[nodiscard]] QRect removeButtonRect(int index) const; [[nodiscard]] QRect removeButtonRect(int index) const;
[[nodiscard]] QRect removeButtonRect(const SectionInfo &info) const; [[nodiscard]] QRect removeButtonRect(const SectionInfo &info) const;
@ -392,7 +394,7 @@ private:
OverState _pressed; OverState _pressed;
QPoint _lastMousePosition; QPoint _lastMousePosition;
Ui::RoundRect _trendingAddBgOver, _trendingAddBg; Ui::RoundRect _trendingAddBgOver, _trendingAddBg, _inactiveButtonBg;
Ui::RoundRect _groupCategoryAddBgOver, _groupCategoryAddBg; Ui::RoundRect _groupCategoryAddBgOver, _groupCategoryAddBg;
const std::unique_ptr<Ui::PathShiftGradient> _pathGradient; const std::unique_ptr<Ui::PathShiftGradient> _pathGradient;
@ -405,6 +407,8 @@ private:
QString _addText; QString _addText;
int _addWidth; int _addWidth;
QString _installedText;
int _installedWidth;
object_ptr<Ui::LinkButton> _settings; object_ptr<Ui::LinkButton> _settings;

View file

@ -571,7 +571,6 @@ storiesEmojiPan: EmojiPan(defaultEmojiPan) {
trendingHeaderFg: storiesComposeWhiteText; trendingHeaderFg: storiesComposeWhiteText;
trendingSubheaderFg: storiesComposeGrayText; trendingSubheaderFg: storiesComposeGrayText;
trendingUnreadFg: storiesComposeBlue; trendingUnreadFg: storiesComposeBlue;
trendingInstalled: icon {{ "chat/input_save", storiesComposeBlue }};
overBg: storiesComposeBgOver; overBg: storiesComposeBgOver;
pathBg: storiesComposeBgRipple; pathBg: storiesComposeBgRipple;
pathFg: storiesComposeBgOver; pathFg: storiesComposeBgOver;