Ui: Android font rendering problem

[mypark]

On Android, the font renders badly with weird thin/thick weights.

could be a duplicate of closed issue: font rendering issues in android #118 https://github.com/shoutem/ui/issues/118

[Talor-A]

happens to me as well.

[tafelito]

+1

[Talor-A]

is there a way to remove the custom font from all shoutem components to avoid this problem?

[Definitely-Not-Vlad]

@Talor-A You can modify the theme.js file in the UI toolkit to determine the font used by different components.

[mypark]

So is the suggested solution to change the font away from Rubik in Android?

[Definitely-Not-Vlad]

It seems the issue is only with Rubik-Regular.

Here you can see how to override the default theme variables, including the fontFamily of certain components. This would be a workaround for the time being.

We'll look into the issue more closely to see if we can resolve Rubik-Regular's rendering on Android.

[Unforgiven-wanda]

Replacing the fonts inside the folder myproject/android/app/src/main/assets/fonts/ with the ones downloaded from Google fonts fixed it for me
The downside is that I have to perform this action whenever I install a new package or use react-native link

See

Taken from my Emulator running with Genymotion

[Definitely-Not-Vlad]

Hey guys.

This issue has been resolved with version 0.22.1 of the UI toolkit. Android and iOS should now render the font identically.