[基础教程]【色彩缤纷】改变图标色彩，鲜明显示状态，估计有人看

本帖最后由 余歌唱晚 于 2018-1-23 16:55 编辑

经过前期不停的翻找帖子，翻墙找资料，问大家，总算对homeassistant有了一个大致的了解

不断的折腾中总有各种自己的想法

图标变化颜色就是其中之一

主要之想知道设备home away情况，方便快速发现离线设备

经过坛友提醒，加上自己验证，发现需要custom_ui rgb_color的调用需要custom_ui 。。。

翻找了论坛也没找到，爬墙找了一天。

现在把借(piao)鉴(qie)，和自己尝试的成果和大家分享一下

一句话说就是发现了 rgb_color 这个state

下面就分类用法给大家汇报一下

一、最简单的直接加颜色属性：

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.12.33.png (15.71 KB, 下载次数: 0)

下载附件

2018-1-22 22:13 上传

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.12.22.png (13.05 KB, 下载次数: 0)

下载附件

2018-1-22 22:14 上传

修改位置在customize.yaml 也可能在packages或其他，按照个人口味参考

sensor.helpweather_now_today:

friendly_name: 今天日期

homebridge_hidden: true

rgb_color: 255,0,0

复制代码

二、根据State(Filter states)状态改变颜色：

switch 系统自动就会变icon这也是我觉得可以自定义的原因

下右图片可以说明问题

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.26.15.png (21.97 KB, 下载次数: 0)

下载附件

2018-1-22 22:26 上传

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.28.35.png (31.79 KB, 下载次数: 0)

下载附件

2018-1-22 22:28 上传

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.30.42.png (14.97 KB, 下载次数: 0)

下载附件

2018-1-22 22:32 上传

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.31.32.png (37.74 KB, 下载次数: 0)

下载附件

2018-1-22 22:32 上传

修改位置在customize.yaml 也可能在packages或其他，按照个人口味参考

switch.coffee:

friendly_name: 咖啡机

icon: mdi:coffee-outline

templates:

rgb_color: if (state === 'on') return [50, 205, 50]; else return [255, 0, 0];

复制代码

这里是引入了一个templates 然后再加入rgb_color

一、有点小小小技术含量的属性判断增加颜色属性：

登录/注册后可看大图

屏幕快照 2018-01-22 下午10.36.17.png (52.45 KB, 下载次数: 0)

下载附件

2018-1-22 22:36 上传

特别感谢提供斐讯M1接入支持的各位大神…………

这里的空气质量是加了数值区间判断，想想是前端就按照JavaScript的代码规则试了试 结果成功了

我设置小于50绿色 50-100 橙色 100+红色，大家可以自行设置

sensor.m1_pm25:

icon: mdi:blur

templates:

rgb_color: if (state <= 50 ) return [50, 205, 50]; if (state > 50 && state <= 100 ) return [255, 215, 0]; else return [255, 0, 0];

复制代码

PS：斐讯M1的所有配置都在packages里面，把传感器写到customize.yaml 里面无效，直接在

packages修改有效，推断!include packages 优先级高于customize.yaml

小小分享，大神勿喷。这个是需要custom_ui 。。。

同类设备、同类state应该可以写成自动化 没必要和我一样 每一个都增加重复的属性

但是，我不会啊……官方文档的结构和查找还没有吃透，总查不到想要的东西。

希望大神们给写个自动化