Use icon as a switch

Configuration Frontend
,
1

I’ve created a custom switch in my configuration.yaml:

switch:
  - platform: template
    switches:
      ac_switch:
        friendly_name: "Airco_Switch"
        value_template: "{{ is_state_attr('climate.air_conditioning_air_care', 'sensor_state', 'on') }}"
        turn_on:
          service: climate.turn_on
          target:
            entity_id: climate.air_conditioning_air_care
        turn_off:
          service: climate.turn_off
          target:
            entity_id: climate.air_conditioning_air_care

I want to be able to trigger this A/C switch by tapping the icon in a banner-card. This does work for my lights (group.kantoor) with light.toggle which is defined as a ‘service’, but not for the A/C as a custom switch. What am I doing wrong here?

  - entity: group.kantoor
    name: Verlichting
    value: mdi:lightbulb-multiple
    action:
      service: light.toggle
    map_state:
      'on':
        color: yellow
  - entity: switch.ac_toggle
    name: Airco
    value: mdi:air-conditioner
    action: toggle
      entity-id: switch.ac_toggle
    map_state:
      cool:
        color: lightblue
      heat:
        color: darkred

I’m using the following banner-card:

And the switch does work when I tap the title ‘Airco’ but than I first get a pop-up:

Any help is much appreciated!

2

try with

tap_action:
   action: toggle
3

I’ve tried, but as soon as I add ‘tap_action:’, the icon disappears.

4

I don’t know why you have added the “switch.ac_toggle” below action

    - entity: switch.ac_toggle
      name: Airco
      value: mdi:air-conditioner
      tap_action:
         action: toggle

PS: action should start under “p” in tap … don’t know why it moved in when i pasted it :slight_smile:

5

Unfortunately it still doesn’t work, as soon as I add tap_action and I add to spaces for ‘action’, the icon disappears :frowning: Using the code below as you suggested doesn’t seem to work:

  - entity: switch.ac_switch
    name: Airco
    value: mdi:air-conditioner
    tap-action:
      action: toggle
    map_state:
      cool:
        color: lightblue
      heat:
        color: darkred
6

Hmmm, weird , have you tried with " show_icon: true "

7

Doesn’t seem to help, just to make sure I’ll post the complete code below:

Configuration.yaml

switch:
  - platform: template
    switches:
      ac_switch:
        friendly_name: "Airco_Switch"
        value_template: "{{ is_state_attr('climate.air_conditioning_air_care', 'sensor_state', 'on') }}"
        turn_on:
          service: climate.turn_on
          target:
            entity_id: climate.air_conditioning_air_care
        turn_off:
          service: climate.turn_off
          target:
            entity_id: climate.air_conditioning_air_care

Banner-card

type: custom:banner-card
link: office-room
background: url("/local/custom_img/office_HA_new.png")
heading:
  - mdi:desk
  - Kantoor
entities:
  - entity: media_player.shed_speaker
    name: null
  - entity: sensor.air_conditioning_air_care_room_temperature
    name: Temperatuur
  - entity: climate.air_conditioning_air_care
    attribute: temperature
    name: Ingesteld
  - entity: group.kantoor
    name: Verlichting
    value: mdi:lightbulb-multiple
    action:
      service: light.toggle
    map_state:
      'on':
        color: yellow
  - entity: sensor.tvkantoor
    name: TV
  - entity: switch.ac_switch
    name: Airco
    value: mdi:air-conditioner
    tap-action:
      action: toggle
    map_state:
      cool:
        color: lightblue
      heat:
        color: darkred
  - entity: sensor.lightson_kantoor
    name: 'Lampen aan:'
8

ok sorry. im not sure how the “toggle action” will react on your template_sensor, maybe you need a toggle_service there … if such exists :slight_smile:

PS: cording to the “Banner-Card” docs, it seems like you can put the Icon in the “map_state” position, thou that seems for changing icon, but maybe that would apply also to show the specific Icon

Tried to move the “value: mdi:air-conditioner” there, below both cool and heat ( or different icons for different “map_state” ) … thou i don’t know if you can define both " color: " and " Icon " under map_state
…Or maybe you should actually define the icon in your “switch” template … im not very “experienced” with template-sensors

9

I also tried to move the icon around but that doesn’t seem to do much. I’ll try to read more documentation see if I can find a way to fix this.

The other weird thing is, when I click the text-label ‘Airco’, I am able to use that switch you see below:
image
But after I switch it on, the switch itself automatically moves back to ‘off-state’. So if I want to turn the Airco off, using that switch again, I first have to switch it to ‘On’ and then again to ‘Off’, so the switch doesn’t stay in the correct position. If this makes any sense… :slight_smile:

10

What integration is this climate device?

11

It’s LG SmartThinQ
image
image

12

This is the “behavior” of a “toggle_switch” (no on/off position)

13

Oh…really didn’t know, what can I use if I want it to stay in position?

14

Ordinary “Switch”, with a “tap_action”, and then hide the “on/off toggle” , so somehow you have defined a “toggle switch”, i don’t know if that’s in the Template, or the banner-card the define “Action” as a toggle … i was thinking about suggesting another Card, but it seemed like you already put alot of effort in making this card look Cool :slight_smile:

15

I really don’t know how the ‘toggle’ part is defined, because the configuration.yaml only contains the switch statement and there’s also no toggle action defined with the card itself.

Using a different card is not really a solution I’m willing to go for, except if that card provides the same options as the banner-card.

Update
I fixed the fact that the switch falls back into the previous state by removing this line from the Configuration.yaml file:
value_template: "{{ is_state_attr('climate.air_conditioning_air_care', 'sensor_state', 'on') }}"

So…part one is fixed.

16

Sorry my quoting is difficult on my tablet

However most climate devices don’t have an on state. For example my sensibo climate entities have these

  - cool
  - heat
  - dry
  - heat_cool
  - fan_only
  - 'off'
17

I know…I realized this a couple of minutes ago which made me change that line. Unfortunately did didn’t help. My last update, removing the value_template, prevents the switch from falling back in it’s original state. So that’s fixed for now, changing the pop-up in:

Where those icons stay in the state ‘on’ or ‘off’.

The only issue left for now is that I want to operate that switch by tapping the icon, instead of the text label with a pop-up first.

18

Why not use a climate card, ha has one and hacs has a few.

19

I know, but I have a tablet in the livingroom, showing 5 banner cards:

  • Living room
  • Office
  • Bedroom
  • Bathroom
  • Car

Those banner-cards give a quick overview of what’s going on, like living-room:
image
or the car:
image

I can tap on the light-bulbs to turn the lights on or off, I want to do the same for the airco. As soon as I tap the title of one of the banner cards, it opens a new ‘tab’ within HA and shows me all the devices in that room, so:

  • Climate cards
  • Light cards
  • Shutter cards
  • Heaters
  • etc…

That’s the way I’ve set it up for now because that makes it easy to control with a tablet.

20

you “define” 2 states here, cool/heat , but your template is service: climate.turn_on/off (which one will it be ?, turn_on Heat or turn_on Cool)

If your template_sensor actually turns your air-conditioner on/of, then you just need a CSS-“template” on the entity (i.e card-mod) , “if state_on: green” , and if your template_sensor actually should switch between Heat vs Cool , then “if state_heat: darkred” , but i have no idea how your template should look like, if you want to switch “State” between Heat/Cool