Calendário Familiar Inteligente DIY para Casa (Clone do Skylight)

📖 Introdução
Minha esposa tem sido recentemente bombardeada nas redes sociais com anúncios de calendários inteligentes para casa (Skylight, Cozyla, Hearth) e estava pronta para gastar mais de US$ 300 em um. Antes de dar o sinal verde, pedi uma chance para pesquisar sobre eles. Percebi que a maioria oferecia funcionalidades semelhantes, mas diferiam significativamente no preço. Mais importante ainda, não vi nenhum recurso excepcional que eu não pudesse implementar no Home Assistant.
O Objetivo: Um calendário touchscreen aprovado pelo WAF (Fator de Aceitação da Esposa), amigável para bancada, que se integra profundamente à nossa casa inteligente sem taxas mensais.
💡 Por que fazer você mesmo?
Optar pela rota DIY com Home Assistant trouxe vários benefícios em relação à compra de um display Skylight/Hearth:
- Sem taxas mensais: Evita assinaturas para recursos "premium".
- Integração perfeita: Interage com nossas luzes, tarefas (Grocy) e sensores de presença.
- Hardware antigo: Reaproveitei um Mini PC e um monitor padrão.
- Privacidade: Sem dependência de fornecedor ou risco da empresa encerrar operações.
🛠 Seleção de Hardware
Atualmente, este projeto foi feito para exibir o painel em qualquer tela HD (1920x1080).
No meu caso, a exigência era que ele "parecesse" com um Skylight, fosse touchscreen, ficasse na bancada e pudesse ser movido para diferentes locais. Por isso, escolhi o hardware descrito abaixo. No entanto, seu caso pode ser diferente e você precisará ajustá-lo conforme necessário, por exemplo, se quiser exibir em um tablet ou outro dispositivo.
O hardware que usei originalmente foi escolhido com base no que mencionei acima, além da esperança de poder estender funcionalidades usando a webcam, alto-falante e microfone. Atualmente, provavelmente montaria diferente, já que ainda não tive tempo de implementar essas ideias adicionais de hardware.
- Monitor: HP Engage Touchscreen de 15 polegadas. Escolhi este ao invés de monitores portáteis genéricos porque inclui alto-falante, webcam e microfone integrados, permitindo controle por voz ou chamadas de vídeo no futuro.
- Computador: Um Mini PC antigo (NUC/Tiny PC) rodando Windows/Linux em modo Kiosk, ou um Raspberry Pi 4.~~
✨ Funcionalidades
- Visões de família e individuais: Ative ou desative os calendários de membros específicos da família.
- Sincronização bidirecional: Edite eventos na tela ou em nossos celulares (Google Calendar).
- Popup "Adicionar Evento": Uma interface personalizada para adicionar eventos a calendários específicos diretamente da tela.
- Clima e Data: Cabeçalho bonito e de fácil visualização.
- Responsivo: Ajusta automaticamente a quantidade de dias exibidos conforme a largura da tela (Mobile vs Desktop).
⚙️ Guia de Instalação
Nota: Esta configuração utiliza um Pacote YAML para criar automaticamente todos os auxiliares, scripts e variáveis necessários para você. Não é necessário criá-los manualmente.
1. Pré-requisitos (HACS)
Você deve ter o HACS instalado. Por favor, instale as seguintes integrações de Frontend:
week-planner-cardbubble-cardconfig-template-cardcard-modbetter-moment-cardweather-cardbrowser_mod(Necessário para os popups funcionarem)layout-card(Necessário para a visualização de Seções)button-card(Necessário para o popup de adicionar evento)
2. O Backend (O Cérebro)
- Abra seu arquivo
configuration.yamlno Home Assistant. - Certifique-se de que esta linha está adicionada sob
homeassistant:para habilitar pacotes:
homeassistant:
packages: !include_dir_named packages
``
- Crie uma pasta chamada
packages no seu diretório de configuração do HA (caso ainda não exista).
Baixe packages/family_calendar.yaml deste repositório.
Procure pela string [ #<--- UPDATE THIS ENTITY] e atualize o ID da entidade do calendário para coincidir com o seu ambiente. Veja a seção 3 para mais detalhes.
Coloque o arquivo dentro da sua pasta packages/.
Reinicie o Home Assistant. 3. Os Calendários
Você pode usar Calendários do Google ou Calendários Locais.
#### Opção A: Reutilizar Nomes de Calendário (Mais Fácil)
- Vá em Configurações > Dispositivos e Serviços.
- Adicione a integração Calendário Local.
- Crie calendários com exatamente estes nomes:
calendar1, calendar2, calendar3, calendar4, Family.
Se você usar esses nomes, o código funciona imediatamente!*#### Opção B: Calendário Personalizado
- Vá em Configurações > Dispositivos e Serviços.
- Adicione a integração Calendário Local ou Google Calendar.
- Navegue até Configuração > Integrações > Calendário Local ou Google Calendar e selecione "Adicionar Entrada"
- Para cada entrada criada, obtenha o ID da entidade para atualizar o arquivo dashboard.yaml.
- Abra o
dashboard.yaml.
Procure por # <--- UPDATE THIS ENTITY.
Atualize o ID da entidade de acordo com o seu ambiente
#### Configurando Feriados
Desde as atualizações do Home Assistant, os feriados agora são adicionados via interface:
- Vá em Configurações > Dispositivos e Serviços > Adicionar Integração > Holiday.
- Selecione seu país.
- Verifique o ID da entidade (ex.:
calendar.holidays). Se for diferente do padrão, atualize-o no YAML do dashboard.4. O Dashboard (A Aparência)
- Vá para Configurações > Painel de Controle
- Clique em Adicionar Painel de Controle (Selecione a opção "Novo Painel de Controle do Zero" e certifique-se de selecionar "Adicionar à barra lateral").
- No menu à esquerda, selecione o painel recém-criado e clique no ícone de lápis para editá-lo.
- Selecione o ícone de 3 pontos e escolha "Editor de configuração bruta".
- Copie e cole o código de dashboard.yaml.
Passo 5: O Tema (Opcional)
Para obter o visual da fonte específica (Ovo):
- Certifique-se de que seu
configuration.yaml tenha esta linha em frontend:
`yaml
frontend:
themes: !include_dir_merge_named themes
`
- Crie uma pasta chamada
themes no seu diretório de configuração.
Baixe themes/skylight.yaml e coloque-o nessa pasta.
Use o Editor de Arquivos e faça o upload do calbackgrd.png para a pasta /www/, que é traduzida internamente como /local no painel.
Reinicie o Home Assistant.
Vá até o seu Perfil (Ícone de Usuário no canto inferior esquerdo) e altere o Tema para Skylight.
NOTA: O tema não é abrangente, então tenha isso em mente
📐 Como Funciona (Por Trás dos Bastidores)
Lógica de Filtro
O
week-planner-card não suporta nativamente ocultar calendários específicos dinamicamente. Para resolver isso, utilizei Input Texts atuando como filtros Regex. Quando você clica no botão de uma pessoa, ele alterna o filtro entre
. (Mostrar tudo) e ^$ (Não mostrar nada).
- O
config-template-card injeta essas variáveis no cartão de calendário dinamicamente.Script de Criação de Evento
O popup "Adicionar Evento" utiliza um único script que gerencia a lógica para múltiplas pessoas e tipos de eventos (Dia Inteiro vs Com Horário).
yaml
Simplified Logic Example
target_calendar: "{{ calendar_map.get(states('input_select.calendar_select')) }}"choose:
- conditions: "All Day Event is ON"
- conditions: "All Day Event is OFF"
NOTAS
Minha postagem original foi apenas para dar uma visão geral de alto nível de como fazer isso e permitir que as pessoas ajustem o código para funcionar em seus cenários específicos.
Em particular, fiz isso porque cada display e necessidade são diferentes. Não posso desenvolver para todos os tamanhos potenciais de displays, dashboards, etc. Então, foi feito para funcionar no display que mencionei ou em qualquer outro (1920x1080), mas deve ser editável para outros.
Falando sobre display, originalmente sugeri aquele porque estava em promoção no Woot e era uma forma muito econômica de obter um display touchscreen na época. Isso pode não ser o caso agora, então use qualquer display que funcione para você. Tablet, touchscreen, celular, o que preferir. O principal que você precisará editar é o dashboard.
--- Tranlated By Open Ai Tx | Last indexed: 2026-03-08 ---