Lovelace: Multiple entity row

dyfcom · March 10, 2021, 10:27am

I don’t know what I am doing wrong, but the more-info/toggle/etc. action into double_tap_action/hold_action isn’t working for me. For example, when I hold the icon, it happens nothing. Neither on browser (firefox) or Androidphone (HA App).

In normal glance, the hold_action ist working with more-info.

        type: 'custom:multiple-entity-row'
        entities:
          - entity: light.kleiderschrank
            icon: 'mdi:wardrobe'
            name: false
            state_color: true
            tap_action:
              action: toggle
            hold_action:
              action: more-info
        entity: light.zimmer_licht
        name: Licht
        toggle: true
        state_color: true

And 2nd on my phone is something wrong with the layout, I think
grafik

Edit: Ok there is a Github Issue.

dyfcom · March 11, 2021, 7:31am

I don’t if that is working but try the format: option:

entity: sensor.meek_hallway_wifi_info
type: 'custom:multiple-entity-row'
name: Hallway
show_state: false
entities:
  - attribute: Connected msec
    name: Uptime
    format: time

alnavasa · March 11, 2021, 8:46am

How can I rotate a single icon on a multiple entity row?

  - type: 'custom:multiple-entity-row'
    entities:
      - entity: switch.sonoff_zzzzzz
        toggle: true
        icon: 'mdi:coach-lamp'
        name: false
        state_color: true
        tap_action:
          action: toggle
        styles:
          width: 40px
          text-align: center
      - entity: switch.sonoff_yyyyyyyyy
        toggle: true
        icon: 'mdi:globe-light'
        name: false
        state_color: true
        tap_action:
          action: toggle
        styles:
          rotate: 180
          width: 40px
          text-align: center
    entity: switch.sonoff_xxxxxxxx
    toggle: true
    icon: 'mdi:grass'
    name: Frente
    show_state: false

dyfcom · March 11, 2021, 12:01pm

I think the feature is coming in a new version in Home Assistant: https://github.com/home-assistant/frontend/pull/4855

alnavasa · March 11, 2021, 12:16pm

not really, Issue is closed.

Mariusthvdb · March 11, 2021, 2:33pm

check 🔹 Card-mod - Add css styles to any lovelace card

isidrology · March 15, 2021, 1:09am

This is great,

I wanted to add a power indicator under my light switch, and this is what I used.

Is there any way to bring a brightness slider into the mix?

notice I have two Entry lights I want to put the slider up to the first one. this possible?

  - entity: light.entry_87
    type: 'custom:multiple-entity-row'
    icon: 'mdi:lightbulb-outline'
    secondary_info: 
       attribute: "current_power_w" 
       unit: W
    styles:
    toggle: true
  - entity: light.entry_87
    icon: 'mdi:lightbulb-outline'
    toggle: true
    type: 'custom:slider-entity-row'

Or somehow add a fold entity to drop down a slider.

NeoID · March 28, 2021, 10:16am

Would love support for fire-dom-event so we can get browser_mod popups working again

arganto · April 6, 2021, 3:58pm

Does anyone or do you @benct know, if there is a way to “yaml” the displayed name in the row of this great multiple entity row? I want to change this depending of criterias.

Ildar_Gabdullin · April 15, 2021, 10:44am

I do love the "multiple-entity-row" and use it a lot.
But there is a thing which I do not like - inability to display "last-changed" for each item.
Currently it is supported only for the main entity.

How do you like this?
It needs a "card-mod" installed.

  - type: 'custom:multiple-entity-row'
    entity: sensor.test_david_2_device
    show_state: false
    name: Toothbrush
    icon: 'mdi:wifi-strength-1'
    secondary_info: Weak
    style: |
      :host .entities-row {
        justify-content: flex-start;
        align-items: unset;
      }
      :host .entities-row div.entity:nth-child(1) div::after {
        color: var(--secondary-text-color);
        font-size: 0.7rem;
        content: "\A {{relative_time(strptime(states.sensor.test_david_2_device_status.last_changed,"%H:%M:%S %d/%m/%Y"))}}";
        white-space: pre;
      }
      :host .entities-row div.entity:nth-child(2) div::after {
        color: var(--secondary-text-color);
        font-size: 0.7rem;
        content: "\A {{relative_time(strptime(states.sensor.test_david_2_wifi_connect_count.last_changed,"%H:%M:%S %d/%m/%Y"))}}";
        white-space: pre;
      }
      :host .entities-row div.entity:nth-child(3) div::after {
        color: var(--secondary-text-color);
        font-size: 0.7rem;
        content: "\A {{relative_time(strptime(states.sensor.test_david_2_signal.last_changed,"%H:%M:%S %d/%m/%Y"))}}";
        white-space: pre;
      }
      :host .entities-row div.entity:nth-child(4) div::after {
        color: var(--secondary-text-color);
        font-size: 0.7rem;
        content: "\A {{relative_time(strptime(states.sensor.test_david_2_rssi.last_changed,"%H:%M:%S %d/%m/%Y"))}}";
        white-space: pre;
      }
    entities:
      - entity: sensor.test_david_2_device_status
        name: MQTT
        styles:
          width: 42px
      - entity: sensor.test_david_2_wifi_connect_count
        name: WiFi
        styles:
          width: 42px
      - entity: sensor.test_david_2_signal
        name: Signal
        styles:
          width: 56px
      - entity: sensor.test_david_2_rssi
        name: RSSI
        styles:
          width: 38px

More card-mod examples for "multiple-entity-row"

The code above is a simplified example.
The whole card with Tasmota integration is discussed starting from this post.

Markus99 · April 26, 2021, 10:10pm

Any way to show_icon: false on this to hide the icon? Or a card-mod way to hide it? Tried `state-badge {display: none;} but that didn’t work. Thank you!

Ildar_Gabdullin · April 26, 2021, 11:04pm

Which icon do you want to hide - main entity, secondary items?
Anyway, you may use mdi:blank for the main entity or secondary items.
Also, "icon: false" is used to show an entity’s state instead of an icon (secondary items).
And "card-mod" may be used too…

type: vertical-stack
cards:
  - type: entities
    entities:
      - type: 'custom:multiple-entity-row'
        entity: sun.sun
        entities:
          - entity: sun.sun
        name: Default
  - type: entities
    entities:
      - type: 'custom:multiple-entity-row'
        entity: sun.sun
        style:
          hui-generic-entity-row:
            $: |
              state-badge {
                display: none !important;
              }
        entities:
          - entity: sun.sun
        name: Removed icon
  - type: entities
    entities:
      - type: 'custom:multiple-entity-row'
        entity: sun.sun
        entities:
          - entity: sun.sun
        name: Blank icon
        icon: 'mdi:blank'

Markus99 · April 27, 2021, 3:31pm

Thank you, VERY helpful. Figured how to remove the icon - now trying to add some padding to the right side of the full_row slider:

- type: conditional
            conditions:
            - entity: media_player.htd_outside_couch
              state: "on"
            card:
              type: horizontal-stack
              cards:
              - type: entities
                style: |
                  ha-card {margin-top: -15px; }
                entities:
                - type: custom:multiple-entity-row
                  style:
                    hui-generic-entity-row:
                      $: |
                        state-badge { display: none !important; }
                  entity: media_player.htd_outside_couch
                  show_state: false
                  secondary_info:
                    attribute: source
              - type: custom:slider-entity-row
                entity: media_player.htd_outside_couch
                full_row: true
                style:
                  slider-entity-row:
                     $: |
                       span { padding-right: 25px !important; }

What I have above isn’t working w/ the span { padding-right…}

Ildar_Gabdullin · April 27, 2021, 10:34pm

Ask these questions in the card-mod topic.

Markus99 · April 28, 2021, 12:54pm

Done. TY for the suggestion.

DJKalz · May 3, 2021, 9:52pm

Hi

I’m having a slight issue with formatting when using this card.

I have 4 helpers, 2 x input.datetime and 2 x input.number.

When I display the datetime helpers using this card so everything is on the same line it shows the datetime with AM / PM. I would just like it to be displayed as HH:mm, in 24 hour format.

Also, when I display the number helpers using this card it shows the number with one decimal place. I would just like it to be displayed as a whole number, ie 20, not 20.0

Here’s the code I’m using with a screenshot of what it displays, and thanks in advance for any help.

type: entities
title: Schedule 1
show_header_toggle: false
entities:
  - entity: input_boolean.day_1_1
    type: 'custom:multiple-entity-row'
    show_state: false
    state_color: true
    tap_action:
      action: none
    entities:
      - entity: input_boolean.day_1_1
        toggle: true
        name: false
      - entity: input_datetime.workday_1_1
        name: Work day
      - entity: input_number.workday_1_1
        name: °C
      - entity: input_datetime.offday_1_1
        name: Off day
      - entity: input_number.offday_1_1
        name: °C

Ildar_Gabdullin · May 3, 2021, 10:07pm

Have you tried this?

This is probably not related to the multiple-entity-row, it is about time format in HA.

DJKalz · May 4, 2021, 9:33am

I think it is related to the multiple-entity-row, the screenshot below shows with and without the multiple-entity-row. In the bottom part I use just a entities card without the multiple-entity-row function and the display is just fine.

Ildar_Gabdullin · May 4, 2021, 9:48am

Again, try to fix "precision" first.
As for “24h” - register an issue in GitHub if you think that it is a bug.

DJKalz · May 4, 2021, 10:05am

I’m really new to HS, I’m unsure what you mean by this?