Badge State Image

Oh, sorry. I missed that you wanted to change the text inside the circle.

As far as I know you can’t do that since that is the “state” of the entity. I don’t think it would make sense to change that since you wouldn’t then know what the state would be. And states are always strings or integers so you can’t make a state an icon or a picture.

Hi @bnutt, welcome to the community.

Just want to show what is possible with lovelace and how flexible HA can be.
Here is my take on Badge banner

That may look overwhelming at first but if you take small steps, you’ll find your way to do things with HA.

Best of luck.

Thanks people. @finity, on the contrary, I’m I’d like to display the actual state as an icon (sun for heat, icicle for cool, etc), rather than just an entity-specific icon (or the state name that is there presently). I have read people who have made dynamic icons based on state using if/then/else in an icon_template field - but I think that’s possibly in the old UI.

@JTPublic - thanks, will have a look through that - certainly looks interesting. There’s definately a lot of power in HA waiting to be tapped, it’s limit is really only your own imagination!

but i don’t think badges operate like that.

if you list the entity in a card on its own line the the icon to the left will show the customized icon but the state will still be visible to the right. and then i agree that you can then use if statements to generate dynamic icons.

Well yes, this is what I’m coming to believe - what I want to do isn’t possible. I just figured the states are there as words already - surely it would be possible to slot mdi icons in there instead to tidy it up a bit.

I’ll take a deeper dive into @JTPublic’s link and see if that might help.

As you found out, badge has limited options for customization. It does its thing well in a quick and easy way. But if you won’t let good enough alone, like me :slight_smile: , there are many ways to customize.
If you need any code example, please let me know, happy to share.

it most certainly is possible:

31

tell us what that si and well see how to help

I assume you needed to use andrey’s custom ui for that?

1 Like

yes, for some, others are formatted in python.
Must admit this is still on ha 84.3, both Lovelace and regular HA.

90.2 Ha deprecates customizing a lot unfortunately, especially theming for badges has gone. See:
56

Still, 21 26 are there, among others, as are badges in cards:

26
note the customized uom of the update available.

to the OP…

to find out how to use the custom_ui we are referring to above then go here:

but also be aware that as marius mentioned above some (most?) of that functionality has been removed from the latest versions of HA in Lovelace.

to elaborate on that:
I wouldn’t say Most, a lot still works very fine. I happen to use almost all options of custom-ui, but if you only try to template icons and icon_colors, and entity_pictures as the OP wants to do, there’s not issue doing so.

Beware though that not only Lovelace has been taking out functionality, bit also regular HA. Especially noteworthy is the _stateDisplay option. If you want that, remain in the 84.x region…

also, the later updates have also started to deprecate custom Tiles. so, you must be warned that not all advance is progress…

Yes I’d already gathered in the reading I’ve done on the forums that everything is in a state of flux at the moment with Lovelace becoming the default UI.

@Mariusthvdb - All I’m wanting to do is display a state-related icon rather than the text. So for doors, the mdi garage open/closed icons. For climate, flame, icicle, etc. It’s pedantic I know, but I’m a bit OCD sometimes - it’s the small things! With the help of trusty old MS Paint - an example using the garage doors.

image

@finity - thanks for the link, will check it out and see if I can get something working. For now, unfortunately, my day-job calls.

your issue might be you want to mix the mdi:icons (used in the icon field) in the entity_picture field, (used for the badges)

if you use an entity_picture template you are able to use the state for determining the displayed picture in the badge.

although I must confess I have never tried to use an mdi:icon in the entity_picture template, I would think that not to be optimal ( the docs don’t explicitly state its not possible…)

note that this isn’t a custom-ui template but a regular template sensor template.

if you’d use custom-ui, things get a bit more complicated, since it it using javascript syntax. Let me know if you need help with that, got some nifty template for that too :wink:

I understand what you’re getting at. Have thrown on custom-ui, will have a play. Definately keen on whatever you’ve got to share - do you have a github repo?

I’m a noob to HA/YAML/Python, but been around shell, JS (incl Angular, node.js etc), HTML etc for years. Compulsive tinkerer!

Late to the party, just wanted to say that binary states are kinda possible by hiding/showing badges. Mini-example:

badges:
  - type: entity-filter
    entities:
      - entity: person.me
        name: Me
        icon: mdi:home-account
    state_filter:
      - "home"

So, basically you can use one badge (with icon/picture) when a person is home (a sensor is on, …) and another when not.

/Victor

3 Likes

Did you end up getting anywhere with this?
I’m trying to achieve something similar…

I didn’t sorry @AJG. Other things became more important - I do hope to come back to it at some stage though. Do reply here if you have a crack at it!

For anyone asking - I believe it is possible using card-mod, take a look.

scrap it. properly asked question is at least 50% of the answer :frowning:

Card mod lets you mod the look of what’s presented, he wants to switch words for icons. He’ll have to use something that allows him to adjust what the field returns. That’s not card mod.

@bnutt Ben, how do you get the picture of you and Sarah in the badge?

Can you post the config and the file name in which the config goes.

Thanks