sascha/esphome
1
0
Fork 0
mirror of https://github.com/esphome/esphome.git synced 2025-10-29 22:24:26 +00:00
Code Issues Releases Wiki Activity

[lvgl] Stage 4 (#7166)

Browse Source
This commit is contained in:
Clyde Stubbs
2024-08-05 15:07:05 +10:00
committed by GitHub
parent 87944f0c1b
commit d18bb34f87
28 changed files with 2002 additions and 579 deletions
Download Patch File Download Diff File Expand all files Collapse all files

343
tests/components/lvgl/lvgl-package.yaml
View File

@@ -5,142 +5,229 @@ lvgl:
- touchscreen_id: tft_touch
long_press_repeat_time: 200ms
long_press_time: 500ms
widgets:
- label:
id: hello_label
text: Hello world
text_color: 0xFF8000
align: center
text_font: montserrat_40
border_post: true
- label:
text: "Hello shiny day"
text_color: 0xFFFFFF
align: bottom_mid
text_font: space16
- obj:
align: center
arc_opa: COVER
arc_color: 0xFF0000
arc_rounded: false
arc_width: 3
anim_time: 1s
bg_color: light_blue
bg_grad_color: light_blue
bg_dither_mode: ordered
bg_grad_dir: hor
bg_grad_stop: 128
bg_image_opa: transp
bg_image_recolor: light_blue
bg_image_recolor_opa: 50%
bg_main_stop: 0
bg_opa: 20%
border_color: 0x00FF00
border_opa: cover
border_post: true
border_side: [bottom, left]
border_width: 4
clip_corner: false
height: 50%
image_recolor: light_blue
image_recolor_opa: cover
line_width: 10
line_dash_width: 10
line_dash_gap: 10
line_rounded: false
line_color: light_blue
opa: cover
opa_layered: cover
outline_color: light_blue
outline_opa: cover
outline_pad: 10px
outline_width: 10px
pad_all: 10px
pad_bottom: 10px
pad_column: 10px
pad_left: 10px
pad_right: 10px
pad_row: 10px
pad_top: 10px
shadow_color: light_blue
shadow_ofs_x: 5
shadow_ofs_y: 5
shadow_opa: cover
shadow_spread: 5
shadow_width: 10
text_align: auto
text_color: light_blue
text_decor: [underline, strikethrough]
text_font: montserrat_18
text_letter_space: 4
text_line_space: 4
text_opa: cover
transform_angle: 180
transform_height: 100
transform_pivot_x: 50%
transform_pivot_y: 50%
transform_zoom: 0.5
translate_x: 10
translate_y: 10
max_height: 100
max_width: 200
min_height: 20%
min_width: 20%
radius: circle
width: 10px
x: 100
y: 120
- button:
width: 20%
height: 10%
pressed:
bg_color: light_blue
checkable: true
checked:
bg_color: 0x000000
widgets:
- label:
text: Button
on_click:
lvgl.label.update:
pages:
- id: page1
skip: true
widgets:
- label:
id: hello_label
bg_color: 0x123456
text: clicked
on_value:
logger.log:
format: "state now %d"
args: [x]
on_short_click:
lvgl.widget.hide: hello_label
on_long_press:
lvgl.widget.show: hello_label
on_cancel:
lvgl.widget.enable: hello_label
on_ready:
lvgl.widget.disable: hello_label
on_defocus:
lvgl.widget.hide: hello_label
on_focus:
logger.log: Button clicked
on_scroll:
logger.log: Button clicked
on_scroll_end:
logger.log: Button clicked
on_scroll_begin:
logger.log: Button clicked
on_release:
logger.log: Button clicked
on_long_press_repeat:
logger.log: Button clicked
text: Hello world
text_color: 0xFF8000
align: center
text_font: montserrat_40
border_post: true
- label:
text: "Hello shiny day"
text_color: 0xFFFFFF
align: bottom_mid
text_font: space16
- obj:
align: center
arc_opa: COVER
arc_color: 0xFF0000
arc_rounded: false
arc_width: 3
anim_time: 1s
bg_color: light_blue
bg_grad_color: light_blue
bg_dither_mode: ordered
bg_grad_dir: hor
bg_grad_stop: 128
bg_image_opa: transp
bg_image_recolor: light_blue
bg_image_recolor_opa: 50%
bg_main_stop: 0
bg_opa: 20%
border_color: 0x00FF00
border_opa: cover
border_post: true
border_side: [bottom, left]
border_width: 4
clip_corner: false
height: 50%
image_recolor: light_blue
image_recolor_opa: cover
line_width: 10
line_dash_width: 10
line_dash_gap: 10
line_rounded: false
line_color: light_blue
opa: cover
opa_layered: cover
outline_color: light_blue
outline_opa: cover
outline_pad: 10px
outline_width: 10px
pad_all: 10px
pad_bottom: 10px
pad_column: 10px
pad_left: 10px
pad_right: 10px
pad_row: 10px
pad_top: 10px
shadow_color: light_blue
shadow_ofs_x: 5
shadow_ofs_y: 5
shadow_opa: cover
shadow_spread: 5
shadow_width: 10
text_align: auto
text_color: light_blue
text_decor: [underline, strikethrough]
text_font: montserrat_18
text_letter_space: 4
text_line_space: 4
text_opa: cover
transform_angle: 180
transform_height: 100
transform_pivot_x: 50%
transform_pivot_y: 50%
transform_zoom: 0.5
translate_x: 10
translate_y: 10
max_height: 100
max_width: 200
min_height: 20%
min_width: 20%
radius: circle
width: 10px
x: 100
y: 120
- button:
width: 20%
height: 10%
pressed:
bg_color: light_blue
checkable: true
checked:
bg_color: 0x000000
widgets:
- label:
text: Button
on_click:
lvgl.label.update:
id: hello_label
bg_color: 0x123456
text: clicked
on_value:
logger.log:
format: "state now %d"
args: [x]
on_short_click:
lvgl.widget.hide: hello_label
on_long_press:
lvgl.widget.show: hello_label
on_cancel:
lvgl.widget.enable: hello_label
on_ready:
lvgl.widget.disable: hello_label
on_defocus:
lvgl.widget.hide: hello_label
on_focus:
logger.log: Button clicked
on_scroll:
logger.log: Button clicked
on_scroll_end:
logger.log: Button clicked
on_scroll_begin:
logger.log: Button clicked
on_release:
logger.log: Button clicked
on_long_press_repeat:
logger.log: Button clicked
- led:
color: 0x00FF00
brightness: 50%
align: right_mid
- spinner:
arc_length: 120
spin_time: 2s
align: left_mid
- image:
src: cat_image
align: top_left
y: 50
- id: page2
widgets:
- arc:
align: left_mid
id: lv_arc
adjustable: true
on_value:
then:
- logger.log:
format: "Arc value is %f"
args: [x]
group: general
scroll_on_focus: true
value: 75
min_value: 1
max_value: 100
arc_color: 0xFF0000
indicator:
arc_color: 0xF000FF
pressed:
arc_color: 0xFFFF00
focused:
arc_color: 0x808080
- bar:
id: bar_id
align: top_mid
y: 20
value: 30
max_value: 100
min_value: 10
mode: range
on_click:
then:
- lvgl.bar.update:
id: bar_id
value: !lambda return (int)((float)rand() / RAND_MAX * 100);
- logger.log:
format: "bar value %f"
args: [x]
- line:
align: center
points:
- 5, 5
- 70, 70
- 120, 10
- 180, 60
- 240, 10
on_click:
lvgl.page.next:
- switch:
align: right_mid
- checkbox:
text: Checkbox
align: bottom_right
- slider:
id: slider_id
align: top_mid
y: 40
value: 30
max_value: 100
min_value: 10
mode: normal
on_value:
then:
- logger.log:
format: "slider value %f"
args: [x]
on_click:
then:
- lvgl.slider.update:
id: slider_id
value: !lambda return (int)((float)rand() / RAND_MAX * 100);
font:
- file: "gfonts://Roboto"
id: space16
bpp: 4
image:
- id: cat_img
- id: cat_image
resize: 256x48
file: $component_dir/logo-text.svg
- id: dog_img