What to do when you really want to maintain textual content from resizing and tips on how to check how your compilations look with totally different font ratios utilizing the preview.
Earlier than we start, stopping font scaling will not be one thing it is best to use on a regular basis. Many individuals use the font scaling options on their gadgets to assist them learn what’s on the display. This can be a crucial accessibility function.
Nonetheless, every now and then, you might need to forestall the font from scaling in case you have a component that should keep a selected measurement to suit your total format on the display with out scrolling, stopping textual content. down a brand new line or comply with the scan specification. screenshot or learn with one thing exterior to the machine (reminiscent of a barcode scanner). When that is essential you may forestall font scaling case by case utilizing common Jetpack Compose Textual content could be reassembled.
Set font scale preview
So we are able to observe totally different scale variations within the preview we are able to use fontScale Parameters can be found in @Preview notice:
fontScale permits a float worth with 1.0f equal to regular font measurement, to not scale. We are able to set a distinct worth right here and it’ll apply this scaling setting to the whole lot within the preview.
For my Pixel 6 Professional, I’ve 4 totally different font scaling choices, so I need to create a set of previews for every scale degree. In order that I haven’t got to repeat @Preview captions are arrange on a regular basis and replicate my previews for each scale degree that I’ve arrange remark a number of previews as follows:
This results in the previews:
Forestall font scaling
When utilizing Jetpack Compose Textual content composable we are able to set font measurement utilizing fontSize parameters. This takes a TextUnit that might be a sp or em worth.
In case you are utilizing em then your font will not resize when the font scale adjustments as a result of it is a relative font measurement. Alternatively sp by definition is a scaled measure of pixels, thus resizing.
Usually, to make this reusable, this is able to be outlined as a variable elsewhere in your challenge or theme. However for my instance, I’ll use 16.sp as a price.
Within the previews above you may see that to entry the font scale worth we are able to use LocalDensity.present.fontScale to detect present scale worth.
To make use of this in our Textual content composable, we are able to create a easy extension operate that can scale ours TextUnit worth equal to fontScale to get the ‘regular’ worth, not the unique scale:
This may then be used for any Textual content composable when a hard and fast measurement is required:
And as we are able to see within the preview, all of the textual content is similar measurement!
To test the complete code you could find it on github: