Custom component/code integration for pages, widgets, etc.

[segfly]

Custom component/code integration for pages, widgets, etc.

[segfly]

@clydebarrow I've create a proof of concept for the lambda assignment of pages:
https://github.com/segfly/esphome-lvgl

Basically, when the lambda: property is present, it takes the return value and assigns to {page.obj} struct instead of the generated lv_obj_create call. This allows a great deal of flexibility for page creation outside of yaml, while still allowing for other parts of the LVGL ESPHome component to interact with the "injected" page.

The only (minor) issues I ran into were with the EEZ Studio generated code, I had to change the default generation templates to specify the right "lvgl.h" path and add a fake method for getFlowState call, which I think is generated as a bug in their code for LVGL-only projects.

Once that was done, I can now design pages in the EEZ Studio, and then use with the LVGL ESPHome component.

Here is a snippet of what the yaml looks like:

sensor:
  - platform: uptime
    id: sys_uptime
    update_interval: 1s
    on_value:
      then:
        - lambda: lv_label_set_text(objects.label_uptime, std::to_string(static_cast<int>(id(sys_uptime).get_state())).c_str()); 

button:
  - platform:
    name: Show Uptime
    on_press:
      - lvgl.page.show: uptime_page 

lvgl:
  pages:
    - id: welcome_page
      widgets:
      - label:
          align: CENTER
          text: "Welcome!"
    - id: uptime_page
      lambda: |-
        create_screen_uptime_page();
        return objects.uptime_page; 

Thoughts?

[nagyrobi]

Let's tun things around: how about discussing with EEZ project (after this is merged) so they could directly output ESPHome yaml?

[segfly]

A similar thought crossed my mind, but that seems like a huge amount of work. It would be wonderful though, I don't disagree.

I was thinking as a short-term solution, this simple lambda approach provides a lot of flexibility - plus, it theoretically can be used with any other LVGL designer, like SquareLine Studio.

[nagyrobi]

yaml->compile->upload->test

You could use ESPHome host + vnc to speed things up considerably.

[segfly]

Ah interesting. I did not know this existed, probably because it's not documented:
esphome/feature-requests#2388 (comment)

It won't make UI design as fast or easy as using a UI designer, but will certainly streamline integration testing, before testing on device. Thanks.

[clydebarrow]

The sdl display driver is even simpler to use than VNC now, and it's merged into ESPHome release.