『瀚思彼岸』» 智能家居技术论坛

 找回密码
 立即注册
楼主:

[论坛活动] 【2019庆元旦系列活动】之【HASS界面大赛】

[复制链接]

3

主题

217

帖子

1443

积分

金牌会员

Rank: 6Rank: 6

积分
1443
金钱
1226
HASS币
10
发表于 2018-12-28 17:12:17 | 显示全部楼层
商科小白花了好多时间从零到有,虽然大部分都是照搬的,凑个热闹吧
微信图片_20181228171034.png
微信图片_20181228171048.png
微信图片_20181228171059.png
微信图片_20181228171108.png

评分

参与人数 1金钱 +20 HASS币 +10 收起 理由
+ 20 + 10 不错,中性灰~

查看全部评分

回复

使用道具 举报

30

主题

493

帖子

4795

积分

论坛元老

佑桑

Rank: 8Rank: 8

积分
4795
金钱
4287
HASS币
156

教程狂人

发表于 2018-12-28 19:49:10 | 显示全部楼层
一定要參加
lovelave_0.png lovelave_1.png lovelave_2.png lovelave_3.png lovelave_4.png lovelave_5.png

ui-lovelace.zip (4.67 KB, 下载次数: 53)

评分

参与人数 1金钱 +20 HASS币 +10 收起 理由
+ 20 + 10 灰常酷!!

查看全部评分

ASRock H370 PRO4, 48GB, 8TBx3 + 2TBx3
ESXi 6.7 + Ununtu + Docker + HASS.IO -> Homeassistant OS
(Home Assistant Supervised 官方文件)
回复

使用道具 举报

8

主题

2073

帖子

6053

积分

论坛元老

流水无味

Rank: 8Rank: 8

积分
6053
金钱
3980
HASS币
145

灌水之王

发表于 2018-12-29 08:22:37 | 显示全部楼层
这是我的主图,删删减减少了好多!
01.gif

一般现在只看手机平面图主界面了一目连了,
设备一般都自动,不能点的用喊的!!
10 (4).gif
附上Lovelace
ui-lovelace.rar (3.76 KB, 下载次数: 42)

评分

参与人数 2金钱 +25 HASS币 +10 收起 理由
+ 20 + 10 有点意思!
BH4WHN + 5 我怎么就突然跪下了!

查看全部评分

回复

使用道具 举报

5

主题

267

帖子

2855

积分

金牌会员

Rank: 6Rank: 6

积分
2855
金钱
2588
HASS币
0
发表于 2018-12-29 09:14:32 | 显示全部楼层
xieahui 发表于 2018-12-29 08:22
这是我的主图,删删减减少了好多!

令人印象深刻的平面布置图,求教程
回复

使用道具 举报

8

主题

2073

帖子

6053

积分

论坛元老

流水无味

Rank: 8Rank: 8

积分
6053
金钱
3980
HASS币
145

灌水之王

发表于 2018-12-29 10:22:33 | 显示全部楼层
本帖最后由 xieahui 于 2018-12-29 10:26 编辑
BH4WHN 发表于 2018-12-29 09:14
令人印象深刻的平面布置图,求教程

用的lovelace的floorplan
https://www.home-assistant.io/lovelace/picture-elements/

平面图用的 艺图图示9.0
链接: https://pan.baidu.com/s/1LnY8v99LUdGjXU3aerwxMA 提取码: ywdf

一般图标都用图片双色代替了,用PHOTOSHOP做2张开和关颜色状态!
目前彩色灯和人体感应没代替(彩灯处理不了颜色/人体代替起来怪怪的)
ui-lovelace.yaml已经提供,可以做参考!!
light1on1.png light1off2.png
回复

使用道具 举报

5

主题

267

帖子

2855

积分

金牌会员

Rank: 6Rank: 6

积分
2855
金钱
2588
HASS币
0
发表于 2018-12-29 10:52:19 | 显示全部楼层
xieahui 发表于 2018-12-29 10:22
用的lovelace的floorplan
https://www.home-assistant.io/lovelace/picture-elements/

感谢分享!学习中
回复

使用道具 举报

15

主题

656

帖子

2832

积分

金牌会员

Rank: 6Rank: 6

积分
2832
金钱
2175
HASS币
91

教程狂人

QQ
发表于 2018-12-29 11:44:27 | 显示全部楼层
showphi 发表于 2018-12-28 10:54
请问大神,怎么设置顶部设备(圆圈内容)根据当前分组变化?

是的啊,每个预览页都自定义啊
回复

使用道具 举报

15

主题

656

帖子

2832

积分

金牌会员

Rank: 6Rank: 6

积分
2832
金钱
2175
HASS币
91

教程狂人

QQ
发表于 2018-12-29 11:46:56 | 显示全部楼层
aktifin 发表于 2018-12-28 10:56
也来凑个热闹,实用为主,很多东西都精简掉了

辽宁 握个爪
回复

使用道具 举报

22

主题

359

帖子

3763

积分

元老级技术达人

积分
3763
金钱
3369
HASS币
100

教程狂人

发表于 2018-12-29 15:41:35 | 显示全部楼层
也来凑个热闹吧,主要在倒腾nodered的自动化上去了,很少用界面了也没再折腾过界面了 fehelper-iot-ysys365-cn-8123-states-1546069035945.png

评分

参与人数 1金钱 +20 HASS币 +10 收起 理由
+ 20 + 10 UI大神出马,一个顶仨!

查看全部评分

回复

使用道具 举报

4

主题

531

帖子

4003

积分

论坛元老

Rank: 8Rank: 8

积分
4003
金钱
3462
HASS币
120
发表于 2018-12-29 18:58:51 | 显示全部楼层
本帖最后由 killadm 于 2018-12-30 22:46 编辑

我来组成分母,顺便安利几个lovelace插件

Screenshot_2018-12-29 Home Assistant(1).jpg
firefox不支持backdrop-filter
222.png
ipad有毛玻璃效果
Screenshot_2018-12-29 Home Assistant.png
原始界面
Screenshot_2018-12-29 Home Assistant.jpg
floorplan半成品
787.gif
floorplan动画

用到的插件

定制标题栏
68747470733a2f2f692e696d6775722e636f6d2f6b7a30676e5a6d2e6a7067.jpg

简洁的传感器图表
48304689-d975fa00-e51d-11e8-9cd6-620a17e3d244.png

一个可以高度定制化的播放器
47517460-9282d600-d888-11e8-9705-cf9ec3698c3c.png

自定义每个卡片的css,可玩性很高,不过兼容性不怎么样
47842006-b92a9a80-ddbb-11e8-915a-9d54f7e62a5e.png

给灯光添加滑块,可以替代custom-ui的相同功能
48869222-b6303200-eddc-11e8-8b8c-7b4a9601df7a.png

开关加锁,custom-ui相同功能替代品
45876486-0bc76e80-bd9b-11e8-8aa1-543fa4e3d14d.jpg

-----------------------------------------------------------------------------------------------------------
以下是我没用过但是比较有用的插件
-----------------------------------------------------------------------------------------------------------

定制secondaryinfo,目前只能展示主实体的属性,半成品,可以关注一下,暂时还不能实现custom-ui的相同功能
QQ截图20181229212754.jpg

卡片纵向堆叠,跟官方的纵向堆叠插件的区别是这个插件可以去掉两个插件的边框让两个插件融为一体
42928369-c7386c84-8b3f-11e8-8a5c-583ddac3f24d.png

一个可以控制卡片排列的插件,纵向、横向、单列、自定义排列,强迫症的福音
这里只放一张横向排列的图
48088463-62312500-e202-11e8-875a-5ff836069017.png

markdown卡片,支持插入ha实体的状态信息,可玩性应该很高
44176410-fbf8a280-a0e9-11e8-88e3-74ad72434865.png

用自定义卡片替换实体的弹出信息
48152470-4b530700-e2c4-11e8-8a4d-d6a2121fc4c5.png

可以显示多个传感器的图表插件
screenshot.png

把实体显示为可定制样式的按钮,可以配合横向纵向堆叠节省空间
QQ截图20181230224119.jpg

前天新鲜出炉的进度条展示插件,进度条样式可以定制
severity.gif

补上附件: ui-lovelace.rar (26.9 KB, 下载次数: 149)




47842006-b92a9a80-ddbb-11e8-915a-9d54f7e62a5e.png

评分

参与人数 2金钱 +30 HASS币 +10 收起 理由
+ 20 + 10 艾玛!无法用言语来评价了
咸味土豆 + 10 这是最值得伸手的大佬了,不枉我组个分母,.

查看全部评分

回复

使用道具 举报

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

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2024-11-26 07:49 , Processed in 0.339329 second(s), 39 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

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