diff --git a/Telegram/SourceFiles/chat_helpers/chat_helpers.style b/Telegram/SourceFiles/chat_helpers/chat_helpers.style index d00d999300..ed0949881d 100644 --- a/Telegram/SourceFiles/chat_helpers/chat_helpers.style +++ b/Telegram/SourceFiles/chat_helpers/chat_helpers.style @@ -73,7 +73,7 @@ stickersTrendingSubheaderFg: windowSubTextFg; stickersTrendingSubheaderTop: 31px; emojiPanButtonRight: 7px; -emojiPanButtonTop: 0px; +emojiPanButtonTop: 8px; emojiPanButton: RoundButton(defaultActiveButton) { width: -24px; height: 23px; @@ -259,11 +259,11 @@ defaultEmojiPan: EmojiPan { padding: margins(7px, 0px, 4px, 7px); desiredSize: 37px; verticalSizeSub: 1px; - header: 25px; + header: 33px; headerLeft: 14px; headerLockLeft: 7px; headerLockedLeft: 26px; - headerTop: 2px; + headerTop: 10px; footer: 36px; iconSkip: 3px; iconWidth: 30px; @@ -287,7 +287,7 @@ inlineResultsMaxHeight: 640px; emojiPanHeaderFont: semiboldFont; emojiPanRemoveSkip: 10px; -emojiPanRemoveTop: 2px; +emojiPanRemoveTop: 10px; emojiColorsPadding: 5px; emojiColorsSep: 1px; @@ -410,15 +410,17 @@ reactPanelEmojiPan: EmojiPan(statusEmojiPan) { verticalSizeSub: 0px; overBg: transparent; } -reactPanelScroll: ScrollArea(defaultSolidScroll) { +emojiScroll: ScrollArea(defaultSolidScroll) { deltat: 3px; deltab: 3px; - round: 1px; + round: -1px; width: 7px; deltax: 2px; hiding: 0; } -emojiScroll: reactPanelScroll; +reactPanelScroll: ScrollArea(emojiScroll) { + deltab: 7px; +} emojiSuggestionsFadeLeft: icon {{ "fade_horizontal-flip_horizontal", boxBg }}; emojiSuggestionsFadeRight: icon {{ "fade_horizontal", boxBg }}; diff --git a/Telegram/SourceFiles/chat_helpers/emoji_list_widget.cpp b/Telegram/SourceFiles/chat_helpers/emoji_list_widget.cpp index 6d9f6ff92e..700e8dfba8 100644 --- a/Telegram/SourceFiles/chat_helpers/emoji_list_widget.cpp +++ b/Telegram/SourceFiles/chat_helpers/emoji_list_widget.cpp @@ -608,15 +608,34 @@ rpl::producer<> EmojiListWidget::jumpedToPremium() const { return _jumpedToPremium.events(); } +void EmojiListWidget::prepareExpanding() { + if (_search) { + _searchExpandCache = _search->grab(); + } +} + void EmojiListWidget::paintExpanding( QPainter &p, QRect clip, int finalBottom, float64 progress, RectPart origin) { - const auto shift = clip.topLeft(); + const auto searchShift = _search + ? anim::interpolate( + st().padding.top() - _search->height(), + 0, + progress) + : 0; + const auto shift = clip.topLeft() + QPoint(0, searchShift); const auto adjusted = clip.translated(-shift); const auto finalHeight = (finalBottom - clip.y()); + if (!_searchExpandCache.isNull()) { + p.setClipRect(clip); + p.drawImage( + clip.x() + st().searchMargin.left(), + clip.y() + st().searchMargin.top() + searchShift, + _searchExpandCache); + } p.translate(shift); p.setClipRect(adjusted); paint(p, ExpandingContext{ @@ -712,8 +731,7 @@ bool EmojiListWidget::enumerateSections(Callback callback) const { info.rowsTop = info.top + (i == 0 ? _rowsTop : st().header); info.rowsBottom = info.rowsTop - + (info.rowsCount * _singleSize.height()) - + st::emojiPanRadius; + + (info.rowsCount * _singleSize.height()); if (!callback(info)) { return false; } @@ -807,13 +825,12 @@ int EmojiListWidget::countDesiredHeight(int newWidth) { - st().margin.left(); setSingleSize({ singleWidth, singleWidth - 2 * st().verticalSizeSub }); - auto visibleHeight = minimalHeight(); - auto minimalHeight = (visibleHeight - st::stickerPanPadding); - auto countResult = [this](int minimalLastHeight) { + const auto countResult = [this](int minimalLastHeight) { const auto info = sectionInfo(sectionsCount() - 1); return info.top + qMax(info.rowsBottom - info.top, minimalLastHeight); }; + const auto minimalHeight = this->minimalHeight(); const auto minimalLastHeight = std::max( minimalHeight - padding.bottom(), 0); @@ -948,6 +965,9 @@ void EmojiListWidget::paintEvent(QPaintEvent *e) { } else if (st().bg->c.alpha() > 0) { p.fillRect(clip, st().bg); } + if (!_searchExpandCache.isNull()) { + _searchExpandCache = QImage(); + } paint(p, {}, clip); } diff --git a/Telegram/SourceFiles/chat_helpers/emoji_list_widget.h b/Telegram/SourceFiles/chat_helpers/emoji_list_widget.h index f33eda32d3..ab8ca1b85c 100644 --- a/Telegram/SourceFiles/chat_helpers/emoji_list_widget.h +++ b/Telegram/SourceFiles/chat_helpers/emoji_list_widget.h @@ -119,6 +119,7 @@ public: void provideRecent(const std::vector &customRecentList); + void prepareExpanding(); void paintExpanding( QPainter &p, QRect clip, @@ -361,6 +362,7 @@ private: int _customSingleSize = 0; bool _allowWithoutPremium = false; Ui::RoundRect _overBg; + QImage _searchExpandCache; std::vector _nextSearchQuery; std::vector _searchQuery; diff --git a/Telegram/SourceFiles/history/view/reactions/history_view_reactions_selector.cpp b/Telegram/SourceFiles/history/view/reactions/history_view_reactions_selector.cpp index d63225cb06..40a0fa5913 100644 --- a/Telegram/SourceFiles/history/view/reactions/history_view_reactions_selector.cpp +++ b/Telegram/SourceFiles/history/view/reactions/history_view_reactions_selector.cpp @@ -247,7 +247,7 @@ int Selector::extendTopForCategories() const { int Selector::minimalHeight() const { return _skipy + (_recentRows * _size) - + st::roundRadiusSmall + + st::emojiPanRadius + st::reactPanelEmojiPan.padding.bottom(); } @@ -431,7 +431,7 @@ auto Selector::paintExpandingBg(QPainter &p, float64 progress) constexpr auto kFramesCount = Ui::RoundAreaWithShadow::kFramesCount; const auto frame = int(base::SafeRound(progress * (kFramesCount - 1))); const auto radiusStart = st::reactStripHeight / 2.; - const auto radiusEnd = st::roundRadiusSmall; + const auto radiusEnd = st::emojiPanRadius; const auto radius = _reactions.customAllowed ? (radiusStart + progress * (radiusEnd - radiusStart)) : radiusStart; @@ -521,7 +521,7 @@ void Selector::finishExpand() { const auto pattern = _cachedRound.validateFrame( kFramesCount - 1, 1., - st::roundRadiusSmall); + st::emojiPanRadius); const auto fill = _cachedRound.FillWithImage(q, rect(), pattern); if (!fill.isEmpty()) { q.fillRect(fill, st::defaultPopupMenu.menu.itemBg); @@ -677,6 +677,7 @@ void Selector::expand() { cacheExpandIcon(); [[maybe_unused]] const auto grabbed = Ui::GrabWidget(_scroll); + _list->prepareExpanding(); setSelected(-1); base::call_delayed(kExpandDelay, this, [this] { diff --git a/Telegram/SourceFiles/ui/controls/tabbed_search.cpp b/Telegram/SourceFiles/ui/controls/tabbed_search.cpp index 5afec027b2..f7f0fe80e6 100644 --- a/Telegram/SourceFiles/ui/controls/tabbed_search.cpp +++ b/Telegram/SourceFiles/ui/controls/tabbed_search.cpp @@ -633,6 +633,10 @@ int TabbedSearch::height() const { return _search.height() + rect::m::sum::v(_st.searchMargin); } +QImage TabbedSearch::grab() { + return Ui::GrabWidgetToImage(&_search); +} + void TabbedSearch::setLoading(bool loading) { _search.setLoading(loading); } diff --git a/Telegram/SourceFiles/ui/controls/tabbed_search.h b/Telegram/SourceFiles/ui/controls/tabbed_search.h index c0b643e487..cc6682f721 100644 --- a/Telegram/SourceFiles/ui/controls/tabbed_search.h +++ b/Telegram/SourceFiles/ui/controls/tabbed_search.h @@ -112,6 +112,7 @@ public: SearchDescriptor &&descriptor); [[nodiscard]] int height() const; + [[nodiscard]] QImage grab(); [[nodiscard]] rpl::producer> queryValue() const; [[nodiscard]] auto debouncedQueryValue() const