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

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

 找回密码
 立即注册
查看: 12982|回复: 277

[UI界面] button_card制作天气ui界面(2024-09-28更新)

  [复制链接]

10

主题

70

帖子

1533

积分

论坛UI达人

积分
1533
金钱
1453
HASS币
28
发表于 2024-7-14 02:34:04 | 显示全部楼层 |阅读模式
本帖最后由 消逝 于 2024-9-28 10:15 编辑

1、界面分享:链接:HA彩平图UI分享(2024-08-09更新)-保姆及教程!
2、教程贴:链接:彩平图户型图制作教程
3、教程贴:链接:button_card详细用法

4、教程贴:链接:button_card制作天气ui界面


这个是本身就有现成的集成【weather-chart-card】,喜欢这个界面,但是这个集成经常刷新不及时,于是就有了此贴,使用button_card手搓了一个
2024-09-28:修复了点击区域过宽
游客,如果您要查看本帖隐藏内容请回复


2024-09-24:更新天气和雨量增加圆角,修复了宽度过大显示不全
游客,如果您要查看本帖隐藏内容请回复

          - type: custom:button-card
            entity: weather.tian_qi
            tap_action:
              action: more-info
            template: weather
            variables:
              wendu_entity: sensor.wendu_shiwai   #或者 wendu_entity: "使用天气温度"
              shidu_entity: sensor.shidu_shiwai   #或者 wendu_entity: "使用天气温度"
              width: 52  #单列宽度
              aqi: 启用  #如果没有aqi忽略此项
              wendu_border: 8px   #温度框的圆角大小
              rain_border: 8px    #雨量框的圆角大小
            style:
              left: 200px
              top: 420px
QQ20240927-215739.png


2024-09-23,图标库不全的,自行下载补充图标,网址:https://bas.dev/work/meteocons



2024-8-5更新:1、合并代码,除模板外的UI部分,只有1段代码

游客,如果您要查看本帖隐藏内容请回复


2024-8-4更新:
1、雨量框变小了一些,雨量颜色改成和上面集成一样的颜色
2、温度弯折的更大了一下,之前的有点太平了
游客,如果您要查看本帖隐藏内容请回复


2024-8-3更新:
1、增加使用天气自带温湿度,还是使用自有实体的选择

wendu_entity: sensor.wendu_shiwai    
shidu_entity: sensor.shidu_shiwai   
或者这样
wendu_entity: "使用天气温度"
shidu_entity: "使用天气湿度"
2、增加宽度,修改width: 50(单列的宽度,总宽度将*5,数值格式,建议不低于50)
variables:
   width: 50
3、增加aqi,可以选择不启用,启用加一行,aqi:启用 (下面附aqi获取)
aqi: "启用"

2024-8-1更新:
1、完全去除模拟实体,现在仅使用ui就可以使用
2、要求1:准备【weather.tian_qi】天气实体,安装和风天气参考GitHub - dscao/qweather: 和风天气-官方API版及配套卡片
3、要求2:准备【sun.sun】日出日落实体,设备与服务-添加集成--日出日落
4、要求3:将ui文件复制到:\\192.168.xx.xx\config\www\UI\天气


aqi获取:
1、下载附件rest.yaml,token位置修改自己的和风token key:https://devapi.qweather.com/v7/air/5d?location=101110112&key=token
2、将rest.yaml放在configuration.yaml相同路径
3、配置configuration.yaml文件,添加一行
#configuration.yaml
rest: !include rest.yaml
4、开发者工具-yaml配置-REST实体服务(或者服务下,找 RESTful:重新加载),重载下服务

游客,如果您要查看本帖隐藏内容请回复
























评分

参与人数 5金钱 +52 HASS币 +10 收起 理由
+ 20 + 10
halftop + 2 厉害了word楼主!
tianzhuang55 + 8 高手,这是高手!
隔壁的王叔叔 + 12 UI 达人
hhh. + 10 高手,这是高手!

查看全部评分

回复

使用道具 举报

1

主题

13

帖子

106

积分

注册会员

Rank: 2

积分
106
金钱
93
HASS币
0
发表于 2024-7-14 02:42:05 | 显示全部楼层
谢谢分享
回复

使用道具 举报

0

主题

136

帖子

1180

积分

金牌会员

Rank: 6Rank: 6

积分
1180
金钱
1044
HASS币
0
发表于 2024-7-14 04:44:43 | 显示全部楼层
感谢分享。不错的
回复

使用道具 举报

0

主题

25

帖子

200

积分

中级会员

Rank: 3Rank: 3

积分
200
金钱
175
HASS币
0
发表于 2024-7-14 09:22:56 | 显示全部楼层
感谢分享,请大佬多多分享有关button_card的帖子
回复

使用道具 举报

1

主题

40

帖子

364

积分

中级会员

Rank: 3Rank: 3

积分
364
金钱
324
HASS币
0
发表于 2024-7-14 09:48:54 | 显示全部楼层
6666666666666
回复

使用道具 举报

1

主题

36

帖子

150

积分

注册会员

Rank: 2

积分
150
金钱
114
HASS币
0
QQ
发表于 2024-7-14 11:04:31 | 显示全部楼层
都是大神啊
回复

使用道具 举报

0

主题

13

帖子

54

积分

注册会员

Rank: 2

积分
54
金钱
41
HASS币
0
发表于 2024-7-14 14:33:01 | 显示全部楼层
感谢分享。不错的
回复

使用道具 举报

4

主题

40

帖子

164

积分

注册会员

Rank: 2

积分
164
金钱
124
HASS币
0
发表于 2024-7-14 17:21:19 | 显示全部楼层
666666,学习了
回复

使用道具 举报

4

主题

59

帖子

300

积分

中级会员

Rank: 3Rank: 3

积分
300
金钱
241
HASS币
0
发表于 2024-7-14 22:57:48 | 显示全部楼层
:):)
回复

使用道具 举报

0

主题

14

帖子

146

积分

注册会员

Rank: 2

积分
146
金钱
132
HASS币
0
发表于 2024-7-14 23:32:00 | 显示全部楼层
感谢分享。不错的
回复

使用道具 举报

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

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2024-12-14 19:00 , Processed in 0.136763 second(s), 36 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

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