Custom Button-Card State issues

Configuration Frontend
1

I have been desperately trying to figure out how to use ‘state’ to make a button (icon) change color based upon my washer’s state.

I have an input text field that I am storing the state in - Idle, Washing, Finished

I have tried several things, and I cant get anything to work. I have read through the examples on github, and tried several of them. I am getting closer, as I can make a direct example do whta it supposed to… but mine just doesnt work.

There is a good chance I am just not doing something right…

So here it is:

type: custom:button-card
entity: input.input_text.washer
show_state: true
state:
  - value: Washing
    name: Washing
    icon mdi: mdi:washing-machine
  - value: Finished
    name: Finished
    icon: mdi:washing-machine-alert
  - value: Idle
    icon: mdi:washing-machine-off

Ideally, I would do more than switch the icon - but this was my latest attempt. I am sure I am missing something critical. I dont need it to react based on an action… Just trying to read the value from the input text, and react on its behalf.

2

must be “icon: mdi:washing-machine”

must be “entity: input_text.washer”

1 Like
3

When I try to put the spaces in using the card editor, it puts a red line along the left side and wont accept the changes.

If I use the raw editor for the dashboard, I get the following error:

Unable to parse YAML: YAMLException: bad indentation of a mapping entry (20:26) 17 | state: 18 | - value: Washing 19 | name: Washing 20 | icon mdi: mdi: washing-machine -------------------------------^ 21 | - value: Finished 22 | name: Finished

4

I missed the quotes the first go round… that let me use the raw editor and save it, but still no different, I get a blank card.

Furthermore, when I go back in the editor, the quotes are missing on the entity, and the icons are changed to single quotes…

5

No other suggestions?

6

Have you tried using my corrections?
Just noticed a typo in my advice: extra whitespace in “mdi: washing-machine”.

7

sigh

I took another stab at many many changes and seeing results…

Turns out I was calling the entity for the field wrong (was using input.input_text.washer - should have been input_text.washer)

and yes I did try your suggestions, it actually made it mad adding the white space… and in the end, if I put quotes in it wanted them out.

Either way, I solved my issue!

Thanks for the help!!!

      - type: custom:button-card
        entity: input_text.washer
        icon mdi: mdi:washing-machine
        show_state: true
        state:
          - value: Washing
            icon mdi: mdi:washing-machine
          - value: Finished
            icon: mdi:washing-machine-alert
          - value: Idle
            icon: mdi:washing-machine-off
8

Your posted code is wrong and yet you marked it as a solution.

10

Well, if you chose a way of arguing…
For the record:

image
image1393×695 95.1 KB

“Solution” mark is for OTHER users - and your post is a misleading.

12

You definitely did not understand your mistake. Suggest you to check my advice again.
Just noticed - it is the THIRD time I am suggesting you the same. Guess I should give it up.

type: custom:button-card
entity: …
show_state: true
state:
  - value: …
    name: …
    icon: mdi:xxx
  - value: …
    name: …
    icon: mdi:xxx
13

hmm… @Ildar_Gabdullin did actually identify the entity issue in his very first post. so i think he was right from the get go and had the original correct solution.

14

Thank you for pointing that out - I have corrected everything above, I totally missed that the first time around. Somehow I was focused on the spaces and did not see the subtle change in the entity! I guess thats what I get for rushing to attempt to fix things on my way out the door going to work!!

I apologize for getting cranky about it.

1 Like
15

You also please accept my apologize if I was cranky!