Dashboard med Home Assistant till mitt smarta hem
I mitt smarta hem använder jag en dashboard med home assistant för att få en snabb överblick över det jag tycker är viktigt i mitt hem. Viss information presenteras på startsidan och sedan har jag skapat olika sidor för t ex rum eller funktion. Under en tid hade jag två st Dashboards, en för att presentera information på större skärmar som min ipad som är monterad köket och en annan dashboard för mobiler. Det fungerade bra men pga för mycket underhåll har jag nu återgått till att bara ha en Dashboard. Själva Dashboarden är egentligen bara kosmetiskt och det går att spendera hur mycket tid som helst att ändra och lägga till.
Vad använder jag
– Raspberry Pi 4
– Home Assistant
– En äldre iPad air
Äldre iPad monterad på vägg. Fästet är köpt på Kjell och Company: Väggfäste för surfplatta 7-12”
Dashboard jag använder idag
Min Dashboard förändras hela tiden. Under 2022 använde jag en Dashboard som vad baserad på Floorplan och efter ett tag tröttnade jag på den och nu är Dashboard baserad på bilder och Ikoner. För att få lite liv i Ikonerna är de flesta animerade.
De flesta ikoner är baserade på Mushroom template card. De animerade ikonerna hittade jag på Home Assistant Community via länken:
https://community.home-assistant.io/t/mushroom-cards-build-a-beautiful-dashboard-easily/388590/3240
Det som jag modifierade var hur stora Ikonerna skulle vara då jag tyckte att standard var lite väl små.
För att göra ikonerna större använde jag mig av:
card_mod:
style:
mushroom-card: |
:host {
–mush-icon-size: 80px;
}
För att skapa genvägar till mina andra sidor använder jag mig av funktionen navigate som finns inbyggt i Mushroom template card
Olika sidor med info
När jag klickar på ikonen med en skiftnyckeln på kommer jag till min sida inställningar:
Här har jag samlat lite info om ljussensorer, inställningar om ljusvärden, switch för att stänga av alla automationer och t ex kan ställa tid när motorvärmaren ska gå igång. Har även samlat alla mina timers som jag tycker är viktiga.
Home Assistant har en energisida men jag skapade min egna för att se dagens förbrukning med fler detaljer som hur mycket solcellerna producerar, Import och export, energiförbrukning på enskilda enheter/grupper
La upp en video på mitt x konto hur det ser ut på mobilen: https://twitter.com/TeknikiHemmet/status/1700479380865093986?s=20
En sida som är under uppbyggnad är min sida om nätverk. Här presenteras t ex QR kod för Wifi nätverket för att underlätta för gäster.
Dashboard för Mobil
För mobiler med mindre skärm använder jag kort i Home Assistant samt Mushroom cards som jag tycker fungerar bra och det ser snyggt ut. För att få till utseendet jag vill ha har jag mixat korten lite.
Mushroom Alarm Card för att ändra status på mitt egna larm.
Bild för att visa status på sensorer, samt belysning. Detta kort blir mörkt när hjälparen mörkt ute slår om.
Bildentitet för att visa kameran vid entren
Custom button card använder jag som genvägar till andra sidor. Vissa av ikonerna ändras beroende på status. Tex fläkten går fortare när jag har fläktläge hög på FTX systemet och brevlådan ändras till grått och annan symbol när jag har hämtat posten.
Loggboken använder jag för att visa status på vissa saker. Här har min Automower ändrat status.
Ovan en bild från ett av rummen där jag använder korten Mediaspelare, Custom shutter card, Mushroom Light card och Mushroom Chips Card
Funktioner
Automatisk ändring från Ljust till Mörkt tema
För att ändra ljust och mörk tema använder jag ljussensorer som är placerade i huset. Dessa ljussensorer ändrar status på en hjälpare i Home Assistant och på så sätt kan jag ändra tema om det är mörkt inne eller ljust inne.
Har även några fler hjälpare som växlar ljust och mörkt läge för att styra belysning. Har ett inlägg om denna funktion här: Styra belysning med ljussensor i Home Assistant
Funktion för att ändra bild på kort
En annan funktion som jag har är att jag ändrar kortet på huset på min Dashboard när det blir mörkt ute. Skapade denna funktion för att se symbolerna för fasad och trädgårdsbelysningen på ett bättre sätt.
Funktion för att automatiskt visa bilden för kameror
När sensorerna i trädgården indikerar rörelse så ändrar jag sida, från Hem till Kamera. Efter 1 minut växlar jag tillbaka till Hem-sidan
För att få till denna funktion använder jag mig av integrationen browser-mod
Funktion för att göra skärmen svart på Ipad som är monterad i köket
Använder sedan en tid tillbaka en funktion med Apple HomeKit för att skapa denna funktion. Genom att använda Apples funktion Guidad åtkomst kan jag med hjälp av HomeKit tända och släcka skärmen på min iPad. Vad jag har gjort är att importera en sensor från Home Assistant till Apple Home. När sensorn i Apple home triggas får jag till funktionen.
Funktion för att växla tillbaka till hemläge
Hemskärmen vill jag alltid ha som default läge. Har märkt att om någon trycker för att komma till vyn för t ex temperatur eller kamera så växlar man inte tillbaka till hem läget. För att alltid visa hem läget skapade jag en timer på 30 sekunder. Timern startar när vyn ändras från hem och när timern har räknat ner byter jag läge till hem. Den här funktionen använder integrationen browser-mod och timer funktionen i Home assistant.
Exempel på kort jag använder i Home Assistamt
Skapa en Dashboard med Home Assistant
En video där jag skapar en Dashboard i Home Assistant för mitt smarta hem. Använder Mushroom cards, Sun card och standard kort i Home Assistant. Allt byggt med hjälp av Home Assistant rutnät. Närvaro, Nätverk, energi. Status på enheter och genvägar till andra sidor.
Läs mer om mitt smarta hem: Smarta Hem – Home Automation
Läs mer om min installation av Home Assistant: Home Assistant Kontroller
Dashboard med Floorplan
Under 2022 använde jag en dashboard med floorplan men tröttnade på den. Låter denna bild ligga ute en stund till…
Bildelement i Home Assistant som visar status på temperatursensorer och smartplugs
Bakgrunden är ett ölglas
Temperatur sensorn är en Aqara och smart plug är Philips Hue.
Jag använder dessa när jag brygger öl och kan då reglera temperatur i skåpet under jäsprocessen.
ikonerna visar olika färg beroende på status. Om kylen slås på blir ikonen blå.
Exempel på hur jag får Filter att visa olika färger beroende på status.
elements:
- entity: sensor.temperature_60
prefix: 'Skåp '
style:
color: white
font-size: 100%
left: 20%
top: 49%
type: state-label
- entity: switch.on_off_plug_in_unit_33
icon: 'mdi:radiator'
style:
'--paper-item-icon-color': 'rgb(79, 34, 2)'
'--paper-item-icon-active-color': red
color: null
left: 38%
top: 49%
type: state-icon
image: local/images/Öl2.PNGAnimerade Ikoner
För att få lite mer liv och rörelse på min dashboard valde jag att lägga till en rad med ikoner som jag gjorde rörliga.
Alla dessa är gjorda med Button Card: https://github.com/custom-cards/button-card
Fläkt som symboliserar hastighet på mitt FTX aggregat. Ikonen snurrar fortare ifall ventilation hög är aktiverad.
Brevlådan ändrar ikon vid aktivering. Ikonen blir gul och svajar fram och tillbaka.
Termometern visar utetemperatur och ikonen ändrar färg beroende på temperatur.
För att få ikonen att snurra gjorde jag så här:
type: 'custom:button-card'
entity: switch.ventilation_aktiverad
name: Ventilation
icon: 'mdi:fan'
color: blue
style: |
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
ha-icon {
animation: {% if is_state('switch.ventilation_hog_aktiverad', 'on') %} spin 1s linear infinite {% endif %};
}
ha-icon {
animation: {% if is_state('switch.ventilation_hog_aktiverad', 'off') %} spin 5s linear infinite {% endif %};
}