Custom UI: Tiles

Share your Projects! Dashboards & Frontend
13

@eddi89 - How can I change this to simply show an icon in the middle of the button, entity state (not caption) below the button), and change the behavior to not be a button? I’m basically trying to make custom badges.

14

This is awesome and I can see a lot of potential for customisation. Perhaps this will even replace my HaDash setup.

15

I will start a project to create a custom panel that you can configure like this. I will need help to add more widget types. A widget to display svg-files (similar to floorplan) is wip.

1 Like
16

59E173F1-5FB3-4DE2-BBC6-6C04C1CE428C
59E173F1-5FB3-4DE2-BBC6-6C04C1CE428C1242×2208 279 KB

1FB3F19A-3D17-4800-8D5D-7C91901DE1C8
1FB3F19A-3D17-4800-8D5D-7C91901DE1C81242×2208 231 KB

Looking good so far - just want to change that “ATV” to the the appropriate activity icon (in this case, the Apple logo).

3 Likes
17

you can set cell_width to 1fr to get same size for each btw

1 Like
18

@JesseWebDotCom I have put it on github :grinning:
I modified the state-card-button-panel.html to accept pictures, so I did the “Vibes” panel.
@eddi89 there will be a official repo?:thinking:

main
main523×761 78.6 KB

11 Likes
19

Thanks I added image support and moved to GitHub. I also changed name and some config parameters.
Current plan is to add ‘show more-info-card on longpress’-feature and make a dashboard as custom panel (early wip): https://imgur.com/a/lXuOp <-- If anybody wants to help contact me

1 Like
20

This looks awesome!
Would it be possible to explain/comment the sample configuration.yaml file, please? I’m a bit confused about what it’s doing.

21

Have you seen this? https://github.com/c727/home-assistant-tiles#configuration
Please tell me exactly what you don’t understand.

22

Yeah…I get the button config, but what’s going on with the script and inputs in your sample?

23

Custom state cards replace the original state card of an entity with something custom. Here we replace input_text.dummy_tiles with the tiles.I use input_text domain because it has no ‘more-info-card’ this means it doesn’t open another view if you click on it. Once this PR is merged the pointer cursor is also gone.
The example config is just a showcase of the functionality, for example how to add data to scripts.

1 Like
24

Excellent - thanks so much!

25

I apreciated the new structure and features. Thanks. I linked to your project in my config info.
I just jumped in this, so right now I can help with prototypes, tests, examples…

@sentinel if help here is a my real config sample
This isn’t updated to the new version, I will do that soon.
https://github.com/maattdiy/home-assistant-config/blob/master/config/packages/buttons.yaml

1 Like
26

I updated my config to the latest verion of tiles. Also added a color option per entity.
In the comments 2 little cool services that I found in the way: Generate icons for tiles, and Color Blender to create a color that play nice with the theme.



controlpanel
controlpanel508×636 67.3 KB
6 Likes
27

this is nice can you share your yaml config especially for the volume slider

28

Thats another custom state card named Custom UI

29

In my case I use the native input_number with an automation.
Here is my package with the all the media player related config: https://github.com/maattdiy/home-assistant-config/blob/master/config/packages/mp_general.yaml

1 Like
30

Thank you for sharing

31

my tiles are not showing up anymore i have no error on my log

32

Hey your setup looks good. Quick question, what weather component are you using? The details of the weather are pretty good and informative I would like something like that.