Adding mdi icons to presence detection

Configuration Frontend
1

I am using presence detection with Life360 and it is working very well, see Lovelace card attached.
home-away
I’d like to add mdi icons based on each person’s location so for example if home show a house icon. I have defined the icons in the zone setup in my configuration.yaml file - work, gym etc…
Any help would be greatly appreciated.

1 Like
2

You can’t do what you want with the native card. You’d have to get inventive with custom cards to have the desired setup.

1 Like
3

maybe nt what you are looking for, but my family is displayed with entity_pictures based on their zone.

Does take the effort to create these manually, and then use a setup using this template:

      - type: custom:button-card
        template: button_picture_family
        entity: device_tracker.life360_name
        entity_picture_template: >
          if (entity.state === 'home' || entity.state === 'not_home') return '/local/tiles/family/name_' + entity.state + '.png';
          return '/local/tiles/family/name_' + states['sensor.name_location_picture'].state + '.png';
        tap_action:
          entity: group.name

of course replace ‘name’ in the sensors above with the actual name of the person.

the button template takes care of the background color:

home = green, not_home (and not in a zone) = grey, in a zone (life360) purple:

button_picture_family:
  size: 80%
  show_state: false
  show_label: false
  show_name: false
  show_entity_picture: true
  color_type: card
  aspect_ratio: 1/1
  tap_action:
    action: more-info
    haptic: light
  hold_action:
    action: more-info
    haptic: success
  styles:
    card:
      - border-radius: 6px
      - box-shadow: '0px 0px 2px 1px #F0C209'
    entity_picture:
      - border-radius: 6px
  state:
    - operator: template
      value: >
        return entity.state === 'home'
      color: '#008000'
    - operator: template
      value: >
        return entity.state === 'not_home'
      color: '#555B65'
    - operator: default
      color: '#643aac'

see What does your deafult page look like? for an (edited) image

1 Like
4

Great will give this a try.
Thanks!

5

Here’s another way to do it with a template sensor. It grabs the icon from the zone.

      presense_dan_icon:
        friendly_name: "Dan"
        value_template: "{{ states('person.dan') }}"
        icon_template: >
          {{ states.zone | selectattr("attributes.friendly_name","equalto",states("person.dan"))|map(attribute="attributes.icon")|first }}
1 Like
6

Also worth doing something about the state entity showing ‘home’ or ‘not_home’.
Not sure which method below I prefer. The last works in all scenarios but seems like too much code.

If anyone has a clever solution please reply.

Shortest but won’t work for zones that you don’t want title cased:

{{ states('person.dan')|replace("_"," ")|title }}

A bit longer, but doesn’t work if you have a zone that needs the word ‘home’ to stay in lowercase.

{{ states('person.dan')|replace("home","Home")|replace("not_home","Not Home") }}

or the longest way that I believe will work 100% of the time

{% if states('person.dan') == 'home' %}
  Home
{% elif states('person.dan') == 'not_home' %}
  Not Home
{% else %}
  {{ states('person.dan') }}
{% endif %}
7

Hi

could you let me know where the “button_picture_family:” has to be put in the configuration ?

8

its a button-card-template and here’s the documentation on that: GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant