Announcement: HADashboard v2 Beta!

Third party integrations HADashboard
342

This is a web application that runs on a server, and serves the dashboard to a tablet, no need for any code on the tablet.

343

Oh, well I feel stupid now.

Ok, will look more into this when I get home. I was trying to program my tablet on break.

Thanks!

1 Like
344

Did you mange to use material design icons? If yes how it was like icon: md-fire or icon: mdi-fire?
I couldnā€™t get it working for switch widget as shown below:

fireplace:
  widget_type: switch
  title: Fireplace
  icon: mdi-fire
  icon_on: mdi-fire
  icon_off: mdi-fire
  entity: switch.fireplace_switch_9_0
345

I just tested and mdi-fire is working fine for me. Try removing the line ā€œicon: mdi-fireā€ as that is not a valid option.

switch

A widget to monitor and activate a switch

Mandatory Arguments

  • entity - the entity_id of the switch

Optional Arguments:

  • title - the title displayed on the tile
  • title2 - a second line of title text

Cosmetic Arguments

  • icon_on
  • icon_off
  • widget_style
  • icon_style_active
  • icon_style_inactive
  • title_style
  • title2_style
1 Like
346

Thanks a lot. I found the issue. I had widget correctly defined but in the layout I was using entity id rather than widget. :frowning:
It is working now thanks a lot.

Now I will have to figure out how to have color changed of that fire icon when it is on as material design has only one icon fire no colors. I want to keep HA and Dashboard same look and feel.

I like the customization of icons in AppDaemon Dashboard to be different from HA but it would be really nice if we could just reuse the icons which are already customized in HA, so basically same UI in both applications, not sure though itā€™s possible or not.
Thanks again.

347

Change the color here:

icon_style_active
icon_style_inactive

If you for instance wanted the color to change to red when it is on, do this:

icon_style_active: ā€œcolor: redā€

348

It would add a bit of overhead in processing as AD would have to cycle through each entity to figure out what icon was used in HA and if a customization was in place.

Personally I like the flexibility - super important in my opinion - of using Font Awesome icons. Most of the skins in the beta use a combination of MDI and FontAwesome icons. Having access to both is a critical improvement on HA, which is limited to MDI only.

1 Like
349

Yay! It worked! Learnt something new.
Thanks a lot.

1 Like
350

As @aimc said, the SimplyRed does this already, changing the color of the background from light to dark depending on the time of day. But I am working on a similar script to change the background based on the weather and hope to get it finished soon. When I do, it will probably be in a new skin.

351

Agree, definitely itā€™s improvement to have choice. I was thinking as a quick fix to have same from HA.

352

I wonder if this is something that could be accomplished with an AD script - similar to the way that @turboc did the external app in AD to populate dashboardsā€¦

353

I didnā€™t understand how to chose skins in fact :frowning:

354

You put this at the end of your URL - after the dash name - in your browser:

?skin=skinname

For example: http://192.168.1.181:5050/MainPanel?skin=default

Besides the default skin, there are four skins in the beta, and they are called as follows:

?skin=zen
?skin=obsidian
?skin=simplyred
?skin=glassic

Keep in mind that when you apply a skin, your font sizing may need to be adjusted for certain widgets. It was hard for me to determine a size that would work fro everybody, so some adjustment is expected.

2 Likes
355

I should put that in the docs :slight_smile:

1 Like
356

You know, I never noticed that was missing. If you remember when we started, I had just guessed the proper URL to call a skin and gotten lucky. I guess we both forgot after that!

357

If I reduce size (change ratio) of widget in the dashboard should it automatically shrink icon and all other items inside widget like shown below? Notice that I have reduce the height to 90 from 120. But my dashboard didnā€™t reduce icon size, how do I specify to reduce it?

title: Kitchen Panel
widget_dimensions: [120, 90]
widget_margins: [5, 5]
columns: 8

358

The widget dimension is really there to fine tune the aspect ratio so a set of tiles fill the screen off your tablet. Making drastic changes will mess with alignment as you have seen. In future I hope to make the widgets better at handling this, but the only solution I have now would be to ditch the alignment as was the case in the previous dashboard and nothing would line up, and the result would be just as bad :frowning:

You can make the icons smaller by changing their styles either at the widget level oir in a skin which should help a little.

Try something like this in the widget definition:

icon_active_style: "font-size: 200%"
icon_inactive_style: "font-size: 200%"

And play with the numbers until you get something better. That style will apply to the icons and text. Check the widget desctiptions to see which style options are supported.

359

Nice, I will play with numbers to best suit my needs. Letā€™s see how it goes with different tables and phones.
thanks

360

At the very least it should be possible to center the icons vertically which is 99% of the issue, but I need to add some additional templating and parsing to the widgets to enable that which I am not planning to do just now.

361

i think they like it so much that they really would like to intergrate the 2.
i can easily see ways to replace the old frontend with dashboard completely.[quote=ā€œscadaguru, post:346, topic:13141ā€]
but it would be really nice if we could just reuse the icons which are already customized in HA
[/quote]

customized icons are an atribute in HA.
i think that it isnt that difficult to set those icons as default for a widget and then only override if an icon is set in the widget yaml.
am i right @aimc is this an easy option for after beta?