@@ -1,24 +0,0 @@
|
||||
#
|
||||
# Using the Size, Position and Padding style properties
|
||||
#
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
style.set_radius(5)
|
||||
|
||||
# Make a gradient
|
||||
style.set_width(150)
|
||||
style.set_height(lv.SIZE_CONTENT)
|
||||
|
||||
style.set_pad_ver(20)
|
||||
style.set_pad_left(5)
|
||||
|
||||
style.set_x(lv.pct(50))
|
||||
style.set_y(80)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
|
||||
label = lv.label(obj)
|
||||
label.set_text("Hello")
|
||||
|
||||
@@ -1,35 +0,0 @@
|
||||
#
|
||||
# Creating a transition
|
||||
#
|
||||
|
||||
props = [lv.STYLE.BG_COLOR, lv.STYLE.BORDER_COLOR, lv.STYLE.BORDER_WIDTH, 0]
|
||||
|
||||
# A default transition
|
||||
# Make it fast (100ms) and start with some delay (200 ms)
|
||||
|
||||
trans_def = lv.style_transition_dsc_t()
|
||||
trans_def.init(props, lv.anim_t.path_linear, 100, 200, None)
|
||||
|
||||
# A special transition when going to pressed state
|
||||
# Make it slow (500 ms) but start without delay
|
||||
|
||||
trans_pr = lv.style_transition_dsc_t()
|
||||
trans_pr.init(props, lv.anim_t.path_linear, 500, 0, None)
|
||||
|
||||
style_def = lv.style_t()
|
||||
style_def.init()
|
||||
style_def.set_transition(trans_def)
|
||||
|
||||
style_pr = lv.style_t()
|
||||
style_pr.init()
|
||||
style_pr.set_bg_color(lv.palette_main(lv.PALETTE.RED))
|
||||
style_pr.set_border_width(6)
|
||||
style_pr.set_border_color(lv.palette_darken(lv.PALETTE.RED, 3))
|
||||
style_pr.set_transition(trans_pr)
|
||||
|
||||
# Create an object with the new style_pr
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style_def, 0)
|
||||
obj.add_style(style_pr, lv.STATE.PRESSED)
|
||||
|
||||
obj.center()
|
||||
@@ -1,43 +0,0 @@
|
||||
#
|
||||
# Using multiple styles
|
||||
#
|
||||
# A base style
|
||||
|
||||
style_base = lv.style_t()
|
||||
style_base.init()
|
||||
style_base.set_bg_color(lv.palette_main(lv.PALETTE.LIGHT_BLUE))
|
||||
style_base.set_border_color(lv.palette_darken(lv.PALETTE.LIGHT_BLUE, 3))
|
||||
style_base.set_border_width(2)
|
||||
style_base.set_radius(10)
|
||||
style_base.set_shadow_width(10)
|
||||
style_base.set_shadow_offset_y(5)
|
||||
style_base.set_shadow_opa(lv.OPA._50)
|
||||
style_base.set_text_color(lv.color_white())
|
||||
style_base.set_width(100)
|
||||
style_base.set_height(lv.SIZE_CONTENT)
|
||||
|
||||
# Set only the properties that should be different
|
||||
style_warning = lv.style_t()
|
||||
style_warning.init()
|
||||
style_warning.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW))
|
||||
style_warning.set_border_color(lv.palette_darken(lv.PALETTE.YELLOW, 3))
|
||||
style_warning.set_text_color(lv.palette_darken(lv.PALETTE.YELLOW, 4))
|
||||
|
||||
# Create an object with the base style only
|
||||
obj_base = lv.obj(lv.screen_active())
|
||||
obj_base.add_style(style_base, 0)
|
||||
obj_base.align(lv.ALIGN.LEFT_MID, 20, 0)
|
||||
|
||||
label = lv.label(obj_base)
|
||||
label.set_text("Base")
|
||||
label.center()
|
||||
|
||||
# Create another object with the base style and earnings style too
|
||||
obj_warning = lv.obj(lv.screen_active())
|
||||
obj_warning.add_style(style_base, 0)
|
||||
obj_warning.add_style(style_warning, 0)
|
||||
obj_warning.align(lv.ALIGN.RIGHT_MID, -20, 0)
|
||||
|
||||
label = lv.label(obj_warning)
|
||||
label.set_text("Warning")
|
||||
label.center()
|
||||
@@ -1,17 +0,0 @@
|
||||
#
|
||||
# Local styles
|
||||
#
|
||||
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
style.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
|
||||
style.set_border_color(lv.palette_lighten(lv.PALETTE.GREEN, 3))
|
||||
style.set_border_width(3)
|
||||
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
|
||||
# Overwrite the background color locally
|
||||
obj.set_style_bg_color(lv.palette_main(lv.PALETTE.ORANGE), lv.PART.MAIN)
|
||||
|
||||
obj.center()
|
||||
@@ -1,22 +0,0 @@
|
||||
#
|
||||
# Add styles to parts and states
|
||||
#
|
||||
|
||||
style_indic = lv.style_t()
|
||||
style_indic.init()
|
||||
style_indic.set_bg_color(lv.palette_lighten(lv.PALETTE.RED, 3))
|
||||
style_indic.set_bg_grad_color(lv.palette_main(lv.PALETTE.RED))
|
||||
style_indic.set_bg_grad_dir(lv.GRAD_DIR.HOR)
|
||||
|
||||
style_indic_pr = lv.style_t()
|
||||
style_indic_pr.init()
|
||||
style_indic_pr.set_shadow_color(lv.palette_main(lv.PALETTE.RED))
|
||||
style_indic_pr.set_shadow_width(10)
|
||||
style_indic_pr.set_shadow_spread(3)
|
||||
|
||||
# Create an object with the new style_pr
|
||||
obj = lv.slider(lv.screen_active())
|
||||
obj.add_style(style_indic, lv.PART.INDICATOR)
|
||||
obj.add_style(style_indic_pr, lv.PART.INDICATOR | lv.STATE.PRESSED)
|
||||
obj.set_value(70, lv.ANIM.OFF)
|
||||
obj.center()
|
||||
@@ -1,55 +0,0 @@
|
||||
# Will be called when the styles of the base theme are already added
|
||||
# to add new styles
|
||||
|
||||
|
||||
class NewTheme(lv.theme_t):
|
||||
def __init__(self):
|
||||
super().__init__()
|
||||
# Initialize the styles
|
||||
self.style_button = lv.style_t()
|
||||
self.style_button.init()
|
||||
self.style_button.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
|
||||
self.style_button.set_border_color(lv.palette_darken(lv.PALETTE.GREEN, 3))
|
||||
self.style_button.set_border_width(3)
|
||||
|
||||
# This theme is based on active theme
|
||||
th_act = lv.theme_get_from_obj(lv.screen_active())
|
||||
# This theme will be applied only after base theme is applied
|
||||
self.set_parent(th_act)
|
||||
|
||||
|
||||
class ExampleStyle_14:
|
||||
|
||||
def __init__(self):
|
||||
#
|
||||
# Extending the current theme
|
||||
#
|
||||
|
||||
button = lv.button(lv.screen_active())
|
||||
button.align(lv.ALIGN.TOP_MID, 0, 20)
|
||||
|
||||
label = lv.label(button)
|
||||
label.set_text("Original theme")
|
||||
|
||||
self.new_theme_init_and_set()
|
||||
|
||||
button = lv.button(lv.screen_active())
|
||||
button.align(lv.ALIGN.BOTTOM_MID, 0, -20)
|
||||
|
||||
label = lv.label(button)
|
||||
label.set_text("New theme")
|
||||
|
||||
def new_theme_apply_cb(self, th, obj):
|
||||
print(th,obj)
|
||||
if obj.get_class() == lv.button_class:
|
||||
obj.add_style(self.th_new.style_button, 0)
|
||||
|
||||
def new_theme_init_and_set(self):
|
||||
print("new_theme_init_and_set")
|
||||
# Initialize the new theme from the current theme
|
||||
self.th_new = NewTheme()
|
||||
self.th_new.set_apply_cb(self.new_theme_apply_cb)
|
||||
lv.display_get_default().set_theme(self.th_new)
|
||||
|
||||
|
||||
exampleStyle_14 = ExampleStyle_14()
|
||||
@@ -1,39 +0,0 @@
|
||||
#
|
||||
# Opacity and Transformations
|
||||
#
|
||||
|
||||
# Normal button
|
||||
button = lv.button(lv.screen_active())
|
||||
button.set_size(100, 40)
|
||||
button.align(lv.ALIGN.CENTER, 0, -70)
|
||||
|
||||
label = lv.label(button)
|
||||
label.set_text("Normal")
|
||||
label.center()
|
||||
|
||||
# Set opacity
|
||||
# The button and the label is rendered to a layer first and that layer is blended
|
||||
button = lv.button(lv.screen_active())
|
||||
button.set_size(100, 40)
|
||||
button.set_style_opa(lv.OPA._50, 0)
|
||||
button.align(lv.ALIGN.CENTER, 0, 0)
|
||||
|
||||
label = lv.label(button)
|
||||
label.set_text("Opa:50%")
|
||||
label.center()
|
||||
|
||||
# Set transformations
|
||||
# The button and the label is rendered to a layer first and that layer is transformed
|
||||
button = lv.button(lv.screen_active())
|
||||
button.set_size(100, 40)
|
||||
button.set_style_transform_rotation(150, 0) # 15 deg
|
||||
button.set_style_transform_scale(256 + 64, 0) # 1.25x
|
||||
button.set_style_transform_pivot_x(50, 0)
|
||||
button.set_style_transform_pivot_y(20, 0)
|
||||
button.set_style_opa(lv.OPA._50, 0)
|
||||
button.align(lv.ALIGN.CENTER, 0, 70)
|
||||
|
||||
label = lv.label(button)
|
||||
label.set_text("Transf.")
|
||||
label.center()
|
||||
|
||||
@@ -1,21 +0,0 @@
|
||||
#
|
||||
# Using the background style properties
|
||||
#
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
style.set_radius(5)
|
||||
|
||||
# Make a gradient
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
|
||||
style.set_bg_grad_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_bg_grad_dir(lv.GRAD_DIR.VER)
|
||||
|
||||
# Shift the gradient to the bottom
|
||||
style.set_bg_main_stop(128)
|
||||
style.set_bg_grad_stop(192)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.center()
|
||||
@@ -1,21 +0,0 @@
|
||||
#
|
||||
# Using the border style properties
|
||||
#
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
# Set a background color and a radius
|
||||
style.set_radius(10)
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
|
||||
|
||||
# Add border to the bottom+right
|
||||
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_border_width(5)
|
||||
style.set_border_opa(lv.OPA._50)
|
||||
style.set_border_side(lv.BORDER_SIDE.BOTTOM | lv.BORDER_SIDE.RIGHT)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.center()
|
||||
@@ -1,21 +0,0 @@
|
||||
#
|
||||
# Using the outline style properties
|
||||
#
|
||||
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
# Set a background color and a radius
|
||||
style.set_radius(5)
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
|
||||
|
||||
# Add outline
|
||||
style.set_outline_width(2)
|
||||
style.set_outline_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_outline_pad(8)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.center()
|
||||
@@ -1,22 +0,0 @@
|
||||
#
|
||||
# Using the Shadow style properties
|
||||
#
|
||||
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
# Set a background color and a radius
|
||||
style.set_radius(5)
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
|
||||
|
||||
# Add a shadow
|
||||
style.set_shadow_width(8)
|
||||
style.set_shadow_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_shadow_offset_x(10)
|
||||
style.set_shadow_offset_y(20)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.obj(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.center()
|
||||
@@ -1,37 +0,0 @@
|
||||
# Create an image from the png file
|
||||
try:
|
||||
with open('../assets/img_cogwheel_argb.png', 'rb') as f:
|
||||
png_data = f.read()
|
||||
except:
|
||||
print("Could not find img_cogwheel_argb.png")
|
||||
sys.exit()
|
||||
|
||||
image_cogwheel_argb = lv.image_dsc_t({
|
||||
'data_size': len(png_data),
|
||||
'data': png_data
|
||||
})
|
||||
|
||||
#
|
||||
# Using the Image style properties
|
||||
#
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
# Set a background color and a radius
|
||||
style.set_radius(5)
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
|
||||
style.set_border_width(2)
|
||||
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
|
||||
style.set_image_recolor(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_image_recolor_opa(lv.OPA._50)
|
||||
style.set_transform_rotation(300)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.image(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
|
||||
obj.set_src(image_cogwheel_argb)
|
||||
|
||||
obj.center()
|
||||
@@ -1,13 +0,0 @@
|
||||
#
|
||||
# Using the Arc style properties
|
||||
#
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
style.set_arc_color(lv.palette_main(lv.PALETTE.RED))
|
||||
style.set_arc_width(4)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.arc(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.center()
|
||||
@@ -1,27 +0,0 @@
|
||||
#
|
||||
# Using the text style properties
|
||||
#
|
||||
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
style.set_radius(5)
|
||||
style.set_bg_opa(lv.OPA.COVER)
|
||||
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
|
||||
style.set_border_width(2)
|
||||
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_pad_all(10)
|
||||
|
||||
style.set_text_color(lv.palette_main(lv.PALETTE.BLUE))
|
||||
style.set_text_letter_space(5)
|
||||
style.set_text_line_space(20)
|
||||
style.set_text_decor(lv.TEXT_DECOR.UNDERLINE)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.label(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
obj.set_text("Text of\n"
|
||||
"a label")
|
||||
|
||||
obj.center()
|
||||
|
||||
@@ -1,21 +0,0 @@
|
||||
#
|
||||
# Using the line style properties
|
||||
#
|
||||
|
||||
style = lv.style_t()
|
||||
style.init()
|
||||
|
||||
style.set_line_color(lv.palette_main(lv.PALETTE.GREY))
|
||||
style.set_line_width(6)
|
||||
style.set_line_rounded(True)
|
||||
|
||||
# Create an object with the new style
|
||||
obj = lv.line(lv.screen_active())
|
||||
obj.add_style(style, 0)
|
||||
p = [ {"x":10, "y":30},
|
||||
{"x":30, "y":50},
|
||||
{"x":100, "y":0}]
|
||||
|
||||
obj.set_points(p, 3)
|
||||
|
||||
obj.center()
|
||||
Reference in New Issue
Block a user