Lovelace: Button card

[slipx06]

Thanks. Fixed that now.

[daphatty]

Not sure what I’m doing wrong here. I’d like my fan icon to spin when the fan is in an on state, yet that doesn’t seem to happen as configured. Has anyone managed to get spin: working with a fan?

Template

button_card_templates:
  ceiling-fan-icon-settings:
    show_icon: true
    show_label: false
    show_name: false
    styles:
      card:
        - height: 36px
        - width: 50px
      grid:
        - grid-template-areas: '"i"'
        - grid-template-columnns: auto
      icon:
        - height: 26px
        - width: 26px
    state:
      - value: 'on'
        styles:
          icon:
            - spin: true

Button

- type: custom:button-card
  template: ceiling-fan-icon-settings
  entity: fan.living_room_fan
  tap_action:
    action: call-service
    service: fan.toggle
    service_data:
      entity_id: fan.living_room_fan

[Mariusthvdb (Marius)]

try:

  state:
    - value: 'on'
        spin: true #(uncomment this line for spinning icon)

[daphatty]

That did the trick. Thank you sir!

[RomRider]

@daphatty

I’m going to have to play around with the values to find a way to reduce the overall area being occupied without affecting the size of the icon so drastically.

The icon size is by default 40% of its area width. You can use size: 100% or any other value to resize the icon. This is a main config parameter,it’s not is styles.

[daphatty]

Coincidentally, I was able to manipulate the icon size via styles using:

styles:
  icon:
    - height: XXpx
    - width: XXpx

This gave me exactly what I needed to tweak icon sizes down to the pixel.

[RomRider]

That’s also a solution, size does exactly this with the value you provide but it existed before you where able to do the same thing with styles, so I keep it.

[Igor_Jurisic]

Hi peeps,

Any way to display more then one label, or multiple state attributes via label_template (but each in it’s own row)?

[RomRider]

Use <br /> between rows you want to display. label_template supports HTML that’s why this works.

[anilet]

@Mariusthvdb

the templates seem not to work (at all)

Did you get the templates to work.
I am stuck at trying to import the file with the styles
No errors but the buttons looks like the plain old ones.

[Igor_Jurisic]

@RomRider

Hmm…can’t make this work…if I add HTML break it doesn’t render the card
This is the example code…

        label_template: >
          return 'Moisture: ' + states['plant.dracaena'].attributes.moisture + '%' <br /> + states['plant.dracaena'].attributes.conductivity + 'µS/cm'

[mayker (maykar (pronounced "maker" with a southern accent))]

You’re missing a “+” before your break (quotes too). Try:

        label_template: >
          return 'Moisture: ' + states['plant.dracaena'].attributes.moisture + '%' + '<br />' + states['plant.dracaena'].attributes.conductivity + 'µS/cm'

[Igor_Jurisic]

@mayker

return 'Moisture: ’ + states[‘plant.dracaena’].attributes.moisture + ‘%’ + ‘
’ + states[‘plant.dracaena’].attributes.conductivity + ‘µS/cm’

Awesome! That works!
Much appreciated

[RomRider]

@Mariusthvdb

As far as I can test it now, the whole state: section is ignored and only the icon bit is active, when using the icon in the entity-config. No concatenation at all taking place. Which would really be a pity, because if one only wants to set an icon depending on state, one needs to set to whole state section on each individual entity. In this case, they are all identical, so that’s a whole lot of code duplicated many times…

thanks for having a look!

It’s exactly the behaviour expected (for now) but I’ll work on something to make this possible. There’s no easy way to achieve that (it will involve adding an id to your state so that I can match what you want to merge).

There’s already a feature request for this here : #165

[Mariusthvdb (Marius)]

yes, i did. show us your code and we can help

[Mariusthvdb (Marius)]

cool, the exact issue yes. Thanks for working on that, will make the configs much easier.

great time to think about the entity_picture_template again …

[RomRider]

@Mariusthvdb

great time to think about the entity_picture_template again …

It’s already done, in the next release also

[Mariusthvdb (Marius)]

wow, you’re fast! can’t wait to give it a try!

[mclaudiopt]

hello
in the following code how and where do i add an image instead of an icon?
i want to use different icons for different states
thank you

cards:
  - name: INFORMAÇÃO
    template: header_marcelo
    type: 'custom:button-card'
  - cards:
      - entity: sensor.riscoincendio
        name: RISCO DE INCÊNDIO
        show_label: true
        show_state: true
        size: 70%
        state:
          - color: red
            value: REDUZIDO
        type: 'custom:button-card'
      - dbltap_action:
          action: more-info
        entity: binary_sensor.meteoalarm
        name: ALERTA METEO
        show_label: true
        show_state: true
        size: 70%
        state:
          - color: green
            value: 'off'

          - COLOR: RED
            VALUE: 'on'
        tap_action:
          action: toggle
        type: 'custom:button-card'
    type: horizontal-stack
type: vertical-stack

[Mariusthvdb (Marius)]

@mclaudiopt

in the following code how and where do i add an image instead of an icon?
i want to use different icons for different states

I take it you mean you want to use different images for different states…?

you do so under the state: you already have, and then set an entity_picture, as is explained in the docs: button-card/README.md at master · custom-cards/button-card · GitHub