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

 找回密码
 立即注册
楼主: 消逝

[UI界面] HA彩平图UI分享(2024-11-17阶段性更新)-保姆级教程!

  [复制链接]

0

主题

6

帖子

123

积分

注册会员

Rank: 2

积分
123
金钱
117
HASS币
0
发表于 2024-9-21 23:20:00 | 显示全部楼层
谢谢分享
回复

使用道具 举报

0

主题

5

帖子

42

积分

新手上路

Rank: 1

积分
42
金钱
37
HASS币
0
发表于 2024-9-22 15:09:46 | 显示全部楼层
学习学习
回复

使用道具 举报

0

主题

26

帖子

186

积分

注册会员

Rank: 2

积分
186
金钱
160
HASS币
0
发表于 2024-9-22 18:34:38 | 显示全部楼层
本帖最后由 老皇历 于 2024-9-22 20:39 编辑

求救:我的时间节气为啥有个白背景,怎么也搞不了,请大佬看看问题在哪?
新建 BMP 图像.jpg

这一段的代码是完全搬的,只不过没有自己的节日,就删了后面的代码:
          - type: image
            info1: '************************************************************'
            info2: '**********************   时间/日期   ***********************'
            info3: '*   jieqi_tiaozheng: 1 是节气调整值,不准的时候修改此项    *'
            info4: '* 除时间外其余日期都是本地计算(时间是秒级刷新这里做不到) *'
          - type: custom:button-card      
            style:            
              left: 150px
              top: 95px
            variables:
              jieqi_tiaozheng: 1
            styles:
              grid:
                - grid-template-areas: |
                    "time time time time"
                    "date week jieqi jieqi"
                    "year mon mon day"
                    "line line line line"
                    "shengri shengri shengri shengri"
                    "jieri jieri jieri jieri"
                - grid-template-columns: 80px 58px 16px 72px
                - grid-template-rows: 70px 22px 22px 10px 22px 22px
                - text-align: left
                - font-weight: bold
                - font-size: 16px
              card:
                - width: 250px
                - height: 188px
              custom_fields:
                time:
                  - font-size: 57px
                  - font-weight: 430px
                  - text-align: center
                jieqi:
                  - text-align: right
                day:
                  - text-align: right
            custom_fields:
              time: '[[[return states[''sensor.time''].state]]]'
              date: |
                [[[
                   let date = new Date(), month = date.getMonth()+1, day = date.getDate();
                   if (month < 10) month = `0${month}` ;
                   if (day   < 10) day   = `0${day}` ;
                   return `${month}月${day}日`;
                ]]]
              week: |
                [[[
                    var day  = new Date().getDay();
                    var week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[day]
                    return week;
                ]]]
              jieqi: |
                [[[
                     var now =new Date();
                     var year=now.getYear(), mon=now.getMonth(), day=now.getDate()+variables.jieqi_tiaozheng;
                     var solarTerm = new Array("小寒", "大寒", "立春", "雨水", "惊蛰", "春分", "清明", "谷雨","立夏", "小满", "芒种", "夏至", "小暑", "大暑", "立秋", "处暑","白露", "秋分", "寒露", "霜降", "立冬", "小雪", "大雪", "冬至");
                     var sTermInfo = new Array(0, 21208, 42467, 63836, 85337, 107014, 128867, 150921, 173149, 195551, 218072, 240693,263343, 285989, 308563, 331033, 353350, 375494, 397447, 419210, 440795, 462224, 483532, 504758);
                     var solarTerms = "",num1=1, num2=1;
                     while (solarTerms==""){ num1 = num1+1;
                       var temp1 = new Date((31556925974.7*(year-1900)+sTermInfo[mon*2+1] * 60000)+Date.UTC(1900,0,6,2,5));
                       var temp2 = temp1.getUTCDate();
                       if (temp2 == day) solarTerms = solarTerm[mon*2+1];
                       temp1 = new Date((31556925974.7*(year-1900)+sTermInfo[mon*2]*60000)+Date.UTC(1900,0,6,2,5));
                       temp2 = temp1.getUTCDate();
                       if(temp2==day) solarTerms = solarTerm[mon*2];
                       if(day>1){day=day-1;} else { mon=mon-1;if(mon<0){year=year-1; mon=11;}day=31; }}
                     return solarTerms+" 第"+(num1-1)+"天";
                ]]]
              year: |
                [[[ return states['sensor.holiday'].attributes.农历.slice(0,4)]]]
              mon: |
                [[[ return states['sensor.holiday'].attributes.农历.slice(5,9)]]]
              day: |
                [[[
                    let tzArr = ['子','丑','寅','卵','辰','巳','午','未','申','酉','戌','亥'];
                    let skArr = ['一','二','三','四','五','六','七','八'];
                    var h = new Date().getHours();
                    var m = new Date().getMinutes();
                    if (h%2 ==0)  var shike = skArr[parseInt(m/15)] ;
                    if (h%2 ==1)  var shike = skArr[parseInt(m/15)+4];
                    return  tzArr[parseInt(h/2)] + '时' + shike +'刻';
                ]]]
              line:
                card:
                  type: custom:button-card
                  styles:
                    card:
                      - width: 228px
                      - border-top: 1px solid white
                      - margin-top: 18px
              shengri: |
                [[[
                   var jieri1 =  states['sensor.holiday'].attributes.纪念日 ;
                   var jieri2 =  states['sensor.holiday'].attributes.最近的纪念日 ;
                   var jieri3 =  states['sensor.holiday'].attributes.最近的纪念日还有 ;
                   if (jieri1 != undefined ) return`${jieri1}`;
                   if (jieri1 == undefined ) return`${jieri2} ${jieri3}`;
                ]]]
              jieri: |
                [[[
                   var jieri1 =  states['sensor.holiday'].attributes.节日 ;
                   var jieri2 =  states['sensor.holiday'].attributes.最近的节日 ;
                   var jieri3 =  states['sensor.holiday'].attributes.最近的节日还有 ;
                   if (jieri1 != undefined ) return`${jieri1}`;
                   if (jieri1 == undefined ) return`${jieri2} ${jieri3}`;
                ]]]   
l另外,还缺customize.yaml文件没有上传!  




回复

使用道具 举报

2

主题

28

帖子

660

积分

高级会员

Rank: 4

积分
660
金钱
632
HASS币
0
发表于 2024-9-23 08:07:29 | 显示全部楼层
感谢分享,楼主辛苦
回复

使用道具 举报

0

主题

39

帖子

758

积分

高级会员

Rank: 4

积分
758
金钱
719
HASS币
0
发表于 2024-9-23 08:15:14 | 显示全部楼层
老皇历 发表于 2024-9-22 18:34
求救:我的时间节气为啥有个白背景,怎么也搞不了,请大佬看看问题在哪?

换一个主题 左下角头像-主题-AAAAAAAA
回复

使用道具 举报

0

主题

39

帖子

758

积分

高级会员

Rank: 4

积分
758
金钱
719
HASS币
0
发表于 2024-9-23 08:16:22 | 显示全部楼层
wanli119 发表于 2024-9-20 15:26
AAAAAAAA.yaml 问题来了  aaaaa 的主题文件是那个 能出个时候教程是最好了

附件里 主题文件:  themes.zip 在压缩包里面
回复

使用道具 举报

0

主题

3

帖子

41

积分

新手上路

Rank: 1

积分
41
金钱
38
HASS币
0
发表于 2024-9-23 11:48:19 | 显示全部楼层
111111111111111111111111
回复

使用道具 举报

1

主题

24

帖子

132

积分

注册会员

Rank: 2

积分
132
金钱
108
HASS币
0
发表于 2024-9-23 13:18:20 | 显示全部楼层
666 前来学习
回复

使用道具 举报

0

主题

2

帖子

22

积分

新手上路

Rank: 1

积分
22
金钱
20
HASS币
0
发表于 2024-9-23 14:34:59 | 显示全部楼层
感谢分享
回复

使用道具 举报

0

主题

8

帖子

72

积分

注册会员

Rank: 2

积分
72
金钱
64
HASS币
0
发表于 2024-9-23 16:41:24 | 显示全部楼层
大神你好,我来学习了
回复

使用道具 举报

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

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2024-11-23 08:12 , Processed in 0.066788 second(s), 33 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

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