Auto Adjusting Tile Width

I’m wondering if there’s a way to have tiles that auto-adjust to fill up a percentage of the screen. As an example, I have a dashboard called, “First Floor” that links to sub-dashboards of all the rooms on the first floor of my house. There aren’t many, so I sized them to fill up as much real estate as I could. But when displayed on a device with a smaller viewport, the results are less than desirable. (I understand the dashboards are responsive based on viewport)

My question: Is there a way to define the relative width a tile can consume? E.g. 50% of the viewport, or 100% of the viewport, or “fill remaining row”. (Think CSS flexbox)

For now, my only solution is to create separate dashboards for each viewport, which is very time consuming, and only works for devices with static positioning. Example: When I reorient my iPhone from portrait to landscape, the dashboard is thrown completely off.

Here are some examples of the challenge I’m running into.

Good:

Not so good:

Really really bad (scrollbars):

1 Like

Had the same question and my suggestion was to have a Container item that could hold child Tiles, this should be possible with very little work on the existing architecture. however, I agree that if they did rewrite it from the ground up a flexbox solution would be best, just wanted to add to your suggestion that only working with % would only cover one viewport, it would need to have breakpoints to make it work of all platforms from Phones to large 4K TVs.

being able to dynamically manage breakpoints (max px) and giving each breakpoint a name (or have predefined ones) and being able to set 12th part (%) for each breakpoint on all tiles would be sweet indeed.

Just wish they also add the ability to create Grouping Containers but that’s just me.

Christian

Not at the moment as tiles have to be a fixed width with the current grid system. I’ve noted the request though and will leave the discussion open so we can keep an eye on the level of community interest.

:tada: UPDATE! Scalable dashboards are now available (release notes)

We also have a feature request in for an optional ‘canvas’ style layout where you would define the aspect ratio of the canvas and then could position and size tiles relative to the canvas so the dashboard could scale and grow to fit various devices.

This wouldn’t necessarily solve the challenge of changing from landscape to portrait, but I think a ‘canvas’ layout would be a nice alternative for people who want more control over the relative position, size, and grouping of items on their dashboard. And it would be particularly helpful for people who want to show the same dashboard on different sized tablets (eg. 7", 8", or 10" tablet).

Thanks, josh. Looking forward to any insight/methods you guys can offer on how to address the viewport challenge.