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

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

 找回密码
 立即注册
查看: 1426|回复: 31

[进阶教程] 【Lovelace】界面之斐讯DC1

[复制链接]

15

主题

553

帖子

1962

积分

金牌会员

Rank: 6Rank: 6

积分
1962
金钱
1409
HASS币
91

教程狂人

QQ
发表于 2019-7-14 00:41:55 | 显示全部楼层 |阅读模式
本帖最后由 花蟋蟀 于 2019-7-16 10:36 编辑

【Lovelace】界面之斐讯DC1

【效果图】

这是三个DC1的运行图

这是三个DC1的运行图



【前置要求】
1、刷了ESPHome的斐讯DC1接入HA(集成里添加很方便)
(教程在这https://bbs.hassbian.com/forum.php?mod=viewthread&tid=6628&highlight=DC1
2、安装了button-card 插件


【配置UI
新建右下角MANUAL CARD卡片-复制代码替换所有内容-保存


【配置文件】
单个DC1配置如下
cards:
  - cards:
      - cards:
          - type: 'custom:button-card'
            entity: sensor.phicomm_dc1_power
            name: 功率
            color_type: card
            color: 'rgb(223, 150, 97)'
            show_state: true
            show_icon: false
            show_name: true
            show_units: true
            show_label: false
            show_last_changed: false
            styles:
              card:
                - height: 40px
            state:
              - operator: <
                value: 0.1
                color: 'rgb(255, 255, 255)'
                styles:
                  card:
                    - filter: opacity(80%)
                  icon:
                    - filter: grayscale(100%)
          - type: 'custom:button-card'
            entity: sensor.phicomm_dc1_current
            name: 电流
            color_type: card
            color: 'rgb(142, 189, 208)'
            show_state: true
            show_icon: false
            show_name: true
            show_units: true
            show_label: false
            show_last_changed: false
            styles:
              card:
                - height: 40px
            state:
              - operator: <
                value: 0.1
                color: 'rgb(255, 255, 255)'
                styles:
                  card:
                    - filter: opacity(80%)
                  icon:
                    - filter: grayscale(100%)
          - type: 'custom:button-card'
            entity: sensor.phicomm_dc1_voltage
            name: 电压
            color_type: card
            color: 'rgb(106, 180, 197)'
            show_state: true
            show_icon: false
            show_name: true
            show_units: true
            show_label: false
            show_last_changed: false
            styles:
              card:
                - height: 40px
            state:
              - operator: <
                value: 220
                color: 'rgb(255, 255, 255)'
                styles:
                  card:
                    - filter: opacity(80%)
                  icon:
                    - filter: grayscale(100%)
        type: vertical-stack
      - type: 'custom:button-card'
        entity: switch.phicomm_dc1_switch1
        name: 插孔命名1
        icon: 'mdi:power'
        color_type: card
        color: 'rgb(146, 180, 97)'
        show_state: false
        show_icon: true
        show_name: true
        show_units: true
        show_label: false
        show_last_changed: false
        show_entity_picture: false
        entity_picture: /local/image/image5-1.jpg
        lock: false
        styles:
          card:
            - height: 135px
        state:
          - value: 'off'
            styles:
              card:
                - filter: opacity(80%)
              icon:
                - filter: grayscale(100%)
      - type: 'custom:button-card'
        entity: switch.phicomm_dc1_switch2
        name: 插孔命名2
        icon: 'mdi:power'
        color_type: card
        color: 'rgb(146, 140, 150)'
        show_state: false
        show_icon: true
        show_name: true
        show_units: true
        show_label: false
        show_last_changed: false
        show_entity_picture: false
        entity_picture: /local/image/image5-1.jpg
        lock: false
        styles:
          card:
            - height: 135px
        state:
          - value: 'off'
            styles:
              card:
                - filter: opacity(80%)
              icon:
                - filter: grayscale(100%)
      - type: 'custom:button-card'
        entity: switch.phicomm_dc1_switch3
        name: 插孔命名3
        icon: 'mdi:power'
        color_type: card
        color: 'rgb(123, 200, 164)'
        show_state: false
        show_icon: true
        show_name: true
        show_units: true
        show_label: false
        show_last_changed: false
        show_entity_picture: false
        entity_picture: /local/image/image5-1.jpg
        lock: false
        styles:
          card:
            - height: 135px
        state:
          - value: 'off'
            styles:
              card:
                - filter: opacity(80%)
              icon:
                - filter: grayscale(100%)
      - cards:
          - type: 'custom:button-card'
            entity: sensor.phicomm_dc1_wifi_signal
            name: WIFI
            icon: 'mdi:wifi'
            color_type: card
            color: 'rgb(76, 195, 97)'
            show_state: true
            show_icon: true
            show_name: true
            show_units: true
            show_label: false
            show_last_changed: false
            styles:
              card:
                - height: 65px
            state:
              - operator: ''
                value: -86
                styles:
                  card:
                    - filter: opacity(60%)
                  icon:
                    - filter: grayscale(100%)
          - type: 'custom:button-card'
            entity: switch.phicomm_dc1_logo_light
            name: Light
            icon: 'mdi:flare'
            color_type: card
            color: 'rgb(76, 195, 217)'
            show_state: false
            show_icon: true
            show_name: true
            show_units: true
            show_label: false
            show_last_changed: false
            styles:
              card:
                - height: 60px
            state:
              - value: 'off'
                name: Light
                icon: 'mdi:lightbulb-outline'
                styles:
                  card:
                    - filter: opacity(80%)
                  icon:
                    - filter: grayscale(80%)
              - value: 'on'
                name: Light
                icon: 'mdi:lightbulb-on-outline'
        type: vertical-stack
    type: horizontal-stack
  - type: 'custom:button-card'
    entity: switch.phicomm_dc1_switch0
    name: 电源总控 | USB电源
    color_type: card
    color: 'rgb(241, 103, 69)'
    show_state: false
    show_icon: false
    show_name: true
    show_units: true
    show_label: false
    show_last_changed: false
    show_entity_picture: false
    entity_picture: /local/image/image5-1.jpg
    lock: true
    styles:
      card:
        - height: 40px
    state:
      - value: 'off'
        styles:
          card:
            - filter: opacity(80%)
          icon:
            - filter: grayscale(100%)
type: vertical-stack


【说明】

电源总控带锁,开关需先点击解锁后控制


回复

使用道具 举报

6

主题

478

帖子

2383

积分

金牌会员

Rank: 6Rank: 6

积分
2383
金钱
1905
HASS币
30
发表于 2019-7-14 01:04:47 来自手机 | 显示全部楼层
先马再看
回复

使用道具 举报

1

主题

94

帖子

665

积分

高级会员

Rank: 4

积分
665
金钱
571
HASS币
0
发表于 2019-7-14 10:43:58 | 显示全部楼层
设计的不错,有意思
回复

使用道具 举报

12

主题

1044

帖子

3313

积分

论坛元老

Rank: 8Rank: 8

积分
3313
金钱
2269
HASS币
0
发表于 2019-7-14 11:24:10 | 显示全部楼层
不明觉厉,homekit党路过支持,感谢分享//
回复

使用道具 举报

6

主题

195

帖子

1470

积分

金牌会员

Rank: 6Rank: 6

积分
1470
金钱
1275
HASS币
0
QQ
发表于 2019-7-14 11:51:06 | 显示全部楼层
很好看哎  感谢分享
回复

使用道具 举报

1

主题

26

帖子

118

积分

注册会员

Rank: 2

积分
118
金钱
92
HASS币
0
发表于 2019-7-14 15:50:05 | 显示全部楼层
DC1还在路上 收了!
回复

使用道具 举报

7

主题

639

帖子

2477

积分

金牌会员

Rank: 6Rank: 6

积分
2477
金钱
1838
HASS币
87
发表于 2019-7-15 23:16:31 | 显示全部楼层
这个好赞,好看,好用.
回复

使用道具 举报

9

主题

157

帖子

535

积分

高级会员

Rank: 4

积分
535
金钱
378
HASS币
0
发表于 2019-7-21 20:49:29 | 显示全部楼层
button-card 插件下载后怎么安装啊?放在哪个目录呢?
回复

使用道具 举报

9

主题

157

帖子

535

积分

高级会员

Rank: 4

积分
535
金钱
378
HASS币
0
发表于 2019-7-22 01:22:25 | 显示全部楼层
本帖最后由 zoujian019 于 2019-7-22 02:00 编辑

已经配置好了,感谢!
回复

使用道具 举报

15

主题

553

帖子

1962

积分

金牌会员

Rank: 6Rank: 6

积分
1962
金钱
1409
HASS币
91

教程狂人

QQ
 楼主| 发表于 2019-7-22 06:13:13 | 显示全部楼层
zoujian019 发表于 2019-7-21 20:49
button-card 插件下载后怎么安装啊?放在哪个目录呢?

WWW下,在lovelace里添加语句
回复

使用道具 举报

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

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2019-10-19 20:46 , Processed in 0.101221 second(s), 25 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

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