From edfd9bedc1c873138fe77c28600b37d2e5ff78ad Mon Sep 17 00:00:00 2001 From: 23rd <23rd@vivaldi.net> Date: Sat, 1 May 2021 20:04:24 +0300 Subject: [PATCH] Improved style for controls in EditCaptionBox. --- Telegram/SourceFiles/boxes/boxes.style | 7 +- .../SourceFiles/boxes/edit_caption_box.cpp | 99 +++++++++++++------ Telegram/SourceFiles/boxes/edit_caption_box.h | 4 +- .../ui/chat/attach/attach_controls.cpp | 54 +++++++--- .../ui/chat/attach/attach_controls.h | 12 ++- 5 files changed, 127 insertions(+), 49 deletions(-) diff --git a/Telegram/SourceFiles/boxes/boxes.style b/Telegram/SourceFiles/boxes/boxes.style index 6c1dc2913..c963a5cd8 100644 --- a/Telegram/SourceFiles/boxes/boxes.style +++ b/Telegram/SourceFiles/boxes/boxes.style @@ -429,17 +429,16 @@ sendMediaPreviewHeightMax: 1280; sendMediaRowSkip: 10px; editMediaButtonSize: 32px; -editMediaButtonSkip: 8px; +editMediaButtonSkip: 5px; editMediaButtonFileSkipRight: 1px; editMediaButtonFileSkipTop: 7px; editMediaButtonIconFile: icon {{ "send_media/send_media_replace", menuIconFg }}; -editMediaButtonIconPhoto: icon {{ "send_media/send_media_replace", roundedFg }}; editMediaButton: IconButton(defaultIconButton) { width: editMediaButtonSize; height: editMediaButtonSize; - icon: editMediaButtonIconPhoto; + icon: editMediaButtonIconFile; rippleAreaSize: editMediaButtonSize; ripple: defaultRippleAnimation; @@ -457,6 +456,7 @@ sendBoxAlbumGroupSkipRight: 5px; sendBoxAlbumGroupSkipTop: 5px; sendBoxAlbumGroupRadius: 4px; sendBoxAlbumGroupSize: size(62px, 25px); +sendBoxAlbumSmallGroupSize: size(30px, 25px); sendBoxFileGroupSkipTop: 2px; sendBoxFileGroupSkipRight: 5px; @@ -470,6 +470,7 @@ sendBoxAlbumGroupButtonFile: IconButton(editMediaButton) { sendBoxAlbumGroupEditButtonIconFile: editMediaButtonIconFile; sendBoxAlbumGroupDeleteButtonIconFile: icon {{ "send_media/send_media_delete", menuIconFg }}; +sendBoxAlbumButtonMediaEdit: icon {{ "send_media/send_media_replace", roundedFg }}; sendBoxAlbumGroupButtonMediaEdit: icon {{ "send_media/send_media_replace", roundedFg, point(4px, 1px) }}; sendBoxAlbumGroupButtonMediaDelete: icon {{ "send_media/send_media_delete", roundedFg }}; diff --git a/Telegram/SourceFiles/boxes/edit_caption_box.cpp b/Telegram/SourceFiles/boxes/edit_caption_box.cpp index dfed37e4f..61ba94cf4 100644 --- a/Telegram/SourceFiles/boxes/edit_caption_box.cpp +++ b/Telegram/SourceFiles/boxes/edit_caption_box.cpp @@ -51,6 +51,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "ui/text/format_song_document_name.h" #include "ui/text/format_values.h" #include "ui/text/text_options.h" +#include "ui/chat/attach/attach_controls.h" #include "ui/chat/attach/attach_prepare.h" #include "ui/controls/emoji_button.h" #include "ui/toast/toast.h" @@ -683,13 +684,8 @@ void EditCaptionBox::updateEditPreview() { } void EditCaptionBox::updateEditMediaButton() { - const auto icon = _doc - ? &st::editMediaButtonIconFile - : &st::editMediaButtonIconPhoto; - const auto color = _doc ? &st::windowBgRipple : &st::roundedBg; - _editMedia->setIconOverride(icon); - _editMedia->setRippleColorOverride(color); - _editMedia->setForceRippled(!_doc, anim::type::instant); + _editMedia->setVisible(!_doc); + _editFile->setVisible(_doc); } void EditCaptionBox::createEditMediaButton() { @@ -742,14 +738,18 @@ void EditCaptionBox::createEditMediaButton() { lifetime()); // Create edit media button. - _editMedia.create(this, st::editMediaButton); + _editMedia.create(this, Ui::AttachControls::Type::EditOnly); + _editFile.create(this, st::editMediaButton); updateEditMediaButton(); - _editMedia->setClickedCallback( + _editFile->setClickedCallback( App::LambdaDelayed( st::historyAttach.ripple.hideDuration, this, buttonCallback)); + _editMedia->editRequests( + ) | rpl::start_with_next(buttonCallback, _editMedia->lifetime()); + _photoEditorButton = base::make_unique_q(this); _photoEditorButton->clicks( ) | rpl::to_empty | rpl::start_to_stream( @@ -987,39 +987,56 @@ void EditCaptionBox::startStreamedPlayer() { void EditCaptionBox::paintEvent(QPaintEvent *e) { BoxContent::paintEvent(e); + const auto &padding = st::boxPhotoPadding; + Painter p(this); if (_photo || _animated) { const auto th = std::max(_gifh, _thumbh); - if (_thumbx > st::boxPhotoPadding.left()) { - p.fillRect(st::boxPhotoPadding.left(), st::boxPhotoPadding.top(), _thumbx - st::boxPhotoPadding.left(), th, st::confirmBg); + if (_thumbx > padding.left()) { + p.fillRect( + padding.left(), + padding.top(), + _thumbx - padding.left(), + th, + st::confirmBg); } - if (_thumbx + _thumbw < width() - st::boxPhotoPadding.right()) { - p.fillRect(_thumbx + _thumbw, st::boxPhotoPadding.top(), width() - st::boxPhotoPadding.right() - _thumbx - _thumbw, th, st::confirmBg); + if (_thumbx + _thumbw < width() - padding.right()) { + p.fillRect( + _thumbx + _thumbw, + padding.top(), + width() - padding.right() - _thumbx - _thumbw, + th, + st::confirmBg); } checkStreamedIsStarted(); if (_streamed && _streamed->player().ready() && !_streamed->player().videoSize().isEmpty()) { const auto s = QSize(_gifw, _gifh); - const auto paused = _controller->isGifPausedAtLeastFor(Window::GifPauseReason::Layer); + const auto paused = _controller->isGifPausedAtLeastFor( + Window::GifPauseReason::Layer); auto request = ::Media::Streaming::FrameRequest(); request.outer = s * cIntRetinaFactor(); request.resize = s * cIntRetinaFactor(); p.drawImage( - QRect(_gifx, st::boxPhotoPadding.top(), _gifw, _gifh), + QRect(_gifx, padding.top(), _gifw, _gifh), _streamed->frame(request)); if (!paused) { _streamed->markFrameShown(); } } else { const auto offset = _gifh ? ((_gifh - _thumbh) / 2) : 0; - p.drawPixmap(_thumbx, st::boxPhotoPadding.top() + offset, _thumb); + p.drawPixmap(_thumbx, padding.top() + offset, _thumb); } if (_animated && !_streamed) { const auto &st = st::msgFileLayout; - QRect inner(_thumbx + (_thumbw - st.thumbSize) / 2, st::boxPhotoPadding.top() + (th - st.thumbSize) / 2, st.thumbSize, st.thumbSize); + QRect inner( + _thumbx + (_thumbw - st.thumbSize) / 2, + padding.top() + (th - st.thumbSize) / 2, + st.thumbSize, + st.thumbSize); p.setPen(Qt::NoPen); p.setBrush(st::msgDateImgBg); @@ -1035,21 +1052,26 @@ void EditCaptionBox::paintEvent(QPaintEvent *e) { const auto &st = isThumbedLayout() ? st::msgFileThumbLayout : st::msgFileLayout; - const auto w = width() - st::boxPhotoPadding.left() - st::boxPhotoPadding.right(); + const auto w = width() - padding.left() - padding.right(); const auto h = 0 + st.thumbSize + 0; const auto nameleft = 0 + st.thumbSize + st.padding.right(); const auto nametop = st.nameTop - st.padding.top(); const auto nameright = 0; const auto statustop = st.statusTop - st.padding.top(); const auto editButton = _isAllowedEditMedia - ? _editMedia->width() + st::editMediaButtonSkip + ? _editFile->width() + st::editMediaButtonSkip : 0; const auto namewidth = w - nameleft - editButton; - const auto x = (width() - w) / 2, y = st::boxPhotoPadding.top(); + const auto x = (width() - w) / 2, y = padding.top(); // Ui::FillRoundCorner(p, x, y, w, h, st::msgInBg, Ui::MessageInCorners, &st::msgInShadow); - const auto rthumb = style::rtlrect(x + 0, y + 0, st.thumbSize, st.thumbSize, width()); + const auto rthumb = style::rtlrect( + x + 0, + y + 0, + st.thumbSize, + st.thumbSize, + width()); if (isThumbedLayout()) { p.drawPixmap(rthumb.topLeft(), _thumb); } else { @@ -1072,7 +1094,12 @@ void EditCaptionBox::paintEvent(QPaintEvent *e) { } p.setFont(st::semiboldFont); p.setPen(st::historyFileNameInFg); - _name.drawLeftElided(p, x + nameleft, y + nametop, namewidth, width()); + _name.drawLeftElided( + p, + x + nameleft, + y + nametop, + namewidth, + width()); const auto &status = st::mediaInFg; p.setFont(st::normalFont); @@ -1081,23 +1108,33 @@ void EditCaptionBox::paintEvent(QPaintEvent *e) { } else { p.setFont(st::boxTitleFont); p.setPen(st::boxTextFg); - p.drawTextLeft(_field->x(), st::boxPhotoPadding.top(), width(), tr::lng_edit_message(tr::now)); + p.drawTextLeft( + _field->x(), + padding.top(), + width(), + tr::lng_edit_message(tr::now)); } if (!_error.isEmpty()) { p.setFont(st::normalFont); p.setPen(st::boxTextFgError); - p.drawTextLeft(_field->x(), _field->y() + _field->height() + errorTopSkip(), width(), _error); + p.drawTextLeft( + _field->x(), + _field->y() + _field->height() + errorTopSkip(), + width(), + _error); } if (_isAllowedEditMedia) { - _editMedia->moveToRight( - st::boxPhotoPadding.right() + (_doc - ? st::editMediaButtonFileSkipRight - : st::editMediaButtonSkip), - st::boxPhotoPadding.top() + (_doc - ? st::editMediaButtonFileSkipTop - : st::editMediaButtonSkip)); + if (_doc) { + _editFile->moveToRight( + padding.right() + st::editMediaButtonFileSkipRight, + padding.top() + st::editMediaButtonFileSkipTop); + } else { + _editMedia->moveToRight( + padding.right() + st::editMediaButtonSkip, + padding.top() + st::editMediaButtonSkip); + } } } diff --git a/Telegram/SourceFiles/boxes/edit_caption_box.h b/Telegram/SourceFiles/boxes/edit_caption_box.h index 0a034628a..acee60dc2 100644 --- a/Telegram/SourceFiles/boxes/edit_caption_box.h +++ b/Telegram/SourceFiles/boxes/edit_caption_box.h @@ -35,6 +35,7 @@ class EmojiButton; class IconButton; class Checkbox; enum class AlbumType; +class AttachControlsWidget; } // namespace Ui namespace Window { @@ -142,7 +143,8 @@ private: mtpRequestId _saveRequestId = 0; - object_ptr _editMedia = nullptr; + object_ptr _editMedia = nullptr; + object_ptr _editFile = nullptr; Ui::SlideWrap *_wayWrap = nullptr; Ui::SlideWrap *_hintLabel = nullptr; QString _newMediaPath; diff --git a/Telegram/SourceFiles/ui/chat/attach/attach_controls.cpp b/Telegram/SourceFiles/ui/chat/attach/attach_controls.cpp index b8cd7400c..bdca508ad 100644 --- a/Telegram/SourceFiles/ui/chat/attach/attach_controls.cpp +++ b/Telegram/SourceFiles/ui/chat/attach/attach_controls.cpp @@ -18,37 +18,65 @@ AttachControls::AttachControls() void AttachControls::paint(Painter &p, int x, int y) { const auto groupWidth = width(); const auto groupHeight = height(); - const auto groupHalfWidth = groupWidth / 2; - const auto &internalSkip = st::sendBoxAlbumGroupEditInternalSkip; + const auto full = (_type == Type::Full); QRect groupRect(x, y, groupWidth, groupHeight); _rect.paint(p, groupRect); - QRect leftRect(x, y, groupHalfWidth, groupHeight); - QRect rightRect(x + groupHalfWidth, y, groupHalfWidth, groupHeight); - st::sendBoxAlbumGroupButtonMediaEdit.paintInCenter(p, leftRect); - st::sendBoxAlbumGroupButtonMediaDelete.paintInCenter(p, rightRect); + if (full) { + const auto groupHalfWidth = groupWidth / 2; + QRect leftRect(x, y, groupHalfWidth, groupHeight); + st::sendBoxAlbumGroupButtonMediaEdit.paintInCenter(p, leftRect); + QRect rightRect(x + groupHalfWidth, y, groupHalfWidth, groupHeight); + st::sendBoxAlbumGroupButtonMediaDelete.paintInCenter(p, rightRect); + } else { + st::sendBoxAlbumButtonMediaEdit.paintInCenter(p, groupRect); + } } int AttachControls::width() const { - return st::sendBoxAlbumGroupSize.width(); + return (_type == Type::Full) + ? st::sendBoxAlbumGroupSize.width() + : st::sendBoxAlbumSmallGroupSize.width(); } int AttachControls::height() const { - return st::sendBoxAlbumGroupSize.height(); + return (_type == Type::Full) + ? st::sendBoxAlbumGroupSize.height() + : st::sendBoxAlbumSmallGroupSize.height(); } -AttachControlsWidget::AttachControlsWidget(not_null parent) +AttachControls::Type AttachControls::type() const { + return _type; +} + +void AttachControls::setType(Type type) { + if (_type != type) { + _type = type; + } +} + +AttachControlsWidget::AttachControlsWidget( + not_null parent, + AttachControls::Type type) : RpWidget(parent) , _edit(base::make_unique_q(this)) , _delete(base::make_unique_q(this)) { + _controls.setType(type); + const auto w = _controls.width(); resize(w, _controls.height()); - _edit->resize(w / 2, _controls.height()); - _delete->resize(w / 2, _controls.height()); - _edit->moveToLeft(0, 0, w); - _delete->moveToRight(0, 0, w); + if (type == AttachControls::Type::Full) { + _edit->resize(w / 2, _controls.height()); + _delete->resize(w / 2, _controls.height()); + + _edit->moveToLeft(0, 0, w); + _delete->moveToRight(0, 0, w); + } else if (type == AttachControls::Type::EditOnly) { + _edit->resize(w, _controls.height()); + _edit->moveToLeft(0, 0, w); + } paintRequest( ) | rpl::start_with_next([=] { diff --git a/Telegram/SourceFiles/ui/chat/attach/attach_controls.h b/Telegram/SourceFiles/ui/chat/attach/attach_controls.h index 5e75ce6ef..efec4afc5 100644 --- a/Telegram/SourceFiles/ui/chat/attach/attach_controls.h +++ b/Telegram/SourceFiles/ui/chat/attach/attach_controls.h @@ -15,21 +15,31 @@ namespace Ui { class AttachControls final { public: + enum class Type { + Full, + EditOnly, + }; + AttachControls(); void paint(Painter &p, int x, int y); + void setType(Type type); [[nodiscard]] int width() const; [[nodiscard]] int height() const; + [[nodiscard]] Type type() const; private: RoundRect _rect; + Type _type = Type::Full; }; class AttachControlsWidget final : public RpWidget { public: - AttachControlsWidget(not_null parent); + AttachControlsWidget( + not_null parent, + AttachControls::Type type = AttachControls::Type::Full); [[nodiscard]] rpl::producer<> editRequests() const; [[nodiscard]] rpl::producer<> deleteRequests() const;