my first dashboard

my first dashboard

I wanted to create a mobile dashboard that shows the essential elements on the first page and sub-views on which details can then be controlled.

The links to the sub-views are at the top of the start page, realized by a horizontal stack card with entity cards. Some of the icons are interactive, the light icon turns yellow if a light is still on in the house, otherwise it is gray. For this I use a template-binary-helper, which I will describe below.

Then there’s apart from the garbage calendar that can be found here:
https://book.cryd.de/books/projekte/page/abfallkalender

The next entry, an entity card, can be used to switch the automatic heating control on/off. Depending on the status of the heating control (auto/manual), the horizontal stack underneath with the controllers for the room temperature is shown or hidden. To hide the card, I have packed the horizontal stack into a conditional card. The conditional card reacts to the helper (bool), which switches the automation of the heating on or off.

The temperatures of the important rooms are shown in the next horizontal stack card and then the most frequently used lights.

The subviews are quite simple, as the individual entities are usually just packed in horizontal stacks.

Here is the code for the main view:

type: horizontal-stack
cards:
  - type: custom:mushroom-template-card
    primary: Home
    secondary: ''
    icon: mdi:home
    layout: vertical
    tap_action:
      action: navigate
      navigation_path: home
    fill_container: true
    icon_color: green
  - type: custom:mushroom-template-card
    primary: Heizung
    secondary: ''
    icon: mdi:heat-wave
    layout: vertical
    tap_action:
      action: navigate
      navigation_path: heizung
    icon_color: red
  - type: custom:mushroom-template-card
    primary: Licht
    secondary: ''
    icon: mdi:lightbulb
    layout: vertical
    tap_action:
      action: navigate
      navigation_path: licht
    icon_color: |
      {% if states('binary_sensor.alleslichtaus') == 'on' %}
        grey
      {% else %}
        yellow
      {% endif %}
  - type: custom:mushroom-template-card
    primary: ''
    secondary: Müll
    icon: mdi:trash-can
    layout: vertical
    tap_action:
      action: navigate
      navigation_path: /dashboard-mush/muell
    icon_color: orange
  - type: custom:mushroom-template-card
    primary: ''
    secondary: Energie
    icon: mdi:flash
    layout: vertical
    tap_action:
      action: navigate
      navigation_path: /dashboard-mush/power
    icon_color: yellow

The helper that controls the color of the light bulb only queries the status of all lamps in the house. New lamps must of course always be added.

{{ is_state('light.hue_white_lamp_1', 'off') and
             is_state('light.aqua_lichtschalter_licht', 'off') and
             is_state('light.aqua_lichtschalter_licht_2', 'off') and
             is_state('light.wohnzimmer', 'off') and
             is_state('switch.shelly_shsw_l_98cdac2ff7e6', 'off') and
             is_state('switch.keller_werkbank', 'off') and
             is_state('switch.wiz_socket_a9342d', 'off')  and
             is_state('light.wiz_rgbw_tunable_90a162', 'off')
             }}

Leave a Comment

Data protection
I, Guido Jeuken (Place of residence: Germany), process personal data to operate this website only to the extent technically necessary. All details in my privacy policy.
Data protection
I, Guido Jeuken (Place of residence: Germany), process personal data to operate this website only to the extent technically necessary. All details in my privacy policy.