Image Widget

[RossiRPI]

Can we add support for the image widget? This could allow us to do things like album art of track that are playing, image of person at front door when door bell is rung, etc...

[fvanroie]

The image widget is the most complex and resource hungry widget. I haven't given it much thought if and how this could be integrated into the project. While the example use case is cool, it's also rather complex to use outside image data like that. I don't see this happening anytime soon...

[dgomes]

There is actually this https://www.home-assistant.io/integrations/camera.mqtt/

[fvanroie]

Yes I've tried sending a screenshot over mqtt to HA. It didn't work because the images got chopped up. A part of the image would appear, but the way lvgl sends the data, only a portion would show up...

Not sure how useful that is as a feature though. It's juggling to get the MCU to do too many things at once.

[RossiRPI]

I think this project should implement the image and image button widgets based on locally stored images rather than trying to stream images over MQTT as MQTT isn't designed for video/image streaming. Being able to display locally stored images would open this project up to some visually impressive screen designs.
Streaming video or updating images should be done through a different protocol/service as it is most probably out of scope for this project.
MQTT can be used for notifications that there's a new image available or to start a video stream.

[fvanroie]

I agree, but that doesn't change the resource limitations of the micro-controller.
Is it possible to stream video and images? Do you have other examples of projects to do this?
It might feasible on a (single board) computer... but the ESP32 is pretty stretched already.

[RossiRPI]

It is possible to stream video on an ESP32, there's an example of a VNC client that I found.

As I said in my previous post the best implementation would be to just have the locally stored images being used for the image and the image button widgets. These could be stored in flash, although that's limited, or on an sd card.

[nagyrobi]

The most I think it'worth the effort is to just have locally stored static bakground images for the pages.

[fvanroie]

Maybe... in due time.

[nagyrobi]

yes, when the time comes. low priority imho

[fvanroie]

The img object will be introduced in 0.6.0. It's a minimal implementation and uses png files from flash.
The decoding is done in memory so you will benefit from having PSram or be limited to small icons only.

[nagyrobi]

https://github.com/robmarkcole/mqtt-camera-streamer
knolleary/pubsubclient#608

[nagyrobi]

One thing to do for sure is to strictly limit the image size to be sent to the plate, so preprocessing has to be done in HA. Album covers, camera pictures size are usually way bigger than the screens of the plates.
CC should resize the picture for each plate before sending the picture to it, and the image size shouldn't be bigger than the actual resolution of the plate. Could be smaller.

[fvanroie]

Album art is possible, but the CC (or webserver) needs to preprocess the image (scale and convert to RGB565):

[nagyrobi]

Hopefuly this can get into 0.6.2 or 0.7 with example config how to do it ;)

[jazzmonger]

How do we do this so we can get the album art on the display???

My Alexa Entity has these attributes:

volume_level: 0.4
is_volume_muted: false
media_content_type: music
media_duration: 502
media_position: 3
media_position_updated_at: 2023-03-27T16:24:24.627236+00:00
media_title: Concerto For Harpsichord, Strings & Continuo No. 2 In E Major, Bwv 1053: I. (Allegro)
media_artist: Viktoria Mullova
media_album_name: Pandora
source: Local Speaker
entity_picture_local: /api/media_player_proxy/media_player.kitchen_original?token=2699a170f9d3804104bb1f0aa9f9f0c22b8249aee281488f0b7a2d76169d670c&cache=6fba2bc8532ad0a0
available: true
last_called: true
last_called_timestamp: 1679933720709
last_called_summary: alexa volume four
connected_bluetooth: null
bluetooth_list: NS-SPBTBRICK, Jeffs 128gb iPad, Jeffs iPhone SE
entity_picture: https://dyn-images.p-cdn.com/?l=images%2Fpublic%2Frovi%2Falbumart%2F0%2F2%2F4%2F1%2F880040411420%3Acover%28%29&w=600
friendly_name: Kitchen -original
supported_features: 56253

I see the picture is stored in

entity_picture_local: /api/media_player_proxy/media_player.kitchen_original?token=2699a170f9d3804104bb1f0aa9f9f0c22b8249aee281488f0b7a2d76169d670c&cache=6fba2bc8532ad0a0

I know the art is available. It shows in the HA media player.
How can I get the album art to display in this box

{"id":39,"obj":"obj","enabled":true,"x":0,"y":43,"w":355,"h":355,"bg_opa":180,"clip_corner":1,"border_post":1,"border_color":"#FFAC00","border_width":2,"radius":10,"radius1":10,"radius2":10}
{"id":40,"obj":"img","enabled":true,"x":0,"y":0,"w":355,"h":355,"parentid":39,"auto_size":1,"src":"L:/openhasp.png"}

I'm looking to fill this out:

    - obj: "p2b40" # album art
      properties:
     (what goes here???)

[pepe59]

I have the same problem. Did you find any solution to get the picture from entity_picture: /api/media_player_proxy/........