Added edge buttons to controls of photo editor.
This commit is contained in:
parent
2bdb9af146
commit
0adcd37030
|
@ -38,3 +38,5 @@ photoEditorRedoButton: IconButton(historyAttach) {
|
||||||
icon: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFg }};
|
icon: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFg }};
|
||||||
iconOver: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFgOver }};
|
iconOver: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFgOver }};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
photoEditorTextButtonPadding: margins(10px, 0px, 10px, 0px);
|
||||||
|
|
|
@ -7,12 +7,104 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL
|
||||||
*/
|
*/
|
||||||
#include "editor/photo_editor_controls.h"
|
#include "editor/photo_editor_controls.h"
|
||||||
|
|
||||||
#include "ui/cached_round_corners.h"
|
#include "lang/lang_keys.h"
|
||||||
|
#include "ui/image/image_prepare.h"
|
||||||
#include "ui/widgets/buttons.h"
|
#include "ui/widgets/buttons.h"
|
||||||
|
|
||||||
#include "styles/style_editor.h"
|
#include "styles/style_editor.h"
|
||||||
|
|
||||||
namespace Editor {
|
namespace Editor {
|
||||||
|
|
||||||
|
class EdgeButton final : public Ui::RippleButton {
|
||||||
|
public:
|
||||||
|
EdgeButton(
|
||||||
|
not_null<Ui::RpWidget*> parent,
|
||||||
|
const QString &text,
|
||||||
|
int height,
|
||||||
|
bool left,
|
||||||
|
const style::color &bg,
|
||||||
|
const style::color &fg,
|
||||||
|
const style::RippleAnimation &st);
|
||||||
|
|
||||||
|
protected:
|
||||||
|
QImage prepareRippleMask() const override;
|
||||||
|
QPoint prepareRippleStartPosition() const override;
|
||||||
|
|
||||||
|
private:
|
||||||
|
void init();
|
||||||
|
|
||||||
|
const style::color &_fg;
|
||||||
|
Ui::Text::String _text;
|
||||||
|
const int _width;
|
||||||
|
const QRect _rippleRect;
|
||||||
|
const QColor _bg;
|
||||||
|
const bool _left;
|
||||||
|
|
||||||
|
QImage rounded(std::optional<QColor> color) const;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
EdgeButton::EdgeButton(
|
||||||
|
not_null<Ui::RpWidget*> parent,
|
||||||
|
const QString &text,
|
||||||
|
int height,
|
||||||
|
bool left,
|
||||||
|
const style::color &bg,
|
||||||
|
const style::color &fg,
|
||||||
|
const style::RippleAnimation &st)
|
||||||
|
: Ui::RippleButton(parent, st)
|
||||||
|
, _fg(fg)
|
||||||
|
, _text(st::semiboldTextStyle, text.toUpper())
|
||||||
|
, _width(_text.maxWidth()
|
||||||
|
+ st::photoEditorTextButtonPadding.left()
|
||||||
|
+ st::photoEditorTextButtonPadding.right())
|
||||||
|
, _rippleRect(QRect(0, 0, _width, height))
|
||||||
|
, _bg(bg->c)
|
||||||
|
, _left(left) {
|
||||||
|
resize(_width, height);
|
||||||
|
init();
|
||||||
|
}
|
||||||
|
|
||||||
|
void EdgeButton::init() {
|
||||||
|
const auto bg = rounded(_bg);
|
||||||
|
|
||||||
|
paintRequest(
|
||||||
|
) | rpl::start_with_next([=] {
|
||||||
|
Painter p(this);
|
||||||
|
|
||||||
|
p.drawImage(QPoint(), bg);
|
||||||
|
|
||||||
|
paintRipple(p, _rippleRect.x(), _rippleRect.y());
|
||||||
|
|
||||||
|
p.setPen(_fg);
|
||||||
|
const auto textTop = (height() - _text.minHeight()) / 2;
|
||||||
|
_text.draw(p, 0, textTop, width(), style::al_center);
|
||||||
|
}, lifetime());
|
||||||
|
}
|
||||||
|
|
||||||
|
QImage EdgeButton::rounded(std::optional<QColor> color) const {
|
||||||
|
auto result = QImage(
|
||||||
|
_rippleRect.size() * cIntRetinaFactor(),
|
||||||
|
QImage::Format_ARGB32_Premultiplied);
|
||||||
|
result.setDevicePixelRatio(cIntRetinaFactor());
|
||||||
|
result.fill(color.value_or(Qt::white));
|
||||||
|
|
||||||
|
using Option = Images::Option;
|
||||||
|
const auto options = Option::Smooth
|
||||||
|
| Option::RoundedLarge
|
||||||
|
| (_left ? Option::RoundedTopLeft : Option::RoundedTopRight)
|
||||||
|
| (_left ? Option::RoundedBottomLeft : Option::RoundedBottomRight);
|
||||||
|
return Images::prepare(std::move(result), 0, 0, options, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
QImage EdgeButton::prepareRippleMask() const {
|
||||||
|
return rounded(std::nullopt);
|
||||||
|
}
|
||||||
|
|
||||||
|
QPoint EdgeButton::prepareRippleStartPosition() const {
|
||||||
|
return mapFromGlobal(QCursor::pos()) - _rippleRect.topLeft();
|
||||||
|
}
|
||||||
|
|
||||||
class HorizontalContainer final : public Ui::RpWidget {
|
class HorizontalContainer final : public Ui::RpWidget {
|
||||||
public:
|
public:
|
||||||
HorizontalContainer(not_null<Ui::RpWidget*> parent);
|
HorizontalContainer(not_null<Ui::RpWidget*> parent);
|
||||||
|
@ -43,6 +135,7 @@ PhotoEditorControls::PhotoEditorControls(
|
||||||
not_null<Ui::RpWidget*> parent,
|
not_null<Ui::RpWidget*> parent,
|
||||||
bool doneControls)
|
bool doneControls)
|
||||||
: RpWidget(parent)
|
: RpWidget(parent)
|
||||||
|
, _bg(st::mediaviewSaveMsgBg)
|
||||||
, _buttonsContainer(base::make_unique_q<HorizontalContainer>(this))
|
, _buttonsContainer(base::make_unique_q<HorizontalContainer>(this))
|
||||||
, _rotateButton(base::make_unique_q<Ui::IconButton>(
|
, _rotateButton(base::make_unique_q<Ui::IconButton>(
|
||||||
_buttonsContainer,
|
_buttonsContainer,
|
||||||
|
@ -52,7 +145,23 @@ PhotoEditorControls::PhotoEditorControls(
|
||||||
st::photoEditorFlipButton))
|
st::photoEditorFlipButton))
|
||||||
, _paintModeButton(base::make_unique_q<Ui::IconButton>(
|
, _paintModeButton(base::make_unique_q<Ui::IconButton>(
|
||||||
_buttonsContainer,
|
_buttonsContainer,
|
||||||
st::photoEditorPaintModeButton)) {
|
st::photoEditorPaintModeButton))
|
||||||
|
, _cancel(base::make_unique_q<EdgeButton>(
|
||||||
|
this,
|
||||||
|
tr::lng_cancel(tr::now),
|
||||||
|
_flipButton->height(),
|
||||||
|
true,
|
||||||
|
_bg,
|
||||||
|
st::activeButtonFg,
|
||||||
|
st::photoEditorRotateButton.ripple))
|
||||||
|
, _done(base::make_unique_q<EdgeButton>(
|
||||||
|
this,
|
||||||
|
tr::lng_box_done(tr::now),
|
||||||
|
_flipButton->height(),
|
||||||
|
false,
|
||||||
|
_bg,
|
||||||
|
st::lightButtonFg,
|
||||||
|
st::photoEditorRotateButton.ripple)) {
|
||||||
|
|
||||||
_buttonsContainer->updateChildrenPosition();
|
_buttonsContainer->updateChildrenPosition();
|
||||||
|
|
||||||
|
@ -60,11 +169,9 @@ PhotoEditorControls::PhotoEditorControls(
|
||||||
) | rpl::start_with_next([=](const QRect &clip) {
|
) | rpl::start_with_next([=](const QRect &clip) {
|
||||||
Painter p(this);
|
Painter p(this);
|
||||||
|
|
||||||
Ui::FillRoundRect(
|
p.setPen(Qt::NoPen);
|
||||||
p,
|
p.setBrush(_bg);
|
||||||
_buttonsContainer->geometry(),
|
p.drawRect(_buttonsContainer->geometry());
|
||||||
st::mediaviewSaveMsgBg,
|
|
||||||
Ui::MediaviewSaveCorners);
|
|
||||||
|
|
||||||
}, lifetime());
|
}, lifetime());
|
||||||
|
|
||||||
|
@ -75,12 +182,17 @@ PhotoEditorControls::PhotoEditorControls(
|
||||||
(size.width() - _buttonsContainer->width()) / 2,
|
(size.width() - _buttonsContainer->width()) / 2,
|
||||||
0);
|
0);
|
||||||
|
|
||||||
|
_cancel->moveToLeft(_buttonsContainer->x() - _cancel->width(), 0);
|
||||||
|
_done->moveToLeft(
|
||||||
|
_buttonsContainer->x() + _buttonsContainer->width(),
|
||||||
|
0);
|
||||||
|
|
||||||
}, lifetime());
|
}, lifetime());
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
rpl::producer<int> PhotoEditorControls::rotateRequests() const {
|
rpl::producer<int> PhotoEditorControls::rotateRequests() const {
|
||||||
return _rotateButton->clicks() | rpl::map([] { return 90; });
|
return _rotateButton->clicks() | rpl::map_to(90);
|
||||||
}
|
}
|
||||||
|
|
||||||
rpl::producer<> PhotoEditorControls::flipRequests() const {
|
rpl::producer<> PhotoEditorControls::flipRequests() const {
|
||||||
|
|
|
@ -15,6 +15,7 @@ class IconButton;
|
||||||
|
|
||||||
namespace Editor {
|
namespace Editor {
|
||||||
|
|
||||||
|
class EdgeButton;
|
||||||
class HorizontalContainer;
|
class HorizontalContainer;
|
||||||
|
|
||||||
class PhotoEditorControls final : public Ui::RpWidget {
|
class PhotoEditorControls final : public Ui::RpWidget {
|
||||||
|
@ -29,10 +30,13 @@ public:
|
||||||
|
|
||||||
private:
|
private:
|
||||||
|
|
||||||
|
const style::color &_bg;
|
||||||
const base::unique_qptr<HorizontalContainer> _buttonsContainer;
|
const base::unique_qptr<HorizontalContainer> _buttonsContainer;
|
||||||
const base::unique_qptr<Ui::IconButton> _rotateButton;
|
const base::unique_qptr<Ui::IconButton> _rotateButton;
|
||||||
const base::unique_qptr<Ui::IconButton> _flipButton;
|
const base::unique_qptr<Ui::IconButton> _flipButton;
|
||||||
const base::unique_qptr<Ui::IconButton> _paintModeButton;
|
const base::unique_qptr<Ui::IconButton> _paintModeButton;
|
||||||
|
const base::unique_qptr<EdgeButton> _cancel;
|
||||||
|
const base::unique_qptr<EdgeButton> _done;
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue