HA 自定义用户界面的外观StatesUI和lovelaceUI

最新推荐文章于 2024-06-19 09:34:38 发布
最新推荐文章于 2024-06-19 09:34:38 发布
阅读量1.9k 收藏 1
点赞数 1
分类专栏： Homeassistant
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44968310/article/details/89520149
版权

statesUI教程：http://tieba.baidu.com/p/6086711461
在configuration.yaml中有group: !include groups.yaml
故打开groups.yaml，

bitcoin:
  name: 比特币
  entities:
    sensor.exchange_rate_1_btc, sensor.trade_volume

安装以上教程有可能无法显示所见内容，易错地方是：LoveLace默认模式为前端编辑模式,若要启用yaml模式,在configuration.yaml文件中添加如下代码

lovelace:
  mode: yaml

另中文为乱码，需要修改编码为utf8

在Home Assistant上设置Lovelace，https://blog.csdn.net/hjf0124/article/details/86686815，https://www.hachina.io/docs/15789.html

梨树SH远帆
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
my-ha-setup:Home Assistant lovelace 布局和配置
08-04
家庭助理设置 布局以移动设备为先，针对所有屏幕尺寸进行了全面优化。 现在打牌 控制视图 信息视图 图形行 网络统计 感应卡 平铺视图 ...使用的自定义插件 ... 跳到lovelace布局 自定义实现 这些是我使用 Home
HomeAssistantLovelaceUI的简约图形卡
08-08
Home Assistant Lovelace UI的简约图形卡
推荐开源项目：NSPanel Lovelace UI - 打造个性化的智能家居控制面板
最新发布
gitblog_00037的博客
06-19 237
推荐开源项目：NSPanel Lovelace UI - 打造个性化的智能家居控制面板 项目地址:https://gitcode.com/joBr99/nspanel-lovelace-ui 如果你正在寻找一个可以将你的NSPanel屏幕转变为与HomeAssistant风格一致的智能家庭控制中心，那么这个开源项目——NSPanel Lovelace UI 将是你的不二之选。不仅美观易用，而且支持...
标题：打造简洁高效的智能家居界面：UI-Lovelace-Minimalist
gitblog_00028的博客
06-07 360
标题：打造简洁高效的智能家居界面：UI-Lovelace-Minimalist 项目地址:https://gitcode.com/UI-Lovelace-Minimalist/UI 在智能家庭自动化领域，一个直观易用的用户界面是提升体验的关键。UI-Lovelace-Minimalist 就是一个专为 HomeAssistant 设计的“主题”，它提供了美观且功能强大的界面解决方案。这个开源项目...
Lovelace:样式指南和与语言无关的UI组件框架
05-20
Lovelace UI组件的语言和框架不可知的体系结构，再加上样式向导自动生成器，因此您再也不会拥有架构欠佳的前端代码。 Lovelace提供了一种高度结构化的格式，可用于编写面向用户HTML，CSS，JavaScript和测试。 然后，将这种格式自动翻译成完整的生活风格指南，代码文档（尽可能自动）和每种现代语言的API，以完全相同的语法访问所有这些组件*（使用参与式，大致基于C的语言） 。 Lovelace在Node，Ruby中工作，甚至提供了几个命令来将您的组件构建到客户端javascript文件中，该文件公开了与服务器端语言所使用的方法完全相同的方法。 目录 发展 测验 执照 例子 完整的真实世界示例 滑轨 将Lovelace添加到您的Gemfile中： # Gemfile gem 'lovelace' 在您的应用程序控制器中需要lovelace： # app/c
home-assistant-customizer:家用辅助CustomUI的配套组件
05-16
家庭辅助定制程序组件 用于自定义组件 （可选）加载CustomUI文件。 [HA 0.53+] 指定要从more-info窗口中隐藏的属性列表。 在more-info窗口中隐藏CustomUI-相关属性。 [HA 0.53+] 添加用于动态定制的服务。 设置UI列的宽度和数量（需要CustomUI 20180112+） 正在安装 将customizer目录放在<ha>/custom_components/ 使用 configuration.yaml选项（所有可选）： 属性 类型 描述 custom_ui [HA 0.53+] 本地/托管/调试version_tag 是否获取CustomUI文件。 local从<config>/www/custom_ui/state-card-custom-ui.html加载它。 hosted从加载debug从加载
推荐开源项目：Lovelace custom-ui - 美观与实用的家居控制界面升级
gitblog_00063的博客
06-03 311
推荐开源项目：Lovelace custom-ui - 美观与实用的家居控制界面升级 项目地址:https://gitcode.com/bramkragten/custom-ui 1. 项目介绍 Lovelace custom-ui 是一个专为Home Assistant打造的定制化元素库。它提供了几个独特且功能强大的自定义卡片，帮助用户提升Home Assistant的用户界面体验，让家庭自动化...
ha-simple-card:lovelace简单卡
03-05
家居辅助简单卡 开发人员预览版v0.0.9最终版本我仍在寻求帮助，如果有人可以帮助我完成并改善卡片布局，我们将非常高兴。 要求 家庭助理0.116.4 ... 在ui-lovelace.yaml或原始配置编辑器UI的顶部添加对ha-
mini-graph-card:家居助手Lovelace UI的简约图形卡
04-29
Lovelace迷你图形卡用于 Lovelace UI的简约且可自定义的图形卡。 该卡可与sensor ＆ binary_sensor域中的实体一起使用，并显示传感器的当前状态以及历史记录的折线图表示。安装HACS（推荐） 该卡在 （家庭助理社区...
ha-layoutcard:lovelace卡的放置
04-12
家居助手布置卡 开发人员预览版最终Version 0.1.1我仍在寻求帮助，如果有人可以帮助我完成并改善卡的布局，我将非常高兴。 要求 家庭助理2021.1.4 ... 在ui-lovelace.yaml或原始配置编辑器UI的顶部添加对ca
lovelace-multiple-entity-row：在Home Assistant的Lovelace UI中的实体行上显示多个实体状态和属性
02-18
多实体行 在家庭助理的Lovelace用户界面中的实体行上显示多个实体状态，属性和图标 注意：这不是独立的lovelace卡，而是卡的行元素。 安装 将手动添加到您的<config>/www/文件夹，并将以下内容添加到configuration.yaml文件： lovelace : resources : - url : /local/multiple-entity-row.js?v=4.1.1 type : module 或使用安装并添加以下内容（如果处于YAML模式）： lovelace : resources : - url : /hacsfiles/lovelace-multiple-entity-row/multiple-entity-row.js type : module 不使用YAML模式时，可以在配置-> Love
Home Assistant Lovelace UI的简约正常运行时间卡-JavaScript开发
05-26
正常运行时间卡一种极简主义的卡，受reddit状态UI的启发，可以很好地显示二进制传感器。 安装:warning:版本0.xx不太稳定正常运行时间卡这是一个受reddit状态UI启发的简约卡，用于以一种很好的方式显示二进制传感器。 安装:warning:版本0.xx不太稳定，仍然有很多错误，如果遇到错误或有功能要求，请创建一个问题。 HACS（推荐）该卡在HACS（家庭助理社区商店）中可用。 手动安装从最新版本下载uptime-card.js并将其复制到config / www目录中。 添加资源引用insid
mini-media-player:用于Home Assistant Lovelace UI的简约媒体卡
04-28
迷你媒体播放器 用于 Lovelace UI的简约但可自定义的媒体播放器卡。 受启发和 。 安装 可以在 （家庭助理社区商店）中使用此卡 安装简单 从下载mini-media-player-bundle.js并将其复制到config/www目录中。 在您的configuration.yaml或通过“资源”选项卡中的Home Assistant UI添加对mini-media-player-bundle.js的引用。 resources : - url : /local/mini-media-player-bundle.js?v=1.12.1 type : module CLI安装 移到您的config/www目录 抓取mini-media-player-bundle.js $ wget https://github.com/kalkih/mini-media-play
HomeAssistant中默认lovelace媒体播放器卡的缩小版本
08-11
Home Assistant中默认lovelace媒体播放器卡的缩小版本
hass-config:设计Lovelace UI的另一种方式
05-04
家庭助理配置 在在 。 我的用例是平板电脑[ ]，它在以及使用 （chrome）在桌面上显示Home Assistant。我的配置暴露给HomeKit，Apple TV作为远程连接的集线器。我还支持 。 如果您喜欢这里的任何东西，请务必 :glowing_star: 我的回购！ 特征 在使用设计另一种 显示更多信息，以使界面更整洁 响应缓慢的实体（例如，启动计算机）的加载轮。 使用自动化侦听事件将声音添加到UI 基于状态的CSS动画 侧边栏 图片元素卡中的Markdown卡可创建动态模板。 根据一天中的时间问候的时间和日期 使用自然语言打开的灯和开关 根据天气情况使用表情符号显示温度 重要日历信息 其他条件警报 侧栏页脚 底部的三个图标按顺序排列 控制机器人真空的卡 Monitor Home Assistant ， 平板电脑和网络附加存储 列出可用的HACS更新和Home Assistant的发行说明
animated-consumption-card:用于家庭助手Lovelace UI的带有动画家庭消费的卡
05-24
动画消费卡这是带有Home Assistant自定义ui卡animated-consumption-card 。 该卡片显示了一个简单的动画，您的房屋正在消耗多少资源： 要使用它，您需要在家庭助手中随您的消费配备一个传感器，并将其传递到此UI卡。...
Home Assistant初学者指南 -4 之 如何在Home Assistant上设置Lovelace
热门推荐
hjf0124的博客
01-29 1万+
Lovelace是Home Assistant的新成员。允许自定义用户界面的外观和可用性。在本文中，我将向您展示如何在Home Assistant上设置和配置Lovelace。另外，我将介绍一些可用于自定义Web界面的不同卡片样式。   创建一个Lovelace yaml文件 您需要做的第一件事是在Home Assistant Config 文件夹中创建一个名为ui-lovelace.ya...
Home Assistant使用ios主题更换背景
春天不是读书人的博客
11-12 3633
Home Assistant 使用ios主题，更换背景

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值