Show Power (W) Value on Switch Tile

🧰 Built-In Apps and Drivers
1

I have noticed that with devices that have batteries the percent remaining is automatically displayed on top left corner of a tile for that device. Multi-sensors will display temperature on a (motion) tile.

My question is, is it possible to customize a driver to change which attribute is actually displayed? I have several power switches (with customizable DH) and would like to display the Power (W) being drawn.

1 Like
2

I use Laundry Manager and I'd love a dashboard template for a switch that can show an attribute.

image
image451×683 62 KB

Those tiles just show an attribute and right now I don't have a super easy way to reset the status back to idle. If it were a switch, I could still show idle, running, finished status and tapping the tile would activate the switch that resets the status back to idle.

3

Assuming that power is an attribute the device reports you should be able to use an attribute tile to report it.

4

That is what I am doing now but that is not what I was looking for. I wanted 1 tile for the switch which showed power at the top left corner of the tile.

5

The built-in drivers are not open source, so you cannot do this with stock drivers.

There are a couple tile apps that can combine or make custom tiles. The users BPTWorld, and Cobra are two that have these apps come to mind, but there might be others.

6

Yeah, the best you can do there natively is to create an overlay tile and style it with CSS to make it look like one tile. This example is actually 3 tiles:

image

1 Like
7

I was actually think of my own DHs. I have a Temp/RH DH that includes a battery capability. When I use this DH for my custom devices the battery % is displayed but certainly not because of something I did to the DH

8

Oh wow... Love it. Can you share how you did this?

9

Tile 5 is the main lock tile, 6 is the battery attribute tile, and 7 is the last code attribute. If you make all 3 occupy the grid position in the dashboard and then modify the CSS to read:

#tile-5 .tile-title, #tile-6 .tile-title, #tile-7 .tile-title  { 
    display: none
 }
#tile-5 {
   background:linear-gradient(180deg,black,navy,blue,gray);
   border: 3px outset #ffffcc;
}
#tile-6 {
   background-color:transparent;
   border:none;
   height: 50%;
   width: 50%;
   align-self:end;
}
#tile-6 .material-icons, #tile-7 .material-icons{
   color:transparent;
   text-shadow:transparent;
   opacity: 0.1;
}
#tile-7 {
   background-color:transparent;
   border:none;
   height: 50%;
   width: 60%;
   justify-self:end;
   align-self:end;
}
1 Like