i18n_localizations 1.1.2 i18n_localizations: ^1.1.2 copied to clipboard
A simple flutter package for internationalization, angular TranslateService users will love this package.
i18n_localizations #
A flutter package for internationalization, it allows you to simply add the translation of the application according to the language of the device, it uses json files as angular. You only need to configure it properly to be able to translate your entire app.
Getting Started #
Follow the next step for use i18n_localizations
Configuration #
To use this library, you will need json file you can put there where you want, but don't forget to add them to your pubspec.yaml
assets:
- {translateDir}/en.json
- {translateDir}/fr.json
- {translateDir}/{languageCode}.json
or
- {translateDir}/en_US.json
- {translateDir}/fr_FR.json
- {translateDir}/{languageCode}_${countryCode}.json
You need to initialize a I18nLocalizationsDelegate white a list of supportedLocales and a pathFile where the json file are store.
final I18nLocalizationsDelegate i18n = I18nLocalizationsDelegate(
supportedLocales: [Locale('en'), Locale('fr')],
pathFile: '{translateDir}'
);
or
final I18nLocalizationsDelegate i18n = I18nLocalizationsDelegate(
supportedLocales: [Locale('en', 'US'), Locale('fr', 'FR')],
pathFile: '{translateDir}',
haveCountryCode: true
);
Then you need to configure the supportedLocales, localizationsDelegates and localeResolutionCallback of your MaterialApp or CupertinoApp
supportedLocales: i18n.supportedLocales,
localizationsDelegates: [
i18n,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate
],
localeResolutionCallback: (Locale locale, supportedLocales) {
return i18n.localeResolutionCallback(locale);
},
Result
// construct the i18nLocalisationsDelegate
final I18nLocalizationsDelegate i18n = I18nLocalizationsDelegate(
supportedLocales: [Locale('en', 'US'), Locale('fr', 'FR')],
pathFile: '{translateDir}'
);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'MyApp',
onGenerateRoute: router.generateRoute,
debugShowCheckedModeBanner: false,
initialRoute: HomePageRoute,
// set the supportedLocales for the app
supportedLocales: i18n.supportedLocales,
localizationsDelegates: [
// don't forget to put the delegate
i18n,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate
],
localeResolutionCallback: (Locale locale, supportedLocales) {
// get the default local when the device language is not supported, use the first one
// from the list (English, in this case).
return i18n.localeResolutionCallback(locale);
},
);
}
Use #
To use I18nLocalizations, just call :
I18nLocalizations.translate(context,"keySimple")
I18nLocalizations.translate(context,"key.child_one")
I18nLocalizations.translate(context,"key.child_two.grandchild")
I18nLocalizations.translate(context,"keyParams", params:{"key": "value"})
I18nLocalizations.translatePlural(context,"keyPlural", params:{"key":"6"})
I18nLocalizations.translatePlural(context,"keyPlural", params:{"key":"1"})
I18nLocalizations.translatePlural(context,"keyPlural", params:{"key":"not a number"})
And the json file will look like:
{
"keySimple": "key simple",
"key": {
"child_one": "child 1",
"child_two": {
"grandchild": "grandchild of key"
}
},
"keyParams": "keyParams have a params or a {key}",
"keyPlural": {
"none": "there are none key here",
"one": "the value of our key is {key}",
"many": "we have {key} keys"
}
}
Note: there should be no space between the key and the parameter hooks
⚠️ Note on iOS #
For translation to work on iOS you need to add supported locales to
ios/Runner/Info.plist
as described here.
Example:
<key>CFBundleLocalizations</key>
<array>
<string>en</string>
<string>fr</string>
</array>