From 36245b08066c037ec35f6f31fdcd3496458bc5e5 Mon Sep 17 00:00:00 2001 From: Justin Do Date: Thu, 25 Jul 2024 17:56:51 +0700 Subject: [PATCH] update some bug on send page --- ui/cryptomaterial/button.go | 21 ++++++---- ui/cryptomaterial/editor.go | 15 +++++-- ui/page/send/recipient.go | 5 ++- ui/page/send/send_amount.go | 4 ++ ui/page/send/send_confirm_modal.go | 67 ++++++++++-------------------- ui/values/localizable/en.go | 2 +- ui/values/localizable/es.go | 2 +- ui/values/localizable/fr.go | 2 +- 8 files changed, 57 insertions(+), 61 deletions(-) diff --git a/ui/cryptomaterial/button.go b/ui/cryptomaterial/button.go index cdce7f06b..e60da2e78 100644 --- a/ui/cryptomaterial/button.go +++ b/ui/cryptomaterial/button.go @@ -20,13 +20,14 @@ import ( type Button struct { material.ButtonStyle - th *Theme - label Label - clickable *widget.Clickable - isEnabled bool - disabledBackground color.NRGBA - disabledTextColor color.NRGBA - HighlightColor color.NRGBA + th *Theme + label Label + clickable *widget.Clickable + isEnabled bool + disabledBackground color.NRGBA + disabledTextColor color.NRGBA + HighlightColor color.NRGBA + isDisableHoverColor bool Margin layout.Inset } @@ -149,6 +150,10 @@ func (b *Button) Enabled() bool { return b.isEnabled } +func (b *Button) DisableHoverColor() { + b.isDisableHoverColor = true +} + func (b Button) Clicked(gtx C) bool { return b.clickable.Clicked(gtx) } @@ -198,7 +203,7 @@ func (b Button) buttonStyleLayout(gtx layout.Context, w layout.Widget) layout.Di if !b.Enabled() { b.setDisabledColors() background = b.disabledBackground - } else if b.clickable.Hovered() { + } else if b.clickable.Hovered() && !b.isDisableHoverColor { background = Hovered(b.HighlightColor) } diff --git a/ui/cryptomaterial/editor.go b/ui/cryptomaterial/editor.go index f2becb730..2a593d1ff 100644 --- a/ui/cryptomaterial/editor.go +++ b/ui/cryptomaterial/editor.go @@ -83,9 +83,10 @@ type Editor struct { isFirstFocus bool - submitted bool - changed bool - selected bool + submitted bool + changed bool + selected bool + isFocusShowHit bool } func (t *Theme) EditorPassword(editor *widget.Editor, hint string) Editor { @@ -224,6 +225,10 @@ func (e *Editor) Selected() bool { return selected } +func (e *Editor) AlwayShowHit() { + e.isFocusShowHit = true +} + func (e *Editor) Layout(gtx C) D { if e.isFirstFocus { e.isFirstFocus = false @@ -280,7 +285,9 @@ func (e *Editor) layout(gtx C) D { if focused { e.TitleLabel.Text = e.Hint e.TitleLabel.Color, e.LineColor = e.t.Color.Primary, e.t.Color.Primary - e.Hint = "" + if !e.isFocusShowHit { + e.Hint = "" + } } if e.IsRequired && !focused && e.Editor.Len() == 0 { diff --git a/ui/page/send/recipient.go b/ui/page/send/recipient.go index 9e98780ba..d9119ee03 100644 --- a/ui/page/send/recipient.go +++ b/ui/page/send/recipient.go @@ -52,6 +52,7 @@ func newRecipient(l *load.Load, selectedWallet sharedW.Asset, pageParam getPageF // Set the maximum characters the editor can accept. rp.description.Editor.MaxLen = MaxTxLabelSize rp.description.TextSize = values.TextSizeTransform(l.IsMobileView(), values.TextSize16) + rp.description.AlwayShowHit() return rp } @@ -246,7 +247,7 @@ func (rp *recipient) topLayout(gtx C, index int) D { return layout.Flex{}.Layout(gtx, layout.Rigid(titleTxt.Layout), layout.Flexed(1, func(gtx C) D { - return layout.E.Layout(gtx, func(gtx layout.Context) layout.Dimensions { + return layout.E.Layout(gtx, func(gtx C) D { return rp.deleteBtn.Layout(gtx, rp.Theme.NewIcon(rp.Theme.Icons.ChevronLeft).Layout20dp) }) }), @@ -318,7 +319,7 @@ func (rp *recipient) addressAndAmountlayout(gtx C) D { return icon.Layout(gtx, values.MarginPadding16) }) }), - layout.Flexed(0.45, func(gtx layout.Context) layout.Dimensions { + layout.Flexed(0.45, func(gtx C) D { if rp.amount.amountEditor.HasError() { gtx.Constraints.Min.Y = amountHeight } diff --git a/ui/page/send/send_amount.go b/ui/page/send/send_amount.go index 7317623f8..7b194383b 100644 --- a/ui/page/send/send_amount.go +++ b/ui/page/send/send_amount.go @@ -47,20 +47,24 @@ func newSendAmount(theme *cryptomaterial.Theme, assetType libUtil.AssetType) *se sa.amountEditor.HasCustomButton = true sa.amountEditor.Editor.SingleLine = true sa.amountEditor.IsTitleLabel = false + sa.amountEditor.AlwayShowHit() sa.amountEditor.CustomButton.Inset = layout.UniformInset(values.MarginPadding2) sa.amountEditor.CustomButton.Text = values.String(values.StrMax) sa.amountEditor.CustomButton.CornerRadius = values.MarginPadding0 + sa.amountEditor.CustomButton.DisableHoverColor() sa.usdAmountEditor = theme.Editor(new(widget.Editor), values.String(values.StrAmount)+" (USD)") sa.usdAmountEditor.Editor.SetText("") sa.usdAmountEditor.HasCustomButton = true sa.usdAmountEditor.Editor.SingleLine = true sa.usdAmountEditor.IsTitleLabel = false + sa.usdAmountEditor.AlwayShowHit() sa.usdAmountEditor.CustomButton.Inset = layout.UniformInset(values.MarginPadding2) sa.usdAmountEditor.CustomButton.Text = values.String(values.StrMax) sa.usdAmountEditor.CustomButton.CornerRadius = values.MarginPadding0 + sa.usdAmountEditor.CustomButton.DisableHoverColor() sa.styleWidgets() diff --git a/ui/page/send/send_confirm_modal.go b/ui/page/send/send_confirm_modal.go index 64c9f33eb..7bd5bfb96 100644 --- a/ui/page/send/send_confirm_modal.go +++ b/ui/page/send/send_confirm_modal.go @@ -102,23 +102,12 @@ func (scm *sendConfirmModal) broadcastTransaction() { } func (scm *sendConfirmModal) Handle(gtx C) { - for { - event, ok := scm.passwordEditor.Editor.Update(gtx) - if !ok { - break - } - - if gtx.Source.Focused(scm.passwordEditor.Editor) { - switch event.(type) { - case widget.ChangeEvent: - scm.confirmButton.SetEnabled(scm.passwordEditor.Editor.Text() != "") - case widget.SubmitEvent: - scm.broadcastTransaction() - } - } + if scm.passwordEditor.Changed() { + scm.confirmButton.SetEnabled(scm.passwordEditor.Editor.Text() != "") + scm.passwordEditor.SetError("") } - if scm.confirmButton.Clicked(gtx) { + if scm.passwordEditor.Submitted() || scm.confirmButton.Clicked(gtx) { scm.broadcastTransaction() } @@ -130,11 +119,11 @@ func (scm *sendConfirmModal) Handle(gtx C) { } func (scm *sendConfirmModal) Layout(gtx C) D { + dp16 := values.MarginPadding16 w := []layout.Widget{ func(gtx C) D { scm.SetPadding(unit.Dp(0)) min := gtx.Constraints.Min - return layout.Stack{Alignment: layout.Center}.Layout(gtx, layout.Expanded(func(gtx C) D { defer clip.RRect{ @@ -151,8 +140,7 @@ func (scm *sendConfirmModal) Layout(gtx C) D { }), layout.Stacked(func(gtx C) D { gtx.Constraints.Min = min - - return layout.Inset{Top: values.MarginPadding24, Bottom: values.MarginPadding16}.Layout(gtx, func(gtx C) D { + return layout.Inset{Top: values.MarginPadding24, Bottom: dp16}.Layout(gtx, func(gtx C) D { return layout.Flex{Axis: layout.Vertical}.Layout(gtx, layout.Rigid(func(gtx C) D { return layout.Flex{Axis: layout.Vertical}.Layout(gtx, @@ -165,17 +153,13 @@ func (scm *sendConfirmModal) Layout(gtx C) D { layout.Rigid(func(gtx C) D { sendInfoLabel := scm.Theme.Label(unit.Sp(16), values.String(values.StrSendConfModalTitle)) return layout.Inset{Top: values.MarginPadding2}.Layout(gtx, func(gtx C) D { - return layout.Center.Layout(gtx, func(gtx C) D { - return sendInfoLabel.Layout(gtx) - }) + return layout.Center.Layout(gtx, sendInfoLabel.Layout) }) }), layout.Rigid(func(gtx C) D { balLabel := scm.Theme.Label(unit.Sp(24), scm.sendAmount+" ("+scm.sendAmountUSD+")") return layout.Inset{Top: values.MarginPadding2}.Layout(gtx, func(gtx C) D { - return layout.Center.Layout(gtx, func(gtx C) D { - return balLabel.Layout(gtx) - }) + return layout.Center.Layout(gtx, balLabel.Layout) }) }), ) @@ -187,8 +171,8 @@ func (scm *sendConfirmModal) Layout(gtx C) D { }, func(gtx C) D { return layout.Inset{ - Left: values.MarginPadding16, - Top: values.MarginPadding16, Right: values.MarginPadding16, + Left: dp16, + Top: dp16, Right: dp16, }.Layout(gtx, func(gtx C) D { return layout.Flex{Axis: layout.Vertical}.Layout(gtx, layout.Rigid(func(gtx C) D { @@ -201,12 +185,10 @@ func (scm *sendConfirmModal) Layout(gtx C) D { }), layout.Rigid(scm.setWalletLogo), layout.Rigid(func(gtx C) D { - return layout.Inset{}.Layout(gtx, func(gtx C) D { - txt := scm.Theme.Label(unit.Sp(16), sendWallet.GetWalletName()) - txt.Color = scm.Theme.Color.Text - txt.Font.Weight = font.Medium - return txt.Layout(gtx) - }) + txt := scm.Theme.Label(unit.Sp(16), sendWallet.GetWalletName()) + txt.Color = scm.Theme.Color.Text + txt.Font.Weight = font.Medium + return txt.Layout(gtx) }), layout.Rigid(func(gtx C) D { card := scm.Theme.Card() @@ -217,11 +199,9 @@ func (scm *sendConfirmModal) Layout(gtx C) D { } return inset.Layout(gtx, func(gtx C) D { return card.Layout(gtx, func(gtx C) D { - return layout.UniformInset(values.MarginPadding2).Layout(gtx, func(gtx C) D { - txt := scm.Theme.Caption(scm.sourceAccount.Name) - txt.Color = scm.Theme.Color.GrayText1 - return txt.Layout(gtx) - }) + txt := scm.Theme.Caption(scm.sourceAccount.Name) + txt.Color = scm.Theme.Color.GrayText1 + return layout.UniformInset(values.MarginPadding2).Layout(gtx, txt.Layout) }) }) }), @@ -233,7 +213,7 @@ func (scm *sendConfirmModal) Layout(gtx C) D { }) }), layout.Rigid(func(gtx C) D { - return layout.Flex{Axis: layout.Horizontal}.Layout(gtx, + return layout.Flex{Alignment: layout.Middle}.Layout(gtx, layout.Rigid(func(gtx C) D { txt := scm.Theme.Body2(values.String(values.StrTo)) txt.Color = scm.Theme.Color.GrayText2 @@ -242,16 +222,15 @@ func (scm *sendConfirmModal) Layout(gtx C) D { layout.Rigid(scm.toDestinationLayout), ) }), - layout.Rigid(func(gtx C) D { - return layout.Inset{Top: values.MarginPadding8}.Layout(gtx, scm.Theme.Separator().Layout) - }), + layout.Rigid(layout.Spacer{Height: values.MarginPadding8}.Layout), + layout.Rigid(scm.Theme.Separator().Layout), + layout.Rigid(layout.Spacer{Height: values.MarginPadding8}.Layout), layout.Rigid(func(gtx C) D { return layout.Inset{Bottom: values.MarginPadding8}.Layout(gtx, func(gtx C) D { txFeeText := scm.txFee if scm.exchangeRateSet { txFeeText = fmt.Sprintf("%s (%s)", scm.txFee, scm.txFeeUSD) } - return scm.contentRow(gtx, values.String(values.StrFee), txFeeText, "") }) }), @@ -266,10 +245,10 @@ func (scm *sendConfirmModal) Layout(gtx C) D { }) }, func(gtx C) D { - return layout.Inset{Left: values.MarginPadding16, Right: values.MarginPadding16}.Layout(gtx, scm.passwordEditor.Layout) + return layout.Inset{Left: dp16, Right: dp16}.Layout(gtx, scm.passwordEditor.Layout) }, func(gtx C) D { - return layout.Inset{Left: values.MarginPadding16, Right: values.MarginPadding16, Bottom: values.MarginPadding16}.Layout(gtx, func(gtx C) D { + return layout.Inset{Left: dp16, Right: dp16, Bottom: dp16}.Layout(gtx, func(gtx C) D { return layout.E.Layout(gtx, func(gtx C) D { return layout.Flex{Axis: layout.Horizontal}.Layout(gtx, layout.Rigid(func(gtx C) D { diff --git a/ui/values/localizable/en.go b/ui/values/localizable/en.go index b0183db6f..f2148f31f 100644 --- a/ui/values/localizable/en.go +++ b/ui/values/localizable/en.go @@ -335,7 +335,7 @@ const EN = ` "manual" = "Manual" "manualSetUp" = "Manual Setup" "maturity" = "Maturity" -"max" = "MAX" +"max" = "Max" "message" = "Message" "minimumAssetType" = "Multiple coin type wallets are required for the exchange functionality." "minMax" = "Min: %f . Max: %f" diff --git a/ui/values/localizable/es.go b/ui/values/localizable/es.go index 8dd09e66e..717bb0df5 100644 --- a/ui/values/localizable/es.go +++ b/ui/values/localizable/es.go @@ -372,7 +372,7 @@ const ES = ` "proposalInfo" = "Las propuestas y las notificaciones de cortesía se pueden habilitar o deshabilitar desde la página de configuración". "selectTicket" = "Seleccione un boleto para votar" "hash" = "Picadillo" -"max" = "MAX" +"max" = "Max" "noValidWalletFound" = "no se encontró una billetera válida" "securityTools" = "Herramientas de seguridad" "about" = "Acerca de" diff --git a/ui/values/localizable/fr.go b/ui/values/localizable/fr.go index fbc5cfd2c..de95bf73c 100644 --- a/ui/values/localizable/fr.go +++ b/ui/values/localizable/fr.go @@ -350,7 +350,7 @@ const FR = ` "proposalInfo" = "Les propositions et les notifications politeia peuvent être activées ou désactivées à partir de la page des paramètres." "selectTicket" = "Sélectionnez un ticket pour voter" "hash" = "Hacher" -"max" = "MAX" +"max" = "Max" "noValidWalletFound" = "aucun portefeuille valide trouvé" "securityTools" = "Outils de sécurité" "about" = "Sur"