Pages take longer to load with modular configuration

its probably just a fealing.
widget_size doesnt do anything other then a preset so you dont have to set every widget.
its the dimensions that are the problem.

widget_size: [20,20]

means that you can use

  • spacer

in stead of

  • spacer(20x20)

ah ok i see what your saying. So something like this:

widget_dimensions: [6, 6]
widget_size: [20, 20]
widget_margins: [0, 0]
columns: 32

and

- empty: 7
- spacer(5x6), garage(12x6), spacer(1x6), living_room_tv(13x6), spacer(1x6), pause_atv(12x6)

that would result in a garage widget from 72x36

so no you didnt get it. :wink:

widget_size is a default setting.
you can even leave it out if you like.

example:

widget_dimensions: [120, 120]
widget_size: [1,1]
widget_margins: [0, 0]
columns: 10

layout:
  - widget1,widget2(2x1),widget3(2x2)

is the same as

widget_dimensions: [60, 60]
widget_size: [2,2]
widget_margins: [0, 0]
columns: 20

layout:
  - widget1,widget2(4x2),widget3(4x4)

is the same as

widget_dimensions: [60, 60]
widget_size: [400,400]
widget_margins: [0, 0]
columns: 20

layout:
  - widget1(2x2),widget2(2x1),widget3(2x2)

is the same as

widget_dimensions: [120, 120]
widget_size: [2,2]
widget_margins: [0, 0]
columns: 10

layout:
  - widget1(1x1),widget2(2x1),widget3

notice the widgets where i didnt give the size!

Thanks Rene, apologize if Im being an idiot here. the vertial spacing is about to have me throw this laptop through the window.Ive tried the suggestions but when adding lines lines below they all seem to want to goto the top. for example

title: Please Work
widget_dimensions: [60, 60]
widget_size: [2,2]
widget_margins: [0, 0]
columns: 20

layout:
    - label(2x2), spacer(2x2), clock.clock(12x2)
    - roomba(2x2)

When I try clock(16x2) it looks the same, just pushes roomba farther to the right. This is the part thats messing with me, I feel like if I can get the lines right i could get it…

yeah i know its a bitch sometimes. the empty spce is killing :wink:
you forgot that you take 2 lines vertical so you need an empty line :wink:

layout:
    - label(2x2), spacer(2x2), clock.clock(12x2)
    -
    - roomba(2x2)

if you dont give the empty line, widgets get placed upon each other and then they do very unexpected things.
it has given me some nightmares too :wink:

and you did set size to 2x2 so this would work too:

layout:
    - label, spacer, clock.clock(12x2)
    -
    - roomba

I very much appreciate you taking the time to assist. I give up though lol. I was able to get it to line up as expected with 60x60. But if I try in drop down to 20x20 it looks like crap again with everything on top. I extended to 60 columns. It just doesnt make since. If I was using 60x60 and columes set to 20, then simple math would make me believe 20x20 would be 60 colums. I also tried using a blank line, still all at the top. I tried using a line with the empty: and different numbers.

Like I said man I really appreciate it, i really want that layout above but I just dont think im ever going to be able to get it and I dont wanna keep bugging you

i have no problem with being bugged :wink:

try this please:

#
# Main arguments, all optional
#
title: Control Panel
widget_dimensions: [12, 12]
widget_size: [10, 10]
widget_margins: [0, 0]
columns: 83

global_parameters:
    use_comma: 0
    precision: 0
    use_hass_icon: 1

layout:
    - label(12x2), spacer(59x2), clock.clock(12x2)
    - 
    -
    -
    - spacer(10x10), garage(20x10), spacer(2x10), living_room_tv(20x10), spacer(2x10), pause_atv(20x10)
    - empty: 10
    - spacer(10x10), climate(20x10), spacer(2x10), lr_sonos(20x20),  spacer(2x10), power92(20x10)
    - empty: 10
    - spacer(10x10), living_room_light(9x10), spacer(2x10), kitchen_light(9x10), spacer(2x10), spacer(2x10),  movie_light(9x10), spacer(2x10), xbox(9x10)
    - empty: 20
    - main(21x6), bedroom(21x6), remote(21x6), info(20x6)

Thanks, that actually helped…I used the config above and saw whwat I was looking. but when i make any adjustments at all it all goes to shit. Am i thinking this right? If we are using 12x12 and we have 83 columns that is 996 width. So I would be trying to get to that number each row in order to have 0 unused space?

It was a little wide for me, Im using ipads. I would think we would be tryting to use 1024x768 or a number like that.

i used 1000 pixel because you used that before.

if your screen is 1024 it would leave 14 pixel left and 14 pixel right unused.
you could get it up to 85 then.

to get it to work right with a setup like this you need to try to get 0 space left. thats right.

you can adjust it, but you need to take something out if you add something.
empty lines also are a thing to think about.

- widget(10x10)
- empty: 9
- widget(10x10)

makes that they are placed right below each other without space in between.

Hey this is unrelated but I think I seen you mention you run on a computer and not pi. Would there be a performance benefit to running ha and hadashboard on a Mac mini with an ssd or would it be unnoticed? Thank you!!

my dashboard is running on RPI.
i have had it on my pc a long while ago.
i mentioned that there is a performance difference between loading the dashboard on a PC browser and loading it on a tablet.

i dont have a clue about a mac mini.
dont know if its faster, what runs on it, etc (i dont expect you are running linux on a mac?)

ah alright. Its a mac mini I use strickly as a plex server. It is barely used, i put a ssd and 16g ram in it, its i5 2.6g nothing special but i was just curious…might test it out here soon:)

1 Like

I was in the same boat, the tile placement can be unpredictable at times, and frustrating. Things seem to always try to fill up and to the left (sometimes disregarding spacers in my case). At first I tried going full modular with 1x1 tiles but the performance on my tablets crashed and burned. So I had to try to get the biggest tile while still keeping my look that I was going for.

Hopefully this helps more than confuses, but here is my config for this somewhat complicated dash (1280x800 + touch of overhang)

widget_dimensions: [37, 37]
widget_margins: [3, 3]
columns: 32

#top
layout:
    -  header(29x1), clock.clock(3x1)

#middle
layout:

  - weather(8x7), iframe2(12x7),   ryan_presence(4x3),  media_player(8x7)
  - empty: 2
  - doorsandwindows(4x1)
  - empty: 0
  - ashley_presence(4x3)
  - empty: 2
  - thermostat2(4x3),  relax(4x3), livingroomfull(4x3), movietime(4x3), tv(4x3), iframe1(12x8)
  - empty: 2
  - kitchen(4x4), counter(4x4), ambient(4x4), couch(4x4), fan(4x4)
  - empty: 3
  - bar(4x4), bedroom(4x4), disco(4x4), security(4x4), leaving(4x4)
  - all_off(4x3), good_morning(4x3), good_night(4x3)
  - empty: 2

#bottom
layout:
    - home(4x1), partylink(4x1), reload(24x1)

2 Likes

Thank you!! I will give this a try tonight. Are you using an iPad?

doesnt matter which tablet you use, what is important is what screensize your tablet uses. in some you can set them, in others you can find that out in the settings or just by trying.

To @ReneTode’s point, doing some math before building out the layout helps a ton. Find the resolution of your tablet. (mine = 1280x800)
Then play with the numbers.

For example I wanted 8 columns, but I wanted some to be partials, so I ended up with 32 (4 dash columns = 1 ‘normal’ visible column).

Working with that:
x = margin width & y = normal tile width
Try to find two numbers that get you as close to 1280 as makes sense.
33 margin items and 32 tile items would make up my 8 ‘normal’ tile wide view.

x * 33 + y * 32 = 1280

That’s how I ended up with 37 and 3

3*33 + 37 * 32 = 1283 <-- 3 pixels of overhang.

1 Like

if you use margins it gets even more complicated.

widget_dimensions: [37, 37]
widget_margins: [3, 3]
gives you a tile size from 40 including margin.

but:
(1x1) is 37x37 pixels
(2x2) is 87x87 pixels
(3x3) is 117x117 pixels

so a widget pixelsize = (x*dimension)-margin

Wouldn’t it be (x*dimension)+((x-1)*margin) ?

A 1x1 tile doesnt overlap any margins.
A 2x2 tile overlaps 1
…

So total width = (x * dimension) + ((x+1) * margin) because you have the far left and far right margins.
At least that’s how I got my above numbers.

1 Like

your right i did write it down to fast, without rereading.

I just noticed your beautiful weather widget. Any change you would be willing to share that?