-
-
Save clydebarrow/9d2cffd739cb844e9d6d5005fd29518d to your computer and use it in GitHub Desktop.
| # Gitignore settings for ESPHome | |
| # This is an example and may include too much for your use-case. | |
| # You can modify this file to suit your needs. | |
| /.esphome/ | |
| /secrets.yaml | |
| /wifi.yaml |
| # Before asking any questions - read the docs!: https://deploy-preview-3510--esphome.netlify.app/components/lvgl.html | |
| esphome: | |
| name: t-embed | |
| friendly_name: LVGL Test on T-Embed | |
| platformio_options: | |
| board_build.flash_mode: dio | |
| esp32: | |
| board: esp32-s3-devkitc-1 | |
| variant: esp32s3 | |
| framework: | |
| type: esp-idf | |
| logger: | |
| level: DEBUG | |
| hardware_uart: USB_SERIAL_JTAG | |
| ota: | |
| password: !secret ota_password | |
| wifi: !include wifi.yaml | |
| external_components: | |
| - source: github://clydebarrow/esphome@lvgl | |
| components: [ lvgl ] | |
| power_supply: | |
| - id: power_on | |
| enable_on_boot: true | |
| pin: | |
| ignore_strapping_warning: true | |
| number: GPIO46 | |
| spi: | |
| clk_pin: GPIO12 | |
| mosi_pin: GPIO11 | |
| interface: hardware | |
| output: | |
| - platform: ledc | |
| pin: | |
| number: GPIO15 | |
| id: backlight_output | |
| light: | |
| - platform: monochromatic | |
| output: backlight_output | |
| name: LCD Backlight | |
| id: led | |
| restore_mode: ALWAYS_ON | |
| default_transition_length: 0s | |
| display: | |
| - platform: ili9xxx | |
| id: lcd_display | |
| model: st7789v | |
| dimensions: | |
| height: 170 | |
| width: 320 | |
| offset_height: 35 | |
| offset_width: 0 | |
| transform: | |
| swap_xy: true | |
| mirror_x: false | |
| mirror_y: true | |
| data_rate: 80MHz | |
| cs_pin: 10 | |
| dc_pin: GPIO13 | |
| reset_pin: GPIO9 | |
| update_interval: never | |
| auto_clear_enabled: false | |
| invert_colors: true | |
| sensor: | |
| - platform: rotary_encoder | |
| name: "Rotary Encoder" | |
| id: encoder | |
| pin_a: 2 | |
| pin_b: 1 | |
| internal: true | |
| binary_sensor: | |
| - platform: gpio | |
| id: pushbutton | |
| name: Pushbutton | |
| pin: | |
| number: 0 | |
| inverted: true | |
| ignore_strapping_warning: true | |
| time: | |
| - platform: sntp | |
| id: time_comp | |
| on_time_sync: | |
| then: | |
| - script.execute: time_update | |
| script: | |
| - id: time_update | |
| then: | |
| - lvgl.indicator.line.update: | |
| id: minute_hand | |
| value: !lambda |- | |
| return id(time_comp).now().minute; | |
| - lvgl.indicator.line.update: | |
| id: hour_hand | |
| value: !lambda |- | |
| auto now = id(time_comp).now(); | |
| return std::fmod(now.hour, 12) * 60 + now.minute; | |
| - lvgl.label.update: | |
| id: date_label | |
| text: !lambda |- | |
| static const char * const mon_names[] = {"JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"}; | |
| static char date_buf[8]; | |
| auto now = id(time_comp).now(); | |
| snprintf(date_buf, sizeof(date_buf), "%s %2d", mon_names[now.month-1], now.day_of_month); | |
| return date_buf; | |
| - lvgl.label.update: | |
| id: day_label | |
| text: !lambda |- | |
| static const char * const day_names[] = {"SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"}; | |
| return day_names[id(time_comp).now().day_of_week-1]; | |
| interval: | |
| - interval: 1min | |
| then: | |
| - script.execute: time_update | |
| lvgl: | |
| log_level: INFO | |
| rotary_encoders: | |
| sensor: encoder | |
| binary_sensor: pushbutton | |
| group: general | |
| color_depth: 16 | |
| bg_color: 0x0F0F0F | |
| text_font: unscii_8 | |
| align: center | |
| style_definitions: | |
| - id: date_style | |
| text_font: unscii_8 | |
| align: center | |
| text_color: 0x000000 | |
| bg_opa: cover | |
| radius: 4 | |
| pad_all: 2 | |
| widgets: | |
| - obj: # Clock container | |
| height: size_content | |
| width: size_content | |
| widgets: | |
| - meter: # Gradient color arc | |
| height: 160 | |
| width: 160 | |
| align: center | |
| bg_color: 0 | |
| scales: | |
| angle_range: 360 | |
| rotation: 255 | |
| range_from: 0 | |
| range_to: 12 | |
| ticks: | |
| width: 35 | |
| count: 13 | |
| length: 8 | |
| indicators: | |
| - ticks: | |
| local: true | |
| start_value: 0 | |
| end_value: 12 | |
| color_start: 0xFF0000 | |
| color_end: 0x0000FF | |
| - meter: | |
| height: 160 | |
| width: 160 | |
| align: center | |
| bg_opa: TRANSP | |
| text_color: 0xFFFFFF | |
| scales: | |
| - ticks: | |
| width: 1 | |
| count: 61 | |
| length: 10 | |
| color: 0xFFFFFF | |
| range_from: 0 | |
| range_to: 60 | |
| angle_range: 360 | |
| rotation: 270 | |
| indicators: | |
| - line: | |
| id: minute_hand | |
| width: 3 | |
| color: 0xE0E0E0 | |
| r_mod: -1 | |
| - | |
| angle_range: 330 | |
| rotation: 300 | |
| range_from: 1 | |
| range_to: 12 | |
| ticks: | |
| width: 1 | |
| count: 12 | |
| length: 1 | |
| major: | |
| stride: 1 | |
| width: 4 | |
| length: 8 | |
| color: 0xC0C0C0 | |
| label_gap: 6 | |
| - angle_range: 360 | |
| rotation: 270 | |
| range_from: 0 | |
| range_to: 720 | |
| indicators: | |
| - line: | |
| id: hour_hand | |
| width: 4 | |
| color: 0xA0A0A0 | |
| r_mod: -20 | |
| - label: | |
| styles: date_style | |
| id: day_label | |
| y: -20 | |
| - label: | |
| id: date_label | |
| styles: date_style | |
| y: +20 | |
I have update the gist with some recent changes, however it depends on recent core changes to ESPHome that have not yet been released, so you will need to build against the dev branch. If you don't know how to do that, wait until the next proper release sometime in Feb.
Many thanks!
With esphome dev and this latest version of the code is working.
@clydebarrow, thanks for sharing. I am trying it out with lilygo s3 1.9in 170x320 display (not touch), backlight comes on, but nothing on display. the only error on compile is below. any ideas? I am just testing the esp-idf framework (moved from aurdino).
`
Compiling .pioenvs/display2/src/main.o
In file included from src/esphome.h:50,
from src/main.cpp:3:
src/esphome/components/lvgl/lvgl_esphome.h:38:19: warning: 'lv_color_t esphome::lvgl::lv_color_from(esphome::Color)' defined but not used [-Wunused-function]
static lv_color_t lv_color_from(Color color) { return lv_color_make(color.red, color.green, color.blue); }
^~~~~~~~~~~~~
Linking .pioenvs/display2/firmware.elf
RAM: [= ] 10.5% (used 34360 bytes from 327680 bytes)
Flash: [===== ] 54.6% (used 1001765 bytes from 1835008 bytes)
Building .pioenvs/display2/firmware.bin
Creating esp32s3 image...
Successfully created esp32s3 image.
esp32_create_combined_bin([".pioenvs/display2/firmware.bin"], [".pioenvs/display2/firmware.elf"])
Wrote 0x104a90 bytes to file /config/.esphome/build/display2/.pioenvs/display2/firmware-factory.bin, ready to flash to offset 0x0
========================= [SUCCESS] Took 74.87 seconds =========================
INFO Successfully compiled program.
INFO Connecting to x.x.x.x
INFO Uploading /config/.esphome/build/display2/.pioenvs/display2/firmware.bin (1002128 bytes)
Uploading: [============================================================] 100% Done...
INFO Upload took 5.23 seconds, waiting for result...
INFO OTA successful
INFO Successfully uploaded program.
`
The non-touch version is different, but I'm not sure exactly in what respect.
Thanks for sharing!!! and I'm super excited for all the work you've put in to get LVGL + parallel 16bit LCD etc etc running on ESPHOME 💯 😃 I've been hoping for better LCD support for years
So all the drivers I've been working on are now merged into dev, and will be in beta shortly. So now working to a first release of the LVGL stuff.
I have been testing your rpi_dpi_rgb 16bit parallel LCD driver yesterday on dev and it works! The update rate with the default display components makes it hard to use, since using the auto_clear_enabled: true is too slow and manually erasing old text content to update the buffer is so cumbersome, but I'm guessing/hoping that this LVGL component makes all that a non issue.. I will test them together soon now that I have found this :)
Just got this code working on an esp32-2424s012 ESP32C3 round 1.28" 240*240 IPS board with touchscreen, no code for touchscreen yet but it looks awesome :) It uses the gc9a01a which I saw you also added support for a few days ago!
non-affiliate link to manufacturer store: https://www.aliexpress.us/item/3256805267200938.html
For my display - the month/day is showing up correctly - but the hour/minute bars don't seem to move, I wonder what is supposed to trigger an update of the LVGL display elements? It only seems to show the correct month/day if it gets the time upon boot after a fresh OTA update, if I reset it later it wont show the correct month/day. It never shows the correct hour/minute hands, they never move from 12. Maybe its just not set to update currently as this is just a demo, not a big deal just curious on expected behavior? I tried the homeassistant and sntp time components.
My use case is a round gauge for off grid battery levels, so being able to make a round gauge with LVGL is perfect for this - and something I couldn't do with the old ESPHome display driver.
My current code is in this repo I just created, will have another YAML in there for the powermeter eventually https://github.com/clowrey/esphome-esp32-2424s012-lvgl-powermeter/
Github wouldn't let me update the image in that previous comment so I've created a new one, this shows the correct black levels and what it looks like in real life, not all washed out like the previous HDR image was making it seem.. it is a decent LCD.
You can remove the value: entries (which only set the initial value) and replace with update actions:
time:
- platform: sntp
id: time_comp
on_time_sync:
then:
- script.execute: time_update
script:
- id: time_update
then:
- lvgl.indicator.line.update:
id: minute_hand
value: !lambda |-
return id(time_comp).now().minute;
- lvgl.indicator.line.update:
id: hour_hand
value: !lambda |-
auto now = id(time_comp).now();
return std::fmod(now.hour, 12) * 60 + now.minute;
- lvgl.label.update:
id: date_label
text: !lambda |-
static const char * const mon_names[] = {"JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"};
static char date_buf[8];
auto now = id(time_comp).now();
snprintf(date_buf, sizeof(date_buf), "%s %2d", mon_names[now.month-1], now.day_of_month);
return date_buf;
- lvgl.label.update:
id: day_label
text: !lambda |-
static const char * const day_names[] = {"SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"};
return day_names[id(time_comp).now().day_of_week-1];
interval:
- interval: 1min
then:
- script.execute: time_update
Just updated the gist.
Oooooo nice! thank you so much!
I just installed it on a 5" 480x800 rpi_dpi_rgb display, working well.
only thing I have noticed so far is that it does not center on the display for some reason - maybe doesn't recognize displays this large? not sure..
yaml is here https://github.com/clowrey/esphome-esp32-8048s050-lvgl/
You just need to center the outer container. The default alignment is top left.
widgets:
- obj: # Clock container
height: size_content
width: size_content
align: center # <--- This
Oh wow that makes sense, and fixed it, thanks. I saw all the other align: center spread throughout so thought one of them was working to center it.
I was wondering if you know what the graphical element (line) on the right and bottom sides of the object container are caused by? If I set the width to "size_content" one is over on the right side almost off the screen, but if i set everything to 480 px they are visible like shown below. the same thing happens on my 240x240px round screen. Only way to get it to not show appears to be with the meter elements much smaller than the container like 150px for the 240px display and then they are not visible.
Maybe these are just expected bugs since the code is not released yet?
Those are scroll bars, your content is too large for the container.
Ahh! scroll bars!! I spent sooo long trying all sorts of settings.. LVGL is too smart ;) Thanks!
scrollbar_mode: "off" under the object settings fixed it for me (probably not the cleanest fix but it works for now)
I suggest you set the size of the outer container in pixels, add a padding spec (pad_all: 4) and size the meters at 100%.
You are right that works perfectly :) still trying to learn LVGL and the new YAML syntax for ESPHome makes it interesting :) but slowly figuring things out!
Trying to get LVGL to run on this neat little 240x240 ESP32 widget the "GeekMagic Small TV Pro" (make sure you get the pro one with touch button on top if you want ESP32) which are about $15 shipped from Aliexpress. It has no CS LCD pin connected which maybe is what's causing me issues with the LVGL component? It works with the default "lambda" display methods using this same display config but not once I put in the LVGL stuff, it just displays static. Any ideas or hints on what could be different with LVGL? no errors its running
display:
- platform: ili9xxx
id: lcd_display
model: st7789v
spi_id: spihwd
data_rate: 20MHz #oringal device uses 20mhz - 40 is default and works - does not work at 80mhz
#cs_pin: GPIO03 #CS pin is connected to gnd I believe
dc_pin: GPIO02
reset_pin: GPIO04
spi_mode: MODE3 #since no cs pin default is mode0
dimensions:
width: 240
height: 240
offset_height: 0
offset_width: 0
invert_colors: true
update_interval: never
auto_clear_enabled: falseThe rest of the code is the clock example
Without further information I would have no idea. Look at the logs for any error messages, attach a complete yaml file and logging output. Does it have PSRAM?
No PSRAM. I just uploaded all the logs + yaml + image of it working with the lambda version - included are the yaml that works with old ESPhome display lambda and logs for both versions. Only thing I can think thats different from my other working displays is that this one doesn't have a CS pin connected, but don't know how that would change it..
https://github.com/clowrey/esphome-geekmagic-small-TV-pro/
Wifi logs don't capture the output between boot and WiFi connection, which is when the interesting stuff happens.
But I suspect you are running out of RAM - add buffer_size: 25% to the lvgl config.
And the docs are here: https://arc.net/l/quote/tggegklw
I will connect a usb-serial adapter to the internal header to get the boot logs - these only have USB C for power but data lines not wired to anything.. I tried the 25% buffer and no noticeable change so far. That link to the docs is super helpful too, thanks!
Okay I tried changing the display dimensions to 160 and that fixed it, so must be related to buffer size like you said.. I'm wondering why as I've run this same code on an ESP32 C3 with similar ram.
dimensions:
width: 160
height: 160
But then I realized I am using the Arduino framework here and had used the esp-idf on the C3.. I had tried both before I got it working with the lambda but not since setting the SPI mode to 3.. And it works! I'm guessing just because esp-idf is more efficient with memory usage, still haven't hooked up serial converter to the debug header. Here is the working yaml https://github.com/clowrey/esphome-geekmagic-small-TV-pro/blob/main/small-tv-pro-lvgl-esp-idf-working.yaml
Thanks for your help again!
You might find the ESPHome debug: component useful: https://arc.net/l/quote/fcwbthud
Ahh!! that is super useful!! This is the output with esp-idf framework and working LCD
[10:58:45][D][debug:079]: ESPHome version 2024.4.0-dev
[10:58:45][D][debug:083]: Free Heap Size: 31360 bytes
[10:58:45][D][debug:162]: Chip: Model=ESP32, Features=WIFI_BGN,BLE,BT, Cores=2, Revision=3
[10:58:45][D][debug:170]: ESP-IDF Version: 4.4.6
[10:58:45][D][debug:175]: EFuse MAC: CC:7B:5C:A7:29:E0
[10:58:45][D][debug:320]: Wakeup Reason: Unknown
[10:58:45][I][lvgl:000]: [Info] (153.339, +987) lv_obj_update_layout: Layout update begin (in lv_obj_pos.c line #314)
[10:58:46][W][component:232]: Component lvgl took a long time for an operation (115 ms).
[10:58:46][W][component:233]: Components should block for at most 30 ms.
[10:58:47][D][sensor:094]: 'Heap Free': Sending state 55012.00000 B with 0 decimals of accuracy
[10:58:47][D][sensor:094]: 'Heap Max Block': Sending state 27648.00000 B with 0 decimals of accuracy
[10:58:47][D][sensor:094]: 'Loop Time': Sending state 125.00000 ms with 0 decimals of accuracy
[10:58:47][D][sensor:094]: 'Free PSRAM': Sending state 0.00000 B with 0 decimals of accuracyand here it is with arduino framework and no LCD - no logs showing LVGL working either unless I go to trace level debug - I am guessing the free heap being larger is because it failed to load the LVGL for some reason.. I will still get the hardware serial connected to investigate boot time errors more.
[11:05:06][D][debug:079]: ESPHome version 2024.4.0-dev
[11:05:06][D][debug:083]: Free Heap Size: 201588 bytes
[11:05:06][D][debug:113]: Flash Chip: Size=8192kB Speed=80MHz Mode=QIO
[11:05:06][D][debug:162]: Chip: Model=ESP32, Features=WIFI_BGN,BLE,BT, Cores=2, Revision=3
[11:05:06][D][debug:170]: ESP-IDF Version: v4.4.2
[11:05:06][D][debug:175]: EFuse MAC: CC:7B:5C:A7:29:E0
[11:05:06][D][debug:275]: Reset Reason: Software Reset CPU
[11:05:06][D][debug:320]: Wakeup Reason: Unknown
[11:05:09][D][sensor:094]: 'Heap Free': Sending state 220112.00000 B with 0 decimals of accuracy
[11:05:09][D][sensor:094]: 'Heap Max Block': Sending state 110580.00000 B with 0 decimals of accuracy
[11:05:09][D][sensor:094]: 'Loop Time': Sending state 43.00000 ms with 0 decimals of accuracy
[11:05:09][D][sensor:094]: 'Free PSRAM': Sending state 0.00000 B with 0 decimals of accuracy
@clydebarrow Thanks for all your work on LVGL in esphome. Its coming along really well. Can you add the value_ofs_x and value_ofs_y properties to a button? I really like have the text offset a bit. I gives more room on the buttons for badges and other information. I can put in a formal features request if you want but this would be a request to update a feature that is not even released yet :)
@clydebarrow Thanks for all your work on LVGL in esphome. Its coming along really well. Can you add the value_ofs_x and value_ofs_y properties to a button?
No, that's not present in LVGL 8.4. I'll move to V9 when it's sufficiently stable.
Hi Clydebarrow,
Thanks for your work.
I tried to use this code, but when I run the code validation get this error:
Platform not found: 'display.ili9xxx'.
I don't understand why.
Best regards,
Vasco Cruz