怎么把picture-elements的背景图片变透明

samsss

各位大佬路过帮忙瞧瞧：怎么把picture-elements里image图片（测试.png）里的白色区域变透明露出背后的背景呢，图片本身是透明的，放进来就变白色了：
配置是这样：
type: picture-elements
image: /local/house/测试.png
elements:
  - type: state-badge
    entity: sensor.time
    style:
      top: 32%
      left: 40%

bbnomine

这个是你没有底图，而你的主题默认是白色，你如果想做全屋可视化，代码可以参照homeassistant demo 中的代码
type: picture-elements
image: /assets/arsaboo/floorplans/main.png  #这个是底图，应该是全屋没有开灯的图
elements:
  - type: image                                   #这个是图片，是用来展示你灯亮和灯灭的图层
    entity: input_boolean.abodeupdate     #这是监测的实体  你可以换成灯的实体
    tap_action:
      action: toggle          #这个不用管，是监测切换的动作
    state_image:
      'on': /assets/arsaboo/icons/abode_enabled.png    #这是你需要放的半透明开灯的图
      'off': /assets/arsaboo/icons/abode_disabled.png    #这是你需要放的一张全部透明没有内容的图
    style:
      top: 4%             #这三行是位置和大小   你如果底图和开灯图大小一致，应该三个数值都是50%
      left: 30%
      width: 7%
  - type: state-icon   #这个是按钮，是你要放在图片中的，通过按钮才能控制灯
    entity: input_boolean.abodeupdate     #这是监测的实体  你可以换成灯的实体
    style:
      top: 5%                  #这俩是位置参数，应该可以添加“width: ”这个参数，看需求
      left: 42%

以上是一个房间的代码，需要添加其他房间的时候，添加相应的图片图层和按钮图层就行了，从第四行以下开始添加，图层顺序跟代码有关，我记得好像是写到后面的代码是最顶层，所以按钮类代码要在图片类代码下面

bbnomine

说错了，是从第三行以下开始添加，https://demo.home-assistant.io   这个里面可以编辑他的图片模块来查看代码，摸索一下应该就知道怎么写了

samsss

bbnomine 发表于 2024-2-6 10:34
说错了，是从第三行以下开始添加，https://demo.home-assistant.io   这个里面可以编辑他的图片模块来查看 ...

谢谢回复哈，elements下面的图片是可以做到透明的，主要是之前的底图main.png弄不了；
不过我也找到办法，单独设置一个ios light 的theme就可以了

bbnomine

明白你要做什么了，这个教程应该是你需要的https://bbs.hassbian.com/thread-6019-1-1.html里面讲了如何通过
lovelace-card-modder插件来实现卡片透明和毛玻璃效果

samsss

bbnomine 发表于 2024-2-6 17:00
明白你要做什么了，这个教程应该是你需要的https://bbs.hassbian.com/thread-6019-1-1.html里面讲了如何通 ...

是的，谢谢