I have a verisure alarm and lock. I added those as badges in ui-lovelace but only the alarm gets a proper icon in the badge. The lock “icon” just says “locked”/“unlocked”. In the state card the icon is the correct mdi:lock icon.
How can I make the lock icon (or lock-unlocked depending on state) show up in the badge?
But I still don’t understand why I have to make extra sensor just to get an icon on a badge, it should be a simple configuration option (or even better, just use the standard icon).
@petro, I’m fine with it showing the state if I could have a lock icon as well. If you look at the alarm badge above it shows both an icon and a state. It would make sense if the lock badge was presented like that as the functionality is similar (in my case they are both part of the Verisure alarm system).
An alternative solution would be to allow templating in badges.
Yes, I understand your concern but badges do not allow what you want. Whoever made the component for your alarm specifically designed it to look that way with the badge. Badges will show states in the circle and units in the orange text area. An exception is the device_tracker badges that show an image and the state in the orange text area.
You’ll need to create a custom UI in order to achieve what you want.
This is not just Lovelace by the way, this is standard home assistant. They both behave the same way.
I totally agree that this is not Lovelace-specific. The lock badge doesn’t show in the standard ui so the issue didn’t occur there.
I have now created a binary_sensor with an icon_template and (almost) everything works as it should. The only issue now is that custom_ui most likely haven’t been updated to reflect the inverted lock_state introduced in 0.73. The badge shows the correct state (unlock = off) and icon but when I click on the badge to get the popup state card the icon is shown correctly but the action on the right is not. See images below. “Låst”/“Lås” means “Locked”/“Lock” in Swedish.
Badge: (correct)
State card: (correct)
Pop up state card when I click on the badge: (incorrect)