Flutter - Text Widget does not render currency icons

Question

In my application, I have a screen that shows pricing. However, the currency icon does not appear correctly in some places (look at the amount 7000). This problem is more frequent on iOS devices, with a few occurrences on Android devices.

The information is retrieved in the following manner:

Text("₹ 7000.00") // in application the pricing is retrieved from api call.

The currency icon is included in the data I receive from the api request. "₹7000" is an example.

The font used is Gotham Rounded. Is this due to the font's inability to render currency icons? What is the best way to resolve this problem?

This is because of the font, use `fontFamilyFallback`. try this https://stackoverflow.com/a/68693134 — nitishk72, May 03 '22 at 09:15
@nitishk72 does `fontFamilyFallback` render alternate fonts if the current one not render properly — Febin Johnson, May 03 '22 at 10:48
Do i need to add another fonts on pubspec? and add that to fontFamilyFallback ? — Febin Johnson, May 03 '22 at 10:56

Denzel · Answer 1 · 2022-05-03T09:19:49.800

3

It's better to use Unicode characters for currency symbols because most of the symbols are not yet supported in flutter so your device does not understand the string so it does not render it on mobile.

Unicode characters on the other hand could be easily translated after compilation

You can find unicode characters for different symbols here

So you have something like this instead

Text("\u{20B9}");

edited May 03 '22 at 09:19

answered May 03 '22 at 09:16

Denzel

942
5
14

For „₹“ is U+20B9 the currency symbol – DEFL May 03 '22 at 09:17
Yeah I just editted it thanks – Denzel May 03 '22 at 09:20
@Denzel Correct me if I'm wrong, If the symbols aren't yet supported shouldn't the symbol on the button not be rendered? – Febin Johnson May 03 '22 at 11:55
You're not wrong but usually to avoid the anomaly we use unicode characters – Denzel May 03 '22 at 12:38

Flutter - Text Widget does not render currency icons

1 Answers1