Temperature value in picture glance card

Configuration Frontend
1

Hi,

Just started with the Lovelace UI and it looks very promising!
I would like to show a picture glance card for every room on my main page, not a problem…
But instead of the thermometer icon for the room temp I would love to see the actual temperature. Is this anyway possible?

1 Like
2

Same here. I just had a look at lovelace and was impressed but when I saw that this is not possible I did not continue… You need the Picture Elements Card to see the values at first “glance”, which means far more work.
There is a discussion about it at github, I hope there might be a way to realize this in the future.
For now it is not possible.

3

@DonTomato @PaNiCo, showing status on the picture-glance is not possible. It only shows the icon. I cannot say if that will change. Remember, lovelace is it’s early stages. Lots of changes are happening every build. To keep up with new changes, follow the change log:

As for your problem. You can use the picture glance card inside a vertical stack with a normal glance card. Put all your lights and switches in the picture glance, and all your sensors in the glance card. You’ll get what looks like a nice 2 panel window with all the information together for that room. Don’t label the glance card and it will be condensed. Only label the picture glance card.

this is an example I use with slider bars… imagine the sliders bars are replaced with a glance card:

reciever

and here is the yaml:

      - type: vertical-stack
        cards: 
          - type: picture-glance
            title: Yamaha Receiver
            entities:
              - switch.zone_1
              - switch.audio_1
              - switch.zone_2
              - switch.audio_2
            image: /local/images/rxv677.png
          - type: entities
            entities:
              - entity: input_number.yamaha_receiver
                name: Zone 1 Volume
              - entity: input_number.yamaha_receiver_zone_2
                name: Zone 2 Volume
1 Like
4

Thanks for the example! Hopefully someone makes this possible in the near future.
But until then I will try to diy something :grinning:

5

I had the same wish, so I made a solution for myself. Here you go: Temperature glance

1 Like
6

Ah, nice. You leveraged the picture-entity card and made it look like the picture-glance card

7

Picture elements, actually, but otherwise yes. I like the look of the glance card.

8

yeah, I miss spoke when saying picture-entity, I meant picture-element. I have a brain to keyboard translation issue sometimes.

1 Like
9

Nice! Very nice!

1 Like
10

the link is broken, would you mind sharing again?

11

It’s on the same page, you can just click on the menu.

12

Sorry to revive this. I want to achieve the same thing, but with a camera image as background. I tried the temperature-glace solution by @ teachingbirds, but the picture-elements card requires an image and doesn’t work with a camera, so it won’t work for me :frowning:
Any other ideas?

13

Use this:

14

I am currently using a picture glance card, but the temperature sensor is shown as a thermometer icon, and I’d like to see its value instead (without clicking on the icon).

15

Shoot, looks like that’s only a feature of picture-entity might need to submit a feature request.

16

I managed to add temperature and webcam view on a picture-entity. Here’s an example:

elements:
  - camera_image: camera.webcamteo
    entity: camera.webcamteo
    style:
      heigth: 100%
      left: 50%
      top: 50%
      width: 100%
    type: image
  - type: icon
    icon: 'mdi:thermometer'
    entity: sensor.dormitor_teo
    tap_action: more-info
    style:
      top: 95%
      left: 2%
      color: white
  - type: state-label
    entity: sensor.dormitor_teo
    style:
      top: 95%
      left: 8%
      color: white
image: /local/kidsroom.jpg
type: picture-elements

There’s a camera image overlayed on top of a static image. When the camera is unreachable I can see the static image below (neat). I can also add items like a normal picture-elements card. I don’t have the transparent gray bar below, but so far it’s not an issue.

2 Likes
17

But it still shows the icons doesn’t it, that was the OP’s real quest, to have sensor data shown instead of icons.

18

It shows both the thermometer icon and the value next to it (without needing to click on it).

1 Like
19

Ahh, ok, got it working on a static image here. Can’t do it for a live camera unfortunately.
ups
Thanks @mad_ady

20

Hi there is a fix. Just add show_state: true after the entity and it will show the value under the icon.

type: picture-glance
entities:
  - entity: binary_sensor.esp32cam_wohnzimmer_status
  - entity: sensor.esp32cam_wifi_wohnzimmer_signal
  - entity: light.wohnzimmer_light
  - entity: sensor.wohnzimmer_temperatur
    show_state: true
  - entity: sensor.wohnzimmer_feuchtigkeit
    show_state: true
camera_view: live
...
6 Likes