First and foremost, I would switch to Fully Kiosk Browser once you get the brown-out issues resolved. It will provide a motion sensor to turn on the screen like you are getting with Tasker and a whole lot more. I have 2 8" Samsung Galaxy Tab 4s that were originally running Android 4.4.2 and I upgraded them manually to Android 5.1.1. FKB runs smoothly and provides a lot of sensors, a camera, and more.
This is the screen from the one on my nightstand. I am using a simple phone / tablet stand I found on Amazon to keep it upright. This is the daytime theme (yes I know it says it is after 11pm, but I changed it for you). See below for night time theme.
This dashboard is hanging on the wall in my living room right beside the doorway from my entry hall. This is the night mode view of the dashboard. Both tablets use this theme at night and the other theme during the day.
When motion is detected at my front door, Browser-mod will popup a larger view of the camera that is in this dashboard on BOTH tablets and will return to normal view after 60 seconds or on screen tap.
First, thanks for your blog, it’s been a huge inspiration for me.
Now onto the subject itself, I’d advise you to first answer those questions :
Who will use the dashboard ?
How often will it be used ?
Is this something you want to be displayed in your house, or hidden in a closet somewhere ?
What level of reliability do you want to achieve ?
Depending on this, you’ll have the option to either go with something crazy and shiny (but unreliable at first until you debug the mess), or a little more conservative but also more reliable (and you can always spice things up later on).
Think UX first, and then have a look at dribble, medium and so on for UI inspiration (that might make your current UI looks like potato … well it did that to me ).
As for my setup, which design is blatantly ripped of from somewhere I can’t remember, I have a main tab that’s used almost everyday by me and the wife :
@atomicpapa Thanks for that, your dashboards look pretty cool. I especially like the camera popup idea, but I don’t have a door camera yet. Regarding the browser, I’m already using WallPanel, which is similar to FKB but Open Source. It integrates with HASS via MQTT and also supports the sensors and camera features. I’m currently using it for motion detection (not Tasker, although that’s installed for future stuff).
@Vlavonvidden Thanks for that, your dashboards look great! I’m glad you like the blog and find it useful/inspiring. The tablet in question is located in our open plan kitchen/dining/living room area so it’s pretty much “public”. Right now that means myself and my wife will use it. I really like your main tab, I’ll have to steal some ideas from that!
@robconnolly Thanks for the feedback. Main tab is mostly made out of button cards & css using card mod for the rest. I still need to find a way to make the vacuum map pretty, but so far I’m pretty happy with the result, it looks okay and it works.
@Mariusthvdb Okay so this one is a bit tricky. Since it’s not the main topic here I’ll stay brief (if needed, I’ll create a new post on the forum) :
Each core is a button-card.
Each “room” is a vertical-stack.
I’m using mqtt sensors (inspired by check button card) for the background stuff, and a LOT of templating to minimize code length.
Button card is pretty handy :
Click to update the chore (with confirmation if needed).
Click and hold to have access to the chore settings:
(I rely on templating so I only need 2 input numbers even if I have 60 chores)
I’m working on double-click to cancel the latest action …
PM me if you want the details or the config. It still messy however ^^.
ps : At this point I’m pretty sure creating a dedicated card would be a better idea, but I lack the skills to do so.
I’ve posted a further update to this. Unfortunately, I couldn’t fix the power issues despite a valiant effort with a new power supply. In the end I managed to find a new tablet at a reasonable price and went for that. I’ve also fixed the brackets so they don’t obscure the screen (STL files in post), completed the MQTT integration and improved my dashboard:
Wow, your first screen looks amazing, I’m trying to make something like that myself!
I really like how you have organized sections with headers and cards inside.
Would you mind sharing some templates?
Markdown cards with some css tweaks using card mod :
Transparent background.
Dropped shadow removed.
Font adjusted.
Sections
If you want to get really fancy, use a grid layout (see layout card doc) to adjust the position of each item. This will be a nightmare to maintain, so I’d recommend defining a few blocks, then organize those using the vertical or horizontal layout option for the layout-card.
Use a vertical-stack for each block, the first card should be the header, then put anything you want in there (including hoorizontal stacks if you want button rows).
When your block are defined, adjust the layout depending on your screen size (use grid-mode with media queries if you want full control) and you should be fine.
Finally, I’d recommend using lovelace_gen for any attempt to customize the UI except for minor changes. Use and abuse of includes statements, and keep your lovelace config files as simple an organized as possible. This can be a good starting point if you don’t want to define a hierachy yourself.
i have an old samsung SM-T710 with android 7.0 running. this thing would not run HA as app, but webbrowser works fine.
is there a way to lose the webpage on top, so that only the HA-info is visable?