请选择 进入手机版 | 继续访问电脑版

『瀚思彼岸』» 智能家居第一站

 找回密码
 立即注册
查看: 3094|回复: 49

[新奇玩法] 不一样的lovelace ui !!! (一)

  [复制链接]

7

主题

201

帖子

1178

积分

金牌会员

Rank: 6Rank: 6

积分
1178
金钱
977
HASS币
20
发表于 2019-1-7 23:01:28 | 显示全部楼层 |阅读模式
本帖最后由 Lee 于 2019-5-8 11:01 编辑

传送门: 不一样的lovelace ui  !!!  (二) 动态化
传送门:不一样的lovelace ui  !!!  (三) 触控化
传送门:不一样的lovelace ui !!! (四) 0.92.2新版本


2019.5.8
本帖所有卡片效果基于0.88以下,新版本部分卡片可能无法使用。

首先,非常感谢K大分享他的作品,后面是原贴,感兴趣的移步这里并顶一下贴, https://bbs.hassbian.com/thread-6019-1-1.html

K大的作品里面介绍的很全面,我这里只用了他里面的毛玻璃插件:lovelace-card-modder

我超级喜欢那个半透明的效果,并尝试自己修改了一下,效果如下:

图一
1.jpg

图二
2.jpg

我设备不多,大多时候是用的HomePod语音控制,打开网页的次数不多,就没有做分页预览。




上面的代码控制做了一下注释,K大的帖子里面有,我还是重复标一下。

我这里主要是提供一下card-modder的卡片嵌套写法,这个是K大没有提到的部分,具体的看附件ui-lovelace

www文件解压,放到HA配置目录/www, JS引用,看配置文件。







3.png

ui-lovelace.zip

2.95 KB, 下载次数: 283

www.zip

33.34 KB, 下载次数: 229

评分

参与人数 2金钱 +30 收起 理由
Jones + 20 大神666!
windgo + 10 大神666!

查看全部评分

回复

使用道具 举报

1

主题

31

帖子

145

积分

注册会员

Rank: 2

积分
145
金钱
114
HASS币
0
发表于 2019-1-7 23:45:05 来自手机 | 显示全部楼层
好帖,点赞
回复

使用道具 举报

7

主题

1418

帖子

3868

积分

论坛元老

流水无味

Rank: 8Rank: 8

积分
3868
金钱
2450
HASS币
145

灌水之王

发表于 2019-1-8 07:37:19 | 显示全部楼层
不错 很详细 让不会的人都入门玩!
我最喜欢那个锁定插件
回复

使用道具 举报

0

主题

43

帖子

162

积分

轻度灌水用户

积分
162
金钱
119
HASS币
0
发表于 2019-1-8 07:39:39 | 显示全部楼层
刚入坑来学习
回复

使用道具 举报

10

主题

736

帖子

2522

积分

金牌会员

Rank: 6Rank: 6

积分
2522
金钱
1786
HASS币
0
发表于 2019-1-8 08:45:39 | 显示全部楼层
感谢分享
回复

使用道具 举报

1

主题

98

帖子

339

积分

中级会员

Rank: 3Rank: 3

积分
339
金钱
241
HASS币
0
发表于 2019-1-8 09:18:20 | 显示全部楼层
感谢分享
来学习
回复

使用道具 举报

0

主题

70

帖子

324

积分

中级会员

Rank: 3Rank: 3

积分
324
金钱
254
HASS币
0
发表于 2019-1-8 10:33:56 | 显示全部楼层
很不错,学习了
回复

使用道具 举报

12

主题

193

帖子

747

积分

高级会员

Rank: 4

积分
747
金钱
554
HASS币
0
发表于 2019-1-8 11:03:18 | 显示全部楼层
极米投影仪控制是怎么做的,那个遥控器不是蓝牙的骂,怎么实现控制的?
回复

使用道具 举报

0

主题

70

帖子

324

积分

中级会员

Rank: 3Rank: 3

积分
324
金钱
254
HASS币
0
发表于 2019-1-8 11:12:50 | 显示全部楼层
配置过程遇到一个问题,使用一些card类型时,会出错,出错信息如下:

It says 'card',not 'cardS'.Remove the dash.

配置如下,我理解这就是一个card,不是多个,为什么会出错呢?

      - type: custom:card-modder
        style:
          --paper-card-background-color: rgba(0, 100, 0, 0.2)
          --paper-item-icon-color: white
          border-radius: 5px
          color: rgb(0, 0, 100)
        card:
          - type: gauge
            name: With Severity
            unit: '%'
            entity: sensor.processor_use
            severity:
              green: 0
              yellow: 45
              red: 85
回复

使用道具 举报

10

主题

271

帖子

1109

积分

金牌会员

Rank: 6Rank: 6

积分
1109
金钱
838
HASS币
10
发表于 2019-1-8 11:36:42 | 显示全部楼层
这个赞
收藏一下
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2019-6-18 18:50 , Processed in 0.526492 second(s), 41 queries .

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表