RepoMirrors/tdesktop
1
0
Fork 0
mirror of https://github.com/telegramdesktop/tdesktop synced 2025-02-20 15:17:41 +00:00
Code Issues Projects Releases Wiki Activity

Slightly improved style of controls in photo editor.

Browse Source
This commit is contained in:
23rd 2021-04-03 17:58:49 +03:00
parent 221d45b500
commit e926e5f882
3 changed files with 45 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
Telegram/SourceFiles/editor/editor.style
View File

@ -11,38 +11,54 @@ using "ui/widgets/widgets.style";
using "ui/chat/chat.style";
photoEditorControlsHeight: 100px;
photoEditorControlsTopSkip: 50px;
photoEditorControlsTopSkip: 40px;
photoEditorButtonIconFg: historyComposeIconFg;
photoEditorButtonIconFgOver: historyComposeIconFgOver;
photoEditorButtonIconFg: mediaviewPipControlsFg;
photoEditorButtonIconFgOver: mediaviewPipControlsFgOver;
photoEditorButtonIconFgActive: historyComposeIconFgOver;
photoEditorButtonIconFgInactive: menuFgDisabled;
photoEditorButtonIconFgActive: lightButtonFg;
photoEditorButtonIconFgInactive: mediaviewPipPlaybackInactive;
photoEditorRotateButton: IconButton(defaultIconButton) {
width: 56px;
height: 56px;
photoEditorRotateButton: IconButton(historyAttach) {
icon: icon {{ "photo_editor/rotate", photoEditorButtonIconFg }};
iconOver: icon {{ "photo_editor/rotate", photoEditorButtonIconFgOver }};
rippleAreaPosition: point(8px, 8px);
rippleAreaSize: 40px;
ripple: RippleAnimation(defaultRippleAnimation) {
color: shadowFg;
}
}
photoEditorFlipButton: IconButton(historyAttach) {
photoEditorFlipButton: IconButton(photoEditorRotateButton) {
icon: icon {{ "photo_editor/flip", photoEditorButtonIconFg }};
iconOver: icon {{ "photo_editor/flip", photoEditorButtonIconFgOver }};
}
photoEditorPaintModeButton: IconButton(historyAttach) {
photoEditorFlipIconActive: icon {{ "photo_editor/flip", photoEditorButtonIconFgActive }};
photoEditorPaintModeButton: IconButton(photoEditorRotateButton) {
icon: icon {{ "photo_editor/paint", photoEditorButtonIconFg }};
iconOver: icon {{ "photo_editor/paint", photoEditorButtonIconFgOver }};
}
photoEditorUndoButton: IconButton(historyAttach) {
photoEditorPaintIconActive: icon {{ "photo_editor/paint", photoEditorButtonIconFgActive }};
photoEditorUndoButton: IconButton(photoEditorRotateButton) {
icon: icon {{ "photo_editor/undo", photoEditorButtonIconFg }};
iconOver: icon {{ "photo_editor/undo", photoEditorButtonIconFgOver }};
}
photoEditorRedoButton: IconButton(historyAttach) {
photoEditorRedoButton: IconButton(photoEditorRotateButton) {
icon: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFg }};
iconOver: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFgOver }};
}
photoEditorStickersButton: IconButton(historyAttach) {
photoEditorStickersButton: IconButton(photoEditorRotateButton) {
icon: icon {{ "settings_stickers", photoEditorButtonIconFg }};
iconOver: icon {{ "settings_stickers", photoEditorButtonIconFgOver }};
}
photoEditorStickersIconActive: icon {{ "settings_stickers", photoEditorButtonIconFgActive }};
photoEditorUndoButtonInactive: icon {{ "photo_editor/undo", photoEditorButtonIconFgInactive }};
photoEditorRedoButtonInactive: icon {{ "photo_editor/undo-flip_horizontal", photoEditorButtonIconFgInactive }};
@ -51,7 +67,7 @@ photoEditorTextButtonPadding: margins(10px, 0px, 10px, 0px);
photoEditorColorPickerTopSkip: 20px;
photoEditorColorPickerWidth: 250px;
photoEditorColorPickerLineHeight: 20px;
photoEditorColorPickerLineHeight: 10px;
photoEditorColorPickerCanvasHeight: 300px;
photoEditorColorPickerCircleSize: 24px;
photoEditorColorPickerCircleBigSize: 50px;

28
Telegram/SourceFiles/editor/photo_editor_controls.cpp
View File

@ -138,7 +138,7 @@ PhotoEditorControls::PhotoEditorControls(
const PhotoModifications modifications,
bool doneControls)
: RpWidget(parent)
, _bg(st::mediaviewSaveMsgBg)
, _bg(st::roundedBg)
, _transformButtons(base::make_unique_q<HorizontalContainer>(this))
, _paintButtons(base::make_unique_q<HorizontalContainer>(this))
, _rotateButton(base::make_unique_q<Ui::IconButton>(
@ -179,14 +179,15 @@ PhotoEditorControls::PhotoEditorControls(
false,
_bg,
st::lightButtonFg,
st::photoEditorRotateButton.ripple))
, _flipped(modifications.flipped) {
st::photoEditorRotateButton.ripple)) {
_transformButtons->updateChildrenPosition();
_paintButtons->updateChildrenPosition();
_paintModeButtonActive->setIconOverride(
&st::photoEditorPaintModeButton.iconOver);
{
const auto icon = &st::photoEditorPaintIconActive;
_paintModeButtonActive->setIconOverride(icon, icon);
}
_paintModeButtonActive->setAttribute(Qt::WA_TransparentForMouseEvents);
paintRequest(
@ -263,18 +264,21 @@ PhotoEditorControls::PhotoEditorControls(
controllers->stickersPanelController->panelShown(
) | rpl::start_with_next([=](bool shown) {
_stickersButton->setIconOverride(shown
? &st::photoEditorStickersButton.iconOver
: nullptr);
const auto icon = shown
? &st::photoEditorStickersIconActive
: nullptr;
_stickersButton->setIconOverride(icon, icon);
}, _stickersButton->lifetime());
}
_flipButton->clicks(
rpl::single(
rpl::empty_value()
) | rpl::skip(modifications.flipped ? 0 : 1) | rpl::then(
_flipButton->clicks() | rpl::to_empty
) | rpl::start_with_next([=] {
_flipped = !_flipped;
_flipButton->setIconOverride(_flipped
? &st::photoEditorFlipButton.iconOver
: nullptr);
const auto icon = _flipped ? &st::photoEditorFlipIconActive : nullptr;
_flipButton->setIconOverride(icon, icon);
}, _flipButton->lifetime());
}

2
Telegram/SourceFiles/editor/photo_editor_controls.h
View File

@ -55,7 +55,7 @@ private:
const base::unique_qptr<EdgeButton> _cancel;
const base::unique_qptr<EdgeButton> _done;
bool _flipped;
bool _flipped = false;
rpl::variable<PhotoEditorMode> _mode;