How do I make my apps look nice on my mobile display?

Anvil Q&A
1

Why does my app look dodgy on a mobile device? My columns aren’t that wide, but they always go over multiple lines when viewed on an iPhone screen.

1 Like
2

Hi Stuart,

Good news - Anvil gives you a lot of control over how your apps look on phones or tablets.

Anvil apps are responsive - they adapt to the size of screen you’re using. If you view them on a small screen, by default the columns on your form (or any other ColumnPanel) wrap into rows, so you can see everything on your phone.

You can change this, though - if you select a ColumnPanel (or select a Form by clicking the background), you can select its behaviour on small screens:

  • mobile (the default) means that columns will collapse into rows on mobile-size displays.
  • tablet will collapse on tablets and mobile.
  • never means the columns always stay there.

You don’t need an actual device to preview this - you can resize your browser window to see how it looks.

(Technical detail: Any screen less than 768 pixels wide counts as “mobile”, and anything smaller than 992px is “tablet”.)

I hope that helps!

3 Likes