🎨 UI Дизайн

Настраиваемая панель управления

Узнайте, как отобразить текущее время на главной панели обзора Home Assistant и создайте персонализированную панель управления с временными виджетами.

О чем этот учебник

В этом учебнике вы узнаете, как добавить отображение времени на главную панель обзора (Overview) в Home Assistant. Это позволит вам видеть текущее время прямо на главной странице вашего умного дома, делая интерфейс более информативным и удобным.

Предварительные требования

Home Assistant установлен

У вас должен быть установлен и настроен Home Assistant на вашем устройстве.

🔧

Базовые знания

Понимание основных концепций Home Assistant и интерфейса Lovelace.

📱

Доступ к интерфейсу

Возможность доступа к веб-интерфейсу Home Assistant.

Пошаговое руководство

  • Шаг 1: Откройте редактор панели

    Перейдите на главную страницу Home Assistant и нажмите на три точки в правом верхнем углу панели обзора. Выберите "Изменить интерфейс" или "Edit Dashboard" из выпадающего меню.

  • Шаг 2: Добавьте новую карточку

    Нажмите на кнопку "Добавить карточку" (Add Card) в правом верхнем углу редактора. Появится окно выбора карточки с различными вариантами.

  • Шаг 3: Выберите карточку времени

    В поиске введите "time" или "время" и выберите карточку "Time" или "Часы". Эта карточка специально предназначена для отображения текущего времени.

  • Шаг 4: Настройте отображение

    В настройках карточки вы можете выбрать:

    • Формат времени (12 или 24 часа)
    • Отображение даты
    • Размер шрифта
    • Стиль отображения
  • Шаг 5: Сохраните изменения

    После настройки нажмите "Сохранить" в правом верхнем углу редактора. Теперь текущее время будет отображаться на вашей главной панели.

  • Расширенная конфигурация

    Использование YAML конфигурации

    Для более продвинутых пользователей вы можете добавить временную карточку через YAML редактор. Это предоставляет больше возможностей для настройки.

    # Пример YAML конфигурации для карточки времени type: custom:time-card name: Текущее время entity: sensor.time hour_format: 24 show_date: true date_format: DD.MM.YYYY styles: card: - font-size: 48px - color: var(--primary-color)

    Варианты настройки

    🎨

    Цветовая схема

    Настройте цвет и размер шрифта для соответствия вашему дизайну панели.

    📅

    Формат даты

    Выберите предпочитаемый формат отображения даты и времени.

    🌍

    Часовой пояс

    Убедитесь, что часовой пояс настроен правильно в настройках Home Assistant.

    Решение проблем

    ❌ Время не отображается

    Проверьте, что у вас установлен интегратор времени. Убедитесь, что сенсор времени (sensor.time) доступен в системе.

    ❌ Неверный часовой пояс

    Перейдите в Настройки > Система > Общее и проверьте правильность часового пояса.

    ❌ Карточка не обновляется

    Попробуйте обновить страницу браузера. Если проблема сохраняется, проверьте конфигурацию YAML на наличие ошибок.

    Советы и рекомендации

    💡 Совет 1: Используйте большие часы

    Разместите временную карточку в верхней части панели обзора для лучшей видимости. Увеличьте размер шрифта для легкого считывания с расстояния.

    💡 Совет 2: Добавьте приветствие

    Вы можете создать комбинацию с приветствием, которое меняется в зависимости от времени суток, используя автоматизации и шаблоны.

    💡 Совет 3: Интеграция с погодой

    Разместите временную карточку рядом с карточкой погоды для создания информативного виджета с погодными условиями и текущим временем.

    Дополнительные ресурсы