android – How do you deal with density differences?

And I used to think CSS was bad.

enter image description here

DP, DPI, density, PPI, whatever it is – the higher it gets, everything starts to scale to the point where text just overflows, and my design starts to crumble.

I did the entire design based on 420 DP and I have the following controls predominantly in my UI code:

  • ContentPage
  • Grid
  • Vertical Stack
  • Label
  • Image
  • Button
  • A switch
  • A collectionview
  • Entry
  • Border

I don’t know if these can be seen as “fancy” but I’m trying to keep it as simple as possible so MAUI wouldn’t break.

FontSizes in my Labels are hardcoded, and this is where my problem begins.
Since there is MAUI does not dynamically scale font sizes based on available space, on higher density, I start getting overflows in text since they are meant to be say FontSize = 12 on 420 DP, but they look 28 on 560.

How many density values do I even need to support? Also this is only Android, we also have iOS.
Is my only option to map DeviceDisplay.MainDisplayInfo.Density values and make the same design dozens of times? I really doubt that is the way.
So, how do you solve this problem?

Latest articles


Related articles

Leave a reply

Please enter your comment!
Please enter your name here