🎛️ 空调控制中心卡片 —— 为多台空调而生的 Lovelace 自定义卡片

Doctor666

家里有 3 台、4 台甚至更多空调？一张卡片搞定全屋空调状态，点击进入精细控制。极简、丝滑、零延迟。


━━━━━ 主要特性 ━━━━━

🧊 多空调统一管理：一张卡片显示所有空调，按运行状态自动排序，开启的排前面，关闭的沉底

🎯 零配置自动发现：无需手写实体列表，自动扫描所有 climate.* 实体

🚫 内置排除规则：浴霸、热水器、取暖器自动过滤，不会误入卡片

🎨 卡片内详情页：点击空调卡片，卡片内部平滑滑出完整控制面板

🌫️ 毛玻璃详情背景：详情页弹出时，背后的列表视图磨砂模糊

⚡ 零延迟控制：乐观更新，点击瞬间变色、变数字，无需等待 HA 后端

🔘 长按连调：短按只调 1 度，长按连续调温

📊 室内温湿度副标题：标题下方显示室内温度和湿度

🌙 深色模式自适应：自动跟随 HA 主题切换

🎛️ 一键全关：标题右侧按钮，出门前一键关掉所有空调

❌ 快速关闭单台空调：列表项右侧电源图标，点击直接关机


━━━━━ 截图 ━━━━━



━━━━━ 安装 ━━━━━

方式一：手动安装（推荐）

第 1 步：下载 air-conditioner-card.js，放到 /config/www/ 目录下

第 2 步：打开 Home Assistant，进入 设置 → 仪表盘 → 右上角三点菜单 → 资源，添加以下内容：

URL：/local/air-conditioner-card.js?v=1.0.0
类型：JavaScript Module

第 3 步：强制刷新浏览器缓存

电脑：Ctrl + Shift + R
手机 HA App：设置 → 刷新缓存


方式二：HACS 安装

HACS 商店暂未收录，如需可提交 PR。


━━━━━ 配置 ━━━━━

最简用法（零配置，自动发现）：

type: custom:air-conditioner-card

卡片会自动扫描所有 climate.* 实体，并过滤浴霸、热水器、aupu、AUX、取暖器。


自定义配置（可选）：

type: custom:air-conditioner-card
exclude:
  书房
  climate.old_ac
temperature_sensor: sensor.xiaomi_mini_ccf0_temperature
humidity_sensor: sensor.xiaomi_mini_ccf0_relative_humidity
show_current: true
show_fan: true
show_switches: true


━━━━━ 视觉效果 ━━━━━

空调已关闭：灰色电源图标 + "已关闭" + 灰底

空调运行中：模式图标（雪花/火焰/水滴等）+ "制冷 · 中" + 模式主题色渐变

悬停 / 按下：卡片浮起 + 阴影加深 + 淡蓝边框

切换详情：卡片内部平滑滑出，列表视图毛玻璃模糊

手风琴面板：点击"模式 / 风速 / 控制"后，对应面板在按钮下方平滑展开


━━━━━ 技术细节 ━━━━━

零布局抖动：卡片高度动态测量，详情内容变化时平滑过渡

局部 DOM 更新：切换空调、点击按钮只更新必要节点

硬件加速：动画使用 transform + opacity，由 GPU 合成，60fps 丝滑

乐观更新：本地状态先行，HA 服务响应只做二次校验

实体隔离：多空调独立状态缓存，A 空调的操作不会污染 B 空调


━━━━━ 版本历史 ━━━━━

v1.0.0（初版）

多空调自动发现
内置排除名单（浴霸、热水器、取暖器）
卡片内详情页 + 毛玻璃背景
室内温湿度副标题
长按连调 / 短按单击
一键全关 + 快速关闭
深色模式
移动端适配


━━━━━ 常见问题 ━━━━━

Q：为什么我的浴霸 / 热水器也出现在卡片里？

A：检查实体 ID 和友好名称是否包含内置排除关键词。如果名称特殊，可以在 YAML 里加 exclude 自定义排除。


Q：温度调节一次跳好几度？

A：已在 v1.0.0 修复。点击少于 550ms 只调 1 度，长按超过 550ms 才进入连调。


Q：手机上显示不全？

A：卡片已针对小于 480px 屏幕做适配。建议卡片占满 1 列或 2 列。


Q：如何修改卡片标题？

A：修改 JS 文件中 _renderInitial() 里 title-text 的文字即可。


━━━━━ 反馈与支持 ━━━━━

有问题、建议、Bug 反馈，欢迎在帖子下方回复。如果卡片对你有帮助，点个赞让我知道 ❤️

lww107

楼主优秀，学习

x5333

感谢楼主分享，学习，

auditek

排除功能不起作用

Doctor666

auditek 发表于 2026-9-14 12:01
排除功能不起作用

可能设备有差异，可以丢给ai增加排除关键词

lcy07

感谢分享

Ari

这神级卡片前排留座，让我沾沾光