Flutter i18n: How do I override device locale's regional formatting with app's user preferred regional formatting?

Question

I have read through the flutter i18n docs. I would like to achieve what Windows or Mac does - we can select a region, say India and have the regional settings like start of week etc set. The user can override the Indian regional settings by setting the start of week to some other day as well. Not sure how to go about this with flutter intl as the docs only speak of changing the entire locale as a unit.

Here's windows' screenshots for reference.

I know that there's a locale attribute to MaterialApp. It only takes in a predefined locale id like en, fr, fr_CA etc. What do I do when I want a specific date formatting in fr_CA, instead of the default one defined by 'fr_CA' locale? And have those user preferred formats set even after app-wide or system-wide locale changes.

Answer 1

I think the GlobalMaterialLocalizations can be extended and modified with user's preferences. Didn't want to go that route as it seemed like an overkill. Instead, we can simply store the user preferences and use them if present over the default locale's. For example, to use the user's preferred number formatting,

if (userPreferencesAreSet) {
  formattedNumber = NumberFormat(userPreferredPattern).format(1234567.89);
} else {
  formattedNumber = NumberFormat.decimalPattern().format(1234567.89);
}

Refer dart's intl for number formatting patterns. We would use a BLoC to store the deviceLocale or user preferred locale and set it in the MaterialApp's locale attribute on change. Here's a working example I made with flutter_bloc library - github link