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

 找回密码
 立即注册
查看: 1959|回复: 20

[UI界面] 好看的斐讯M1空气检测仪卡片

[复制链接]

35

主题

202

帖子

1988

积分

金牌会员

Rank: 6Rank: 6

积分
1988
金钱
1786
HASS币
0
发表于 2023-9-26 21:09:17 | 显示全部楼层 |阅读模式
本帖最后由 623305170 于 2024-3-6 15:48 编辑

我自己抠图,通过mushroom卡片做出来的斐讯M1空气检测仪卡片,分享代码,抠好的图片素材在压缩包里面
type: custom:swipe-card
parmameters:
  loop: true
  effect: coverflow
cards:
  - type: custom:stack-in-card
    title: M1空气检测仪
    mode: vertical
    cards:
      - type: horizontal-stack
        cards:
          - type: custom:mod-card
            card:
              type: picture
              image: /local/icons/m1.jpg
            card_mod: null
            style: |
              ha-card {
                /* Set padding of card */
                padding: 0px 0px 0px 0px;
                /* Move card up to match header card */
                --ha-card-border-radius: 0px;
                margin-left: 0px;
                margin-right: 0px;
                margin-bottom: 0px;  
          - type: custom:mushroom-entity-card
            entity: sensor.zm1_b0f8931e3014_temperature
            name: 温度
            layout: vertical
            icon: mdi:thermometer
            icon_color: green
          - type: custom:mushroom-entity-card
            entity: sensor.zm1_b0f8931e3014_humidity
            name: 湿度
            layout: vertical
            icon: mdi:water-percent
            icon_color: blue
      - type: horizontal-stack
        cards:
          - type: custom:mushroom-entity-card
            entity: sensor.zm1_b0f8931e3014_pm25
            name: PM2.5
            layout: vertical
            icon: mdi:blur
            icon_color: yellow
          - type: custom:mushroom-entity-card
            entity: sensor.zm1_b0f8931e3014_hcho
            name: 甲醛
            layout: vertical
            icon: mdi:chemical-weapon
            icon_color: purple
  - type: custom:stack-in-card
    title: M1亮度
    mode: vertical
    cards:
      - type: custom:mushroom-light-card
        entity: light.zm1_b0f8931e3014_brightness
        use_light_color: false
        show_brightness_control: true
        show_color_control: false
        show_color_temp_control: false
        icon_color: light-green
        icon: mdi:lightbulb-night-outline
        layout: vertical
卡片右滑可以调整M1背景灯亮度


M1空气检测仪卡片.jpg

m1.zip

193.42 KB, 下载次数: 80

评分

参与人数 3金钱 +13 收起 理由
hbzjhg + 1 感谢楼主分享!
firewater + 10 论坛有你更精彩!
[email protected] + 2 感谢楼主分享!

查看全部评分

回复

使用道具 举报

2

主题

411

帖子

2365

积分

金牌会员

Rank: 6Rank: 6

积分
2365
金钱
1954
HASS币
0
QQ
发表于 2023-9-27 08:25:57 | 显示全部楼层
微信截图_20230927082503.png
大佬V5  谢谢分享

评分

参与人数 2金钱 +15 收起 理由
yzg790787394 + 5 感谢楼主分享!
623305170 + 10 高手,这是高手!

查看全部评分

回复

使用道具 举报

35

主题

202

帖子

1988

积分

金牌会员

Rank: 6Rank: 6

积分
1988
金钱
1786
HASS币
0
 楼主| 发表于 2023-9-27 08:43:25 | 显示全部楼层

大佬能分享一下代码吗?
回复

使用道具 举报

2

主题

411

帖子

2365

积分

金牌会员

Rank: 6Rank: 6

积分
2365
金钱
1954
HASS币
0
QQ
发表于 2023-9-27 08:44:02 | 显示全部楼层
左边滑动 既然可以看到亮度,完美
回复

使用道具 举报

5

主题

125

帖子

1290

积分

金牌会员

Rank: 6Rank: 6

积分
1290
金钱
1165
HASS币
0
发表于 2023-9-27 12:43:04 | 显示全部楼层
超赞
回复

使用道具 举报

0

主题

12

帖子

73

积分

注册会员

Rank: 2

积分
73
金钱
61
HASS币
0
发表于 2023-9-30 11:15:57 | 显示全部楼层
感谢楼主分享
回复

使用道具 举报

9

主题

180

帖子

934

积分

论坛积极会员

积分
934
金钱
754
HASS币
0
发表于 2023-9-30 19:03:26 | 显示全部楼层
问个题外话,有M1的替代品吗,我家的M1用的时间长了,PM2.5的传感器坏掉了,维修成本也挺高,想换个平替的产品,有推荐的没?
回复

使用道具 举报

1

主题

18

帖子

252

积分

中级会员

Rank: 3Rank: 3

积分
252
金钱
234
HASS币
0
发表于 2023-10-2 15:48:38 | 显示全部楼层
fyanjin 发表于 2023-9-30 19:03
问个题外话,有M1的替代品吗,我家的M1用的时间长了,PM2.5的传感器坏掉了,维修成本也挺高,想换个平替的 ...

再买个m1啊
回复

使用道具 举报

1

主题

34

帖子

164

积分

注册会员

Rank: 2

积分
164
金钱
130
HASS币
0
发表于 2023-10-2 18:12:17 | 显示全部楼层
6666666666666666666666666666666666666666666666
回复

使用道具 举报

9

主题

180

帖子

934

积分

论坛积极会员

积分
934
金钱
754
HASS币
0
发表于 2023-10-7 21:36:03 | 显示全部楼层

朴实无华的回答
回复

使用道具 举报

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

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2024-4-28 03:02 , Processed in 1.483900 second(s), 36 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

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