What is the ideal way to scale font size in App Development?

问题

I know this question might sound a bit odd. I am a newbie in Flutter Development. While making my app responsive I always face an issue while scaling the text. If I keep the font size constant (say 10 or 20) it sometimes looks too small on devices with large resolution or too big on small phones. Then I tried scaling it with respect to screen dimensions (like 4% or screen width etc) but then the question remains to scale it with respect to screen height or width ? Hence I want to know what is the ideal way for scaling the text in general.

Thankyou in advance for answering.

回答1:

You can create dimension files and the sizes defined in these files will be used according to the device's dpi. You will have to create:

res/values-mdpi/dimens.xml
res/values-hdpi/dimens.xml
res/values-xhdpi/dimens.xml
res/values-xxhdpi/dimens.xml
res/values-xxxhdpi/dimens.xml

Following are the ratios you would want to use for different screen size: 3:4:6:8:12 (m:h:xh:xxh:xxxh)

Let's say you have a device(hdpi), you want to set the text size to 12sp. So you will set text sizes as:

mdpi - 9sp
hdpi - 12sp
xhdpi - 18sp
xxhdpi - 24sp
xxxhdpi - 36sp

Make sure the name should be same in all 'dimens.xml'

res/values-mdpi/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <dimen name="title">12sp</dimen>
   <dimen name="paragraph">9sp</dimen>
</resources>

res/values-hdpi/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <dimen name="title">16sp</dimen>
   <dimen name="paragraph">12sp</dimen>
</resources>

res/values-xhdpi/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <dimen name="title">24sp</dimen>
   <dimen name="paragraph">18sp</dimen>
</resources>

res/values-xxhdpi/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <dimen name="title">32sp</dimen>
   <dimen name="paragraph">24sp</dimen>
</resources>

res/values-xxxhdpi/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <dimen name="title">48sp</dimen>
   <dimen name="paragraph">36sp</dimen>
</resources>

来源：https://stackoverflow.com/questions/64113630/what-is-the-ideal-way-to-scale-font-size-in-app-development

标签

android

Flutter