Can I force a reflowing dashboard to a certain number of tiles across on mobile?

Can I force this screen to go to three columns on mobile?

The screen is set up as reflowing medium:

On the phone it looks like this:

I would like it to display three across? Is it possible without creating a separate dashboard that is scaled? Thanks.

Click the three dots at bottom right.
Select Configuration.
Set Number of Columns Wide to 3.

Thanks Stan. This only sets the number of columns in a scaled dashboard? My question relates to the way it creates columns in a reflowing dashboard. If you look at the screen shots above it shows access to the same dashboard both on a tablet and a phone. The phone automatically shows two columns. Why? Why not three?

TLDR: try a smaller “Tile Size” in your Dashboard Settings or even specify a custom one in between Medium and Small.

It’s based on the Tile Size you specify along with the width of the screen of the viewing device.
CleanShot 2024-11-04 at 17.45.37@2x

Keep in mind that most mobile devices use a Device Pixel Ratio greater than 1 which means that each logical pixel in software maps to more than 1 physical pixel. So if the device had a pixel ratio of 2 that would mean each logical pixel would get rendered across 2 physical pixels.

This is an important point as it means that a modern device like a Pixel 7 will have a resolution like 1080x2400 in its tech specs, but it uses a Device Pixel Ratio of 2.625 which means it has a logical resolution of 412x915 (sometimes called the “viewport”).

The resulting calculation ends up being something like:

  • 10px of space on each side of the dashboard * 2 = 20px
  • 10px tile gutter = 10px
  • 412px - 20px - 10px = 382px for tiles
  • 382px / 160px = 2.38 tiles could fit
  • Rounded down to 2 tiles scaled up slightly

Note that I’ve simplified the calculation steps to make it easier to understand the general concepts. In the real calculation, the gutter size is actually included per tile in the division rather than up front since it scales with the number of tiles that can fit in the device’s screen width.

1 Like

Yikes, this is a little confusing. But your quick answer solved it. I had to go with Custom 110 to get it to display three tiles wide on my iPhone.

This is also very helpful in setting up the devices in Google Chrome Emulator under Developer Tools. Thanks.

2 Likes