void/AyuGramDesktop
2
0
Fork 0
mirror of https://github.com/AyuGram/AyuGramDesktop.git synced 2025-04-17 06:37:24 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve design of payment bottom buttons.

Browse source
This commit is contained in:
John Preston 2021-03-31 10:19:14 +04:00
parent b08d9fe0b8
commit f09a468a7c
11 changed files with 103 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
Telegram/SourceFiles/payments/payments_checkout_process.cpp
View file

@ -106,7 +106,7 @@ CheckoutProcess::CheckoutProcess(
}, _lifetime);
_panel->backRequests(
) | rpl::start_with_next([=] {
showForm();
panelCancelEdit();
}, _panel->lifetime());
showForm();
}
@ -385,6 +385,13 @@ bool CheckoutProcess::panelWebviewNavigationAttempt(const QString &uri) {
return false;
}
void CheckoutProcess::panelCancelEdit() {
if (_submitState != SubmitState::None) {
return;
}
showForm();
}
void CheckoutProcess::panelEditPaymentMethod() {
if (_submitState != SubmitState::None
&& _submitState != SubmitState::Validated) {

1
Telegram/SourceFiles/payments/payments_checkout_process.h
View file

@ -85,6 +85,7 @@ private:
void panelWebviewMessage(const QJsonDocument &message) override;
bool panelWebviewNavigationAttempt(const QString &uri) override;
void panelCancelEdit() override;
void panelEditPaymentMethod() override;
void panelEditShippingInformation() override;
void panelEditName() override;

9
Telegram/SourceFiles/payments/ui/payments.style
View file

@ -9,12 +9,13 @@ using "ui/basic.style";
using "info/info.style";
paymentsPanelButton: defaultBoxButton;
paymentsPanelSubmit: RoundButton(defaultActiveButton) {
width: 0px;
height: 49px;
padding: margins(0px, -3px, 0px, 0px);
textTop: 16px;
width: -36px;
height: 36px;
font: boxButtonFont;
}
paymentsPanelPadding: margins(8px, 12px, 15px, 12px);
paymentsCoverPadding: margins(26px, 0px, 26px, 13px);
paymentsDescription: FlatLabel(defaultFlatLabel) {

31
Telegram/SourceFiles/payments/ui/payments_edit_card.cpp
View file

@ -208,10 +208,14 @@ EditCard::EditCard(
, _scroll(this, st::passportPanelScroll)
, _topShadow(this)
, _bottomShadow(this)
, _done(
, _submit(
this,
tr::lng_about_done(),
st::paymentsPanelButton)
, _cancel(
this,
tr::lng_about_done(),
st::passportPanelSaveValue) {
tr::lng_cancel(),
st::paymentsPanelButton) {
setupControls();
}
@ -241,9 +245,12 @@ void EditCard::showError(CardField field) {
void EditCard::setupControls() {
const auto inner = setupContent();
_done->addClickHandler([=] {
_submit->addClickHandler([=] {
_delegate->panelValidateCard(collect());
});
_cancel->addClickHandler([=] {
_delegate->panelCancelEdit();
});
using namespace rpl::mappers;
@ -364,14 +371,20 @@ void EditCard::focusInEvent(QFocusEvent *e) {
}
void EditCard::updateControlsGeometry() {
const auto submitTop = height() - _done->height();
_scroll->setGeometry(0, 0, width(), submitTop);
const auto &padding = st::paymentsPanelPadding;
const auto buttonsHeight = padding.top()
+ _cancel->height()
+ padding.bottom();
const auto buttonsTop = height() - buttonsHeight;
_scroll->setGeometry(0, 0, width(), buttonsTop);
_topShadow->resizeToWidth(width());
_topShadow->moveToLeft(0, 0);
_bottomShadow->resizeToWidth(width());
_bottomShadow->moveToLeft(0, submitTop - st::lineWidth);
_done->setFullWidth(width());
_done->moveToLeft(0, submitTop);
_bottomShadow->moveToLeft(0, buttonsTop - st::lineWidth);
auto right = padding.right();
_submit->moveToRight(right, buttonsTop + padding.top());
right += _submit->width() + padding.left();
_cancel->moveToRight(right, buttonsTop + padding.top());
_scroll->updateBars();
}

3
Telegram/SourceFiles/payments/ui/payments_edit_card.h
View file

@ -53,7 +53,8 @@ private:
object_ptr<ScrollArea> _scroll;
object_ptr<FadeShadow> _topShadow;
object_ptr<FadeShadow> _bottomShadow;
object_ptr<RoundButton> _done;
object_ptr<RoundButton> _submit;
object_ptr<RoundButton> _cancel;
std::unique_ptr<Field> _number;
std::unique_ptr<Field> _cvc;

31
Telegram/SourceFiles/payments/ui/payments_edit_information.cpp
View file

@ -44,10 +44,14 @@ EditInformation::EditInformation(
, _scroll(this, st::passportPanelScroll)
, _topShadow(this)
, _bottomShadow(this)
, _done(
, _submit(
this,
tr::lng_settings_save(),
st::paymentsPanelButton)
, _cancel(
this,
tr::lng_about_done(),
st::passportPanelSaveValue) {
tr::lng_cancel(),
st::paymentsPanelButton) {
setupControls();
}
@ -79,9 +83,12 @@ void EditInformation::showError(InformationField field) {
void EditInformation::setupControls() {
const auto inner = setupContent();
_done->addClickHandler([=] {
_submit->addClickHandler([=] {
_delegate->panelValidateInformation(collect());
});
_cancel->addClickHandler([=] {
_delegate->panelCancelEdit();
});
using namespace rpl::mappers;
@ -189,14 +196,20 @@ void EditInformation::focusInEvent(QFocusEvent *e) {
}
void EditInformation::updateControlsGeometry() {
const auto submitTop = height() - _done->height();
_scroll->setGeometry(0, 0, width(), submitTop);
const auto &padding = st::paymentsPanelPadding;
const auto buttonsHeight = padding.top()
+ _cancel->height()
+ padding.bottom();
const auto buttonsTop = height() - buttonsHeight;
_scroll->setGeometry(0, 0, width(), buttonsTop);
_topShadow->resizeToWidth(width());
_topShadow->moveToLeft(0, 0);
_bottomShadow->resizeToWidth(width());
_bottomShadow->moveToLeft(0, submitTop - st::lineWidth);
_done->setFullWidth(width());
_done->moveToLeft(0, submitTop);
_bottomShadow->moveToLeft(0, buttonsTop - st::lineWidth);
auto right = padding.right();
_submit->moveToRight(right, buttonsTop + padding.top());
right += _submit->width() + padding.left();
_cancel->moveToRight(right, buttonsTop + padding.top());
_scroll->updateBars();
}

3
Telegram/SourceFiles/payments/ui/payments_edit_information.h
View file

@ -59,7 +59,8 @@ private:
object_ptr<ScrollArea> _scroll;
object_ptr<FadeShadow> _topShadow;
object_ptr<FadeShadow> _bottomShadow;
object_ptr<RoundButton> _done;
object_ptr<RoundButton> _submit;
object_ptr<RoundButton> _cancel;
std::unique_ptr<Field> _street1;
std::unique_ptr<Field> _street2;

54
Telegram/SourceFiles/payments/ui/payments_form_summary.cpp
View file

@ -47,16 +47,20 @@ FormSummary::FormSummary(
, _scroll(this, st::passportPanelScroll)
, _topShadow(this)
, _bottomShadow(this)
, _submit(
this,
(_invoice.receipt.paid
? tr::lng_about_done()
: tr::lng_payments_pay_amount(
, _submit(_invoice.receipt.paid
? object_ptr<RoundButton>(nullptr)
: object_ptr<RoundButton>(
this,
tr::lng_payments_pay_amount(
lt_amount,
rpl::single(formatAmount(computeTotalAmount())))),
(_invoice.receipt.paid
? st::passportPanelSaveValue
: st::paymentsPanelSubmit)) {
rpl::single(formatAmount(computeTotalAmount()))),
st::paymentsPanelSubmit))
, _cancel(
this,
(_invoice.receipt.paid
? tr::lng_about_done()
: tr::lng_cancel()),
st::paymentsPanelButton) {
setupControls();
}
@ -92,11 +96,19 @@ int64 FormSummary::computeTotalAmount() const {
void FormSummary::setupControls() {
const auto inner = setupContent();
_submit->addClickHandler([=] {
_delegate->panelSubmit();
if (_submit) {
_submit->addClickHandler([=] {
_delegate->panelSubmit();
});
}
_cancel->addClickHandler([=] {
_delegate->panelRequestClose();
});
if (!_invoice) {
_submit->hide();
if (_submit) {
_submit->hide();
}
_cancel->hide();
}
using namespace rpl::mappers;
@ -387,14 +399,22 @@ void FormSummary::resizeEvent(QResizeEvent *e) {
}
void FormSummary::updateControlsGeometry() {
const auto submitTop = height() - _submit->height();
_scroll->setGeometry(0, 0, width(), submitTop);
const auto &padding = st::paymentsPanelPadding;
const auto buttonsHeight = padding.top()
+ _cancel->height()
+ padding.bottom();
const auto buttonsTop = height() - buttonsHeight;
_scroll->setGeometry(0, 0, width(), buttonsTop);
_topShadow->resizeToWidth(width());
_topShadow->moveToLeft(0, 0);
_bottomShadow->resizeToWidth(width());
_bottomShadow->moveToLeft(0, submitTop - st::lineWidth);
_submit->setFullWidth(width());
_submit->moveToLeft(0, submitTop);
_bottomShadow->moveToLeft(0, buttonsTop - st::lineWidth);
auto right = padding.right();
if (_submit) {
_submit->moveToRight(right, buttonsTop + padding.top());
right += _submit->width() + padding.left();
}
_cancel->moveToRight(right, buttonsTop + padding.top());
_scroll->updateBars();
}

1
Telegram/SourceFiles/payments/ui/payments_form_summary.h
View file

@ -58,6 +58,7 @@ private:
object_ptr<FadeShadow> _topShadow;
object_ptr<FadeShadow> _bottomShadow;
object_ptr<RoundButton> _submit;
object_ptr<RoundButton> _cancel;
rpl::event_stream<QImage> _thumbnails;
};

1
Telegram/SourceFiles/payments/ui/payments_panel_delegate.h
View file

@ -31,6 +31,7 @@ public:
virtual void panelWebviewMessage(const QJsonDocument &message) = 0;
virtual bool panelWebviewNavigationAttempt(const QString &uri) = 0;
virtual void panelCancelEdit() = 0;
virtual void panelEditPaymentMethod() = 0;
virtual void panelEditShippingInformation() = 0;
virtual void panelEditName() = 0;

4
Telegram/SourceFiles/ui/text/format_values.cpp
View file

@ -372,7 +372,7 @@ QString FillAmountAndCurrency(int64 amount, const QString &currency) {
const auto name = (*rule.international)
? QString::fromUtf8(rule.international)
: currency;
auto result = QString();
auto result = prefix;
if (rule.left) {
result.append(name);
if (rule.space) result.append(' ');
@ -381,7 +381,7 @@ QString FillAmountAndCurrency(int64 amount, const QString &currency) {
|| std::floor(value) != value)
? exponent
: 0;
result.append(prefix).append(FormatWithSeparators(
result.append(FormatWithSeparators(
value,
precision,
rule.decimal,