json_intl
Flutter Internationalization library based on Json files
Getting Started
Add a new asset folder to your pubspec.yaml
:
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
json_intl: [version]
flutter:
assets:
- assets/intl/
Add the translation delegate settings to your MaterialWidget and the list of supported languages:
MaterialApp(
localizationsDelegates: const [
JsonIntlDelegate(),
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
supportedLocales: const [
Locale('en'),
Locale('fr'),
],
home: ...,
);
On iOS, an extra step is necessary: add supported languages to ios/Runner/Info.plist:
<key>CFBundleLocalizations</key>
<array>
<string>en</string>
<string>fr</string>
</array>
Create the translation files in assets/intl/
:
strings.json
is the default and fallback file. Any translation not found in another file will be taken here.strings-XX.json
one file for each language.strings-fr.json
French translations,strings-de.json
for German, etc.strings-XX-AA.json
can also be used for specific countries, likestrings-en-uk.json
Using the translations
The content of the files is a json dictionary containing a key
/ value
list:
{
"app_name": "Flutter Demo",
"increment": "Increment",
"title": "Flutter Demo Home Page"
}
to get the values in the dart code, use:
JsonIntl.of(context).get(#app_name);
or
context.tr(#app_name);
Plurals
The json entry will look like this:
{
"cart": {
"one": "{{ count }} item in your Shopping cart",
"other": "{{ count }} items in your Shopping cart"
},
}
Other values are supported for specific values depending on the language: "zero", "one", "two", "few", "many", "other"
To use it in the application:
JsonIntl.of(context).count(itemCount, #cart);
The variable {{ count }}
is automatically populated with itemCount
.
Gender
The json entry will look like this:
{
"child": {
"male": "The boy",
"female": "The girl",
"neutral": "The kid"
},
}
To use it in the application:
JsonIntl.of(context).gender(JsonIntlGender.female, #child);
Mixing Plural and Gender
The json entry will look like this:
{
"child": {
"male": {
"one": "a boy",
"many": "{{ count }} boys",
},
"female": {
"one": "a girl",
"many": "{{ count }} girls",
},
"neutral": {
"one": "a child",
"many": "{{ count }} children",
}
},
}
To use it in the application:
JsonIntl.of(context).translate(#child, gender: JsonIntlGender.female, count: 3);
Generating the translations
It's also possible to generate a file that contains the translation keys and/or the full translation strings for all languages.
For this, add json_intl_gen
to your dev_dependencies
.
and follow the documentation for json_intl_gen