Du har säkert sett detta innan. Och det finns många andra guider med. Jag har själv följt en av dessa. Hur bra de än var så saknade jag en på svenska samt även att kunna ladda ner några exempel för att enklare kunna prova mig fram.
Så vad är det då. Kort svar en bild där du ser om rummet är tänt eller släckt. Och som bonus lite andra sensorer som temperatur, TV osv. Du kommer även få ditt hus i 3d vilket säkert kan vara bra i andra samanhang med. Det fungerar i korthet så att du har en statisk bild där du lägger andra bilder på. Med state image i lovelace.
Och en liten nackdel. Har du 5 olika lampor i ett rum så visar denna bara av eller på efterssom du bara valt en lampa/switch. Vill du kan du ju i teorin skapa massor av mer bilder för varje state tex för en liten lampa som står i köksfönstret. Du skulle då behöva rendera galet många fler bilder och jag tror det skulle bli ganska rörigt. Bättre är istället att skapa grupper med ljus (light groups) som du använder för av och på.
För att få detta att fungera kommer du behöva:
Home Assistant med Lovelace
Några enteties i HA för ljus
GIMP (din open source fotoeditor)
Sweet Home 3d (eller liknande program)
Olika bilder för varje rum samt bilder för tänt/släckt
Massor av tålamod
Sweet Home 3d
Ett bra program som dessutom är gratis att använda är Sweet Home 3d. Det är lite över detta inäggs scope att gå igenom programmet i detalj men några tips kan vara att:
- Hitta en ritning på ditt hus i papper. Skanna den eller ta ett kort. I programmet väljer du Plan > Import background image. Din ritning lägger sig som en bakgrund och startar en wizard där du kan definera din skala. Gör detta rätt. Det är tråkigt att behöva skala om allt sen eller komma på att väggarna sitter fel.
- När du dragit väggarna så skapa rum. Du gör det genom att dubbelklicka i ett rum som är “tätt”. Det måste alltså vara väggar runt om.
- Importera möbler och annat. Ladda ner från tex 3dwarehouse. De möbler som följer med är fula som stryk. Alternativt är programmet utvecklat i ett annat land där de har en annan möbelsmak.
- Skapa alla fönster och dörrar. Det påverkar ljuset och renderingen sen.
- Lägg inte till ljuskällor utan att tänka igenom detta. Lite beroende på om du skall ha det som en 3d vy i Home Assistant kan det vara vettigt att skapa två olika filer man jobbar med då man är klar.
- Fixa allt supernoga innan du renderar filen. Det kan ta två timmar att rendera en bild i högsta läget och man vill inte göra om detta för man missat en liten detalj.
- Spara din viewpoint. Döp den till något bra för att kunna rendera bilden från samma vinkel nästa gång. (ctrl+alt+R)
Bilder och GIMP
När du ritat upp ditt hus i Sweet Home 3d så kommer du behöva rendera två bilder från samma viewpoint. En där lamporna är på och en där de är av. Du kan välja en tid på dygnet med. Bilden där ljuset är på kan vara 12:00 medans bilden då ljuset är va kanske skall vara 21:00. Du kan använda egna ljuskällor med men bäst blir kanske att använda “add ceeling lights” i renderingsvyn. Då skapas ljus från taket. Notera att du måste ha definberat rum för att detta skall fungera. Det påverkar det färdiga resultatet. När du är klar med renderingen så spara bilderna i ganska bra upplösning.
Ovan är min hus on bild. Den som heter houseon2.3.png. Du kan spara ner och testa med denna om du vill. Notera att du måste ha transparent bakgrund som du ser nedan i Gimp. Du lägger till en alphachannel för detta. Sudda bort allt utanför huset och spara. Detta kommer vara din standardbild för huset.
Nästa steg är att skapa off bilder för varje rum. Detta tar en del tid och är lite pilligt. Viktigt här är att du har exakt samma storlek på din bild. Ladda in din renderade ljus av bild. Se till att du har transparens. Du kommer skapa en bild för varje rum. Så spara undan din orginalfil så du inte sparar över den.
Min fil heter kitchenoff.png och är denna nedan. Du behöver en sådan för varje rum. Samma storlek.
Du kommer även behöva en liten bild för att trycka av och på ljuset. Du skulle kunna göra detta på andra sätt med men jag tycker detta funkar bra. Min bild är nedan.
lightsmall.png
När du är klar med alla eller några bilder så spara desssa i /local/images i Home Assistant.
Home Assistant och vyn
Nu när du har alla bilder (antagligen har du inte det för det var så tråkigt att göra det så du ville testa med ett rum först) så är det dags att skapa en vy i Home Assistant. Du vill kanske inte ha detta i en befintlig vy då det kommer se väldigt smått ut. Du kommer behöva sätta Panel Mode till on om du vill se den i fullskärm. Fast samtidigt så kan du inte editera den då. Så bäst är att byta panel mode mellan on och off så du kan editera koden.
Skapa ett kort som nedan. (den nedersta alltså) Det kommer inte se speciellt bra ut efterssom dina sensors inte heter som mina. Börja att byta en i taget. Har du inte så många switchar eller vill testa utan att tända och säcka hela huset så kan du skapa dummy switches som i den översta koden. Lägg dem i din konfigurationsfil.
input_boolean: dummy1: name: Dummy1 initial: on icon: mdi:timer dummy2: name: Dummy2 initial: on icon: mdi:timer
Så vad gör denna kod nedan då. Den översta delen visar de släcka bilderna om den är off. Är den on visar den bilden nedan. Ser du den inte? Den heter transparant_square.jpg och är just osynlig men du kan nog ladda ner den om du håller musen över. Spara denna bland de andra filerna med.
Viktigt att du använder tap_action: none så man inte kan trycka här. Alla dina rum skall vara med här.
elements: - entity: light.roof_kitchen_level hold_action: none state_image: 'off': /local/images/kitchenoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: light.roof_main_bathroom_level hold_action: none state_image: 'off': /local/images/mainbathroomoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: switch.telldus2_switch hold_action: none state_image: 'off': /local/images/lekdeloff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: switch.telldus1_switch hold_action: none state_image: 'off': /local/images/klkoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.timers hold_action: none state_image: 'off': /local/images/klkoutsideoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: light.roof_livingroom_level hold_action: none state_image: 'off': /local/images/livingroomoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy1 hold_action: none state_image: 'off': /local/images/bedroomoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy2 hold_action: none state_image: 'off': /local/images/entreoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy3 hold_action: none state_image: 'off': /local/images/edvinoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy4 hold_action: none state_image: 'off': /local/images/tvattstugaoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy5 hold_action: none state_image: 'off': /local/images/ludvigoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy6 hold_action: none state_image: 'off': /local/images/arvidoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy7 hold_action: none state_image: 'off': /local/images/litetbadrumoff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: input_boolean.dummy8 hold_action: none state_image: 'off': /local/images/halloff.png 'on': /local/images/transparent_square.png style: left: 50% top: 50% width: 100% tap_action: none type: image - entity: light.roof_kitchen_level image: /local/images/lightsmall.png style: height: 30% left: 60% top: 61% width: 3% tap_action: action: toggle type: image - entity: light.roof_main_bathroom_level image: /local/images/lightsmall.png style: height: 30% left: 60% top: 27% width: 3% tap_action: action: toggle type: image - entity: switch.telldus1_switch image: /local/images/lightsmall.png style: left: 61% top: 27% width: 3% tap_action: action: toggle type: image - entity: input_boolean.timers image: /local/images/lightsmall.png style: left: 68% top: 27% width: 3% tap_action: action: toggle type: image - entity: switch.telldus2_switch image: /local/images/lightsmall.png style: left: 15% top: 63% width: 3% tap_action: action: toggle type: image - entity: light.roof_livingroom_level image: /local/images/lightsmall.png style: height: 30% left: 82% top: 60% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy1 image: /local/images/lightsmall.png style: height: 30% left: 76% top: 40% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy2 image: /local/images/lightsmall.png style: height: 30% left: 48% top: 90% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy3 image: /local/images/lightsmall.png style: height: 30% left: 21% top: 39% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy4 image: /local/images/lightsmall.png style: height: 30% left: 39% top: 75% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy5 image: /local/images/lightsmall.png style: height: 30% left: 39% top: 42% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy6 image: /local/images/lightsmall.png style: height: 30% left: 49% top: 41% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy7 image: /local/images/lightsmall.png style: height: 30% left: 19% top: 54% width: 3% tap_action: action: toggle type: image - entity: input_boolean.dummy8 image: /local/images/lightsmall.png style: height: 30% left: 49% top: 68% width: 3% tap_action: action: toggle type: image - entity: sensor.multisensor_main_bathroom_temperature style: background-color: green border-radius: 10% color: white font-weight: 500 left: 65% text-align: center top: 17% type: state-label - entity: sensor.multisensor_playroom_temperature style: background-color: green border-radius: 10% color: white font-weight: 500 left: 25% text-align: center top: 57% type: state-label - entity: sensor.multisensor_main_bathroom_relative_humidity style: background-color: green border-radius: 10% color: white font-weight: 500 left: 25% text-align: center top: 67% type: state-label - color: red color_locked: green color_type: icon entity: lock.ytterdorr style: left: 48% top: 67% width: 6% type: state-icon - entity: media_player.living_room_tv style: background-color: none border-radius: 10% font-size: 10px font-weight: 500 left: 77% text-align: center top: 41% type: state-icon image: /local/images/houseon2.3.png type: picture-elements
Nu komer den nedre delen av koden.
lightsmall.png kan du byta till vad du vill. Detb är din knapp. Du kanske ser att det är olika % under style. Detta är var bilden placeras. Du kommer behöva växla till panel mode off, sitta och testa dig fram tills den är på rätt plats. Inte så svårt.
- entity: input_boolean.dummy2 image: /local/images/lightsmall.png style: height: 30% left: 48% top: 90% width: 3% tap_action: action: toggle type: image
Bonus
Det sista är lite olika sensorer. Kikar du nedan ser du att det är en state-label. Den visar temperaturen i badrummet.
- entity: input_boolean.dummy2 image: /local/images/lightsmall.png style: height: 30% left: 48% top: 90% width: 3% tap_action: action: toggle type: image
Du kanske även ser en TV. Jag har en LG och slår man på Netflix kommer bilden byta. Man skulle kunna rendera en egen bild med en upplyst TV men har inte riktigt orkat göra detta.