mirror of
https://github.com/trezor/trezor-firmware.git
synced 2025-06-21 07:28:46 +00:00
apps/managment/wipe: style btns and elements
This commit is contained in:
parent
dc5049a3d6
commit
b64be539d4
@ -8,10 +8,13 @@ async def layout_wipe_device(ctx, msg):
|
|||||||
from ..common import storage
|
from ..common import storage
|
||||||
|
|
||||||
await hold_to_confirm(ctx, Text(
|
await hold_to_confirm(ctx, Text(
|
||||||
'WIPE DEVICE',
|
'Wipe device',
|
||||||
ui.ICON_WIPE,
|
ui.ICON_WIPE,
|
||||||
ui.NORMAL, 'Do you really want to', 'wipe the device?',
|
ui.NORMAL, 'Do you really want to', 'wipe the device?',
|
||||||
ui.NORMAL, '', 'All data will be lost.'))
|
ui.NORMAL, '', 'All data will be lost.',
|
||||||
|
icon_color=ui.RED),
|
||||||
|
button_style=ui.BTN_CANCEL,
|
||||||
|
loader_style=ui.LDR_DANGER)
|
||||||
|
|
||||||
storage.wipe()
|
storage.wipe()
|
||||||
|
|
||||||
|
@ -112,7 +112,7 @@ def header(title: str,
|
|||||||
bg: int=BG,
|
bg: int=BG,
|
||||||
ifg: int=BG):
|
ifg: int=BG):
|
||||||
if icon is not None:
|
if icon is not None:
|
||||||
display.icon(14, 18, res.load(icon), ifg, bg)
|
display.icon(14, 16, res.load(icon), ifg, bg)
|
||||||
display.text(44, 35, title, BOLD, fg, bg)
|
display.text(44, 35, title, BOLD, fg, bg)
|
||||||
|
|
||||||
|
|
||||||
|
@ -21,16 +21,12 @@ BORDER = const(4) # border size in pixels
|
|||||||
|
|
||||||
class Button(Widget):
|
class Button(Widget):
|
||||||
|
|
||||||
def __init__(self, area, content,
|
def __init__(self, area, content, style=ui.BTN_KEY, absolute=False):
|
||||||
normal_style=None,
|
|
||||||
active_style=None,
|
|
||||||
disabled_style=None,
|
|
||||||
absolute=False):
|
|
||||||
self.area = area
|
self.area = area
|
||||||
self.content = content
|
self.content = content
|
||||||
self.normal_style = normal_style or ui.BTN_KEY
|
self.normal_style = style['normal'] or ui.BTN_KEY['normal']
|
||||||
self.active_style = active_style or ui.BTN_KEY_ACTIVE
|
self.active_style = style['active'] or ui.BTN_KEY['active']
|
||||||
self.disabled_style = disabled_style or ui.BTN_KEY_DISABLED
|
self.disabled_style = style['disabled'] or ui.BTN_KEY['disabled']
|
||||||
self.absolute = absolute
|
self.absolute = absolute
|
||||||
self.state = BTN_DIRTY
|
self.state = BTN_DIRTY
|
||||||
|
|
||||||
|
@ -1,8 +1,7 @@
|
|||||||
from micropython import const
|
from micropython import const
|
||||||
from trezor import loop
|
from trezor import loop, res, ui
|
||||||
from trezor import ui, res
|
|
||||||
from trezor.ui import Widget
|
from trezor.ui import Widget
|
||||||
from trezor.ui.button import Button, BTN_CLICKED, BTN_STARTED, BTN_ACTIVE
|
from trezor.ui.button import BTN_ACTIVE, BTN_CLICKED, BTN_STARTED, Button
|
||||||
from trezor.ui.loader import Loader
|
from trezor.ui.loader import Loader
|
||||||
|
|
||||||
CONFIRMED = const(1)
|
CONFIRMED = const(1)
|
||||||
@ -16,16 +15,13 @@ class ConfirmDialog(Widget):
|
|||||||
def __init__(self, content, confirm=DEFAULT_CONFIRM, cancel=DEFAULT_CANCEL):
|
def __init__(self, content, confirm=DEFAULT_CONFIRM, cancel=DEFAULT_CANCEL):
|
||||||
self.content = content
|
self.content = content
|
||||||
if cancel is not None:
|
if cancel is not None:
|
||||||
self.confirm = Button(ui.grid(9, n_x=2), confirm,
|
self.confirm = Button(
|
||||||
normal_style=ui.BTN_CONFIRM,
|
ui.grid(9, n_x=2), confirm, style=ui.BTN_CONFIRM)
|
||||||
active_style=ui.BTN_CONFIRM_ACTIVE)
|
self.cancel = Button(
|
||||||
self.cancel = Button(ui.grid(8, n_x=2), cancel,
|
ui.grid(8, n_x=2), cancel, style=ui.BTN_CANCEL)
|
||||||
normal_style=ui.BTN_CANCEL,
|
|
||||||
active_style=ui.BTN_CANCEL_ACTIVE)
|
|
||||||
else:
|
else:
|
||||||
self.confirm = Button(ui.grid(4, n_x=1), confirm,
|
self.confirm = Button(
|
||||||
normal_style=ui.BTN_CONFIRM,
|
ui.grid(4, n_x=1), confirm, style=ui.BTN_CONFIRM)
|
||||||
active_style=ui.BTN_CONFIRM_ACTIVE)
|
|
||||||
self.cancel = None
|
self.cancel = None
|
||||||
|
|
||||||
def render(self):
|
def render(self):
|
||||||
@ -50,12 +46,14 @@ _STOPPED = const(-2)
|
|||||||
|
|
||||||
class HoldToConfirmDialog(Widget):
|
class HoldToConfirmDialog(Widget):
|
||||||
|
|
||||||
def __init__(self, content, hold='Hold to confirm', *args, **kwargs):
|
def __init__(self,
|
||||||
|
content,
|
||||||
|
hold='Hold to confirm',
|
||||||
|
button_style=ui.BTN_CONFIRM,
|
||||||
|
loader_style=ui.LDR_DEFAULT):
|
||||||
self.content = content
|
self.content = content
|
||||||
self.button = Button(ui.grid(4, n_x=1), hold,
|
self.button = Button(ui.grid(4, n_x=1), hold, style=button_style)
|
||||||
normal_style=ui.BTN_CONFIRM,
|
self.loader = Loader(style=loader_style)
|
||||||
active_style=ui.BTN_CONFIRM_ACTIVE)
|
|
||||||
self.loader = Loader(*args, **kwargs)
|
|
||||||
|
|
||||||
def render(self):
|
def render(self):
|
||||||
self.button.render()
|
self.button.render()
|
||||||
|
@ -6,10 +6,10 @@ from trezor.ui.button import Button, BTN_CLICKED, ICON
|
|||||||
|
|
||||||
def key_buttons():
|
def key_buttons():
|
||||||
keys = ['abc', 'def', 'ghi', 'jkl', 'mno', 'pqr', 'stu', 'vwx', 'yz']
|
keys = ['abc', 'def', 'ghi', 'jkl', 'mno', 'pqr', 'stu', 'vwx', 'yz']
|
||||||
return [Button(ui.grid(i + 3, n_y=4), k,
|
return [
|
||||||
normal_style=ui.BTN_KEY,
|
Button(ui.grid(i + 3, n_y=4), k, style=ui.BTN_KEY)
|
||||||
active_style=ui.BTN_KEY_ACTIVE,
|
for i, k in enumerate(keys)
|
||||||
disabled_style=ui.BTN_KEY_DISABLED) for i, k in enumerate(keys)]
|
]
|
||||||
|
|
||||||
|
|
||||||
def compute_mask(text: str) -> int:
|
def compute_mask(text: str) -> int:
|
||||||
@ -30,19 +30,19 @@ class Input(Button):
|
|||||||
self.pending = False
|
self.pending = False
|
||||||
|
|
||||||
def edit(self, content: str, word: str, pending: bool):
|
def edit(self, content: str, word: str, pending: bool):
|
||||||
self.content = content
|
|
||||||
self.word = word
|
self.word = word
|
||||||
|
self.content = content
|
||||||
self.pending = pending
|
self.pending = pending
|
||||||
self.taint()
|
self.taint()
|
||||||
if content == word: # confirm button
|
if content == word: # confirm button
|
||||||
self.enable()
|
self.enable()
|
||||||
self.normal_style = ui.BTN_CONFIRM
|
self.normal_style = ui.BTN_CONFIRM['normal']
|
||||||
self.active_style = ui.BTN_CONFIRM_ACTIVE
|
self.active_style = ui.BTN_CONFIRM['active']
|
||||||
self.icon = ui.ICON_CONFIRM
|
self.icon = ui.ICON_CONFIRM
|
||||||
elif word: # auto-complete button
|
elif word: # auto-complete button
|
||||||
self.enable()
|
self.enable()
|
||||||
self.normal_style = ui.BTN_KEY
|
self.normal_style = ui.BTN_KEY['normal']
|
||||||
self.active_style = ui.BTN_KEY_ACTIVE
|
self.active_style = ui.BTN_KEY['active']
|
||||||
self.icon = ui.ICON_CLICK
|
self.icon = ui.ICON_CLICK
|
||||||
else: # disabled button
|
else: # disabled button
|
||||||
self.disable()
|
self.disable()
|
||||||
@ -83,8 +83,7 @@ class MnemonicKeyboard(ui.Widget):
|
|||||||
self.input = Input(ui.grid(1, n_x=4, n_y=4, cells_x=3), '', '')
|
self.input = Input(ui.grid(1, n_x=4, n_y=4, cells_x=3), '', '')
|
||||||
self.back = Button(ui.grid(0, n_x=4, n_y=4),
|
self.back = Button(ui.grid(0, n_x=4, n_y=4),
|
||||||
res.load(ui.ICON_BACK),
|
res.load(ui.ICON_BACK),
|
||||||
normal_style=ui.BTN_CLEAR,
|
style=ui.BTN_CLEAR)
|
||||||
active_style=ui.BTN_CLEAR_ACTIVE)
|
|
||||||
self.keys = key_buttons()
|
self.keys = key_buttons()
|
||||||
self.pbutton = None # pending key button
|
self.pbutton = None # pending key button
|
||||||
self.pindex = 0 # index of current pending char in pbutton
|
self.pindex = 0 # index of current pending char in pbutton
|
||||||
|
@ -7,11 +7,11 @@ from trezor import res
|
|||||||
|
|
||||||
class Loader(ui.Widget):
|
class Loader(ui.Widget):
|
||||||
|
|
||||||
def __init__(self, target_ms=1000, normal_style=None, active_style=None):
|
def __init__(self, target_ms=1000, style=ui.LDR_DEFAULT):
|
||||||
self.target_ms = target_ms
|
self.target_ms = target_ms
|
||||||
self.start_ticks_ms = None
|
self.start_ticks_ms = None
|
||||||
self.normal_style = normal_style or ui.LDR_DEFAULT
|
self.normal_style = style['normal'] or ui.LDR_DEFAULT['normal']
|
||||||
self.active_style = active_style or ui.LDR_DEFAULT_ACTIVE
|
self.active_style = style['active'] or ui.LDR_DEFAULT['active']
|
||||||
|
|
||||||
def start(self):
|
def start(self):
|
||||||
self.start_ticks_ms = utime.ticks_ms()
|
self.start_ticks_ms = utime.ticks_ms()
|
||||||
|
@ -60,100 +60,152 @@ ICON_SWIPE = 'trezor/res/swipedown.toig'
|
|||||||
|
|
||||||
# buttons
|
# buttons
|
||||||
BTN_DEFAULT = {
|
BTN_DEFAULT = {
|
||||||
|
'normal': {
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': FG,
|
'fg-color': FG,
|
||||||
'text-style': NORMAL,
|
'text-style': NORMAL,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_DEFAULT_ACTIVE = {
|
'active': {
|
||||||
'bg-color': FG,
|
'bg-color': FG,
|
||||||
'fg-color': BG,
|
'fg-color': BG,
|
||||||
'text-style': BOLD,
|
'text-style': BOLD,
|
||||||
'border-color': FG,
|
'border-color': FG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_DEFAULT_DISABLED = {
|
'disabled': {
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': GREY,
|
'fg-color': GREY,
|
||||||
'text-style': NORMAL,
|
'text-style': NORMAL,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
BTN_CANCEL = {
|
BTN_CANCEL = {
|
||||||
|
'normal': {
|
||||||
'bg-color': RED,
|
'bg-color': RED,
|
||||||
'fg-color': FG,
|
'fg-color': FG,
|
||||||
'text-style': BOLD,
|
'text-style': BOLD,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_CANCEL_ACTIVE = {
|
'active': {
|
||||||
'bg-color': FG,
|
'bg-color': FG,
|
||||||
'fg-color': RED,
|
'fg-color': RED,
|
||||||
'text-style': BOLD,
|
'text-style': BOLD,
|
||||||
'border-color': FG,
|
'border-color': FG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
|
},
|
||||||
|
'disabled': {
|
||||||
|
'bg-color': BG,
|
||||||
|
'fg-color': GREY,
|
||||||
|
'text-style': NORMAL,
|
||||||
|
'border-color': BG,
|
||||||
|
'radius': RADIUS,
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
BTN_CONFIRM = {
|
BTN_CONFIRM = {
|
||||||
|
'normal': {
|
||||||
'bg-color': GREEN,
|
'bg-color': GREEN,
|
||||||
'fg-color': FG,
|
'fg-color': FG,
|
||||||
'text-style': BOLD,
|
'text-style': BOLD,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_CONFIRM_ACTIVE = {
|
'active': {
|
||||||
'bg-color': FG,
|
'bg-color': FG,
|
||||||
'fg-color': GREEN,
|
'fg-color': GREEN,
|
||||||
'text-style': BOLD,
|
'text-style': BOLD,
|
||||||
'border-color': FG,
|
'border-color': FG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
|
},
|
||||||
|
'disabled': {
|
||||||
|
'bg-color': BG,
|
||||||
|
'fg-color': GREY,
|
||||||
|
'text-style': NORMAL,
|
||||||
|
'border-color': BG,
|
||||||
|
'radius': RADIUS,
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
BTN_CLEAR = {
|
BTN_CLEAR = {
|
||||||
|
'normal': {
|
||||||
'bg-color': ORANGE,
|
'bg-color': ORANGE,
|
||||||
'fg-color': FG,
|
'fg-color': FG,
|
||||||
'text-style': NORMAL,
|
'text-style': NORMAL,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_CLEAR_ACTIVE = {
|
'active': {
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': GREY,
|
'fg-color': GREY,
|
||||||
'text-style': NORMAL,
|
'text-style': NORMAL,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
},
|
||||||
BTN_KEY = {
|
'disabled': {
|
||||||
'bg-color': BLACKISH,
|
|
||||||
'fg-color': FG,
|
|
||||||
'text-style': MONO,
|
|
||||||
'border-color': BG,
|
|
||||||
'radius': RADIUS,
|
|
||||||
}
|
|
||||||
BTN_KEY_ACTIVE = {
|
|
||||||
'bg-color': FG,
|
|
||||||
'fg-color': BLACKISH,
|
|
||||||
'text-style': MONO,
|
|
||||||
'border-color': FG,
|
|
||||||
'radius': RADIUS,
|
|
||||||
}
|
|
||||||
BTN_KEY_DISABLED = {
|
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': GREY,
|
'fg-color': GREY,
|
||||||
'text-style': MONO,
|
'text-style': MONO,
|
||||||
'border-color': BG,
|
'border-color': BG,
|
||||||
'radius': RADIUS,
|
'radius': RADIUS,
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
BTN_KEY = {
|
||||||
|
'normal': {
|
||||||
|
'bg-color': BLACKISH,
|
||||||
|
'fg-color': FG,
|
||||||
|
'text-style': MONO,
|
||||||
|
'border-color': BG,
|
||||||
|
'radius': RADIUS,
|
||||||
|
},
|
||||||
|
'active': {
|
||||||
|
'bg-color': FG,
|
||||||
|
'fg-color': BLACKISH,
|
||||||
|
'text-style': MONO,
|
||||||
|
'border-color': FG,
|
||||||
|
'radius': RADIUS,
|
||||||
|
},
|
||||||
|
'disabled': {
|
||||||
|
'bg-color': BG,
|
||||||
|
'fg-color': GREY,
|
||||||
|
'text-style': MONO,
|
||||||
|
'border-color': BG,
|
||||||
|
'radius': RADIUS,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
# loader
|
# loader
|
||||||
LDR_DEFAULT = {
|
LDR_DEFAULT = {
|
||||||
|
'normal': {
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': GREEN,
|
'fg-color': GREEN,
|
||||||
'icon': None,
|
'icon': None,
|
||||||
'icon-fg-color': None,
|
'icon-fg-color': None,
|
||||||
}
|
},
|
||||||
LDR_DEFAULT_ACTIVE = {
|
'active': {
|
||||||
'bg-color': BG,
|
'bg-color': BG,
|
||||||
'fg-color': GREEN,
|
'fg-color': GREEN,
|
||||||
'icon': ICON_SEND,
|
'icon': ICON_SEND,
|
||||||
'icon-fg-color': WHITE,
|
'icon-fg-color': WHITE,
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
LDR_DANGER = {
|
||||||
|
'normal': {
|
||||||
|
'bg-color': BG,
|
||||||
|
'fg-color': RED,
|
||||||
|
'icon': None,
|
||||||
|
'icon-fg-color': None,
|
||||||
|
},
|
||||||
|
'active': {
|
||||||
|
'bg-color': BG,
|
||||||
|
'fg-color': RED,
|
||||||
|
'icon': ICON_SEND,
|
||||||
|
'icon-fg-color': WHITE,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user