Prerequisites
- Flutter 3.x application
- Dart SDK
- Basic Flutter knowledge
Common Challenges
Problems developers face when localizing Flutter apps—and how IntlPull helps.
Setup Verbosity
Multiple files to configure: l10n.yaml, pubspec.yaml, LocalizationsDelegate. Initial setup is verbose.
ARB Tooling
ARB is less common than JSON. Fewer translation tools support it natively.
Build Step Required
Must run flutter gen-l10n after ARB changes. Easy to forget during development.
flutter_localizations Features
Why flutter_localizations is a great choice for Flutter localization.
Code Generation
Generate type-safe Dart code from ARB files. Autocomplete for message IDs.
vs string keys
ARB Format
Application Resource Bundle format. ICU MessageFormat syntax. Industry standard.
vs custom formats
Material Localization
Localized Material widgets out of the box. DatePicker, TimePicker in user's language.
vs manual widget localization
RTL Support
Automatic right-to-left layout for Arabic, Hebrew. Directionality widget included.
vs manual RTL handling
Plural/Gender/Select
Full ICU syntax. Handle complex pluralization rules across languages.
vs simple interpolation
Hot Reload Compatible
Translation changes hot reload instantly during development.
vs rebuild required
Quick Setup
Get flutter_localizations running in your Flutter project.
Add Dependencies
Update pubspec.yaml with localization packages.
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
intl: any
flutter:
generate: trueCreate l10n.yaml
Configure localization generation.
arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart
output-class: AppLocalizationsCreate ARB Files
Add translation files in lib/l10n.
// lib/l10n/app_en.arb
{
"@@locale": "en",
"hello": "Hello",
"@hello": {
"description": "Greeting message"
},
"itemCount": "{count, plural, =0{No items} =1{1 item} other{{count} items}}",
"@itemCount": {
"description": "Number of items",
"placeholders": {
"count": {
"type": "int"
}
}
}
}Configure MaterialApp
Set up localization delegates.
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: MyHomePage(),
);Use Translations
Access localized strings in widgets.
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
return Column(
children: [
Text(l10n.hello),
Text(l10n.itemCount(5)),
],
);
}
}IntlPull Integration
Connect IntlPull to manage translations professionally.
Install IntlPull CLI
Add the CLI for translation management.
npm install -g @intlpull/cli
# Or use dart pub global activate intlpull_cliConfigure intlpull.json
Set up the project configuration.
{
"projectId": "your-project-id",
"format": "arb",
"sourceLocale": "en",
"localesDir": "./lib/l10n",
"filePattern": "app_{locale}.arb"
}Sync Translations
Push source and pull translations.
# Push English source
intlpull push --source ./lib/l10n/app_en.arb --format arb
# Pull all translations
intlpull pull --format arb --output ./lib/l10nRegenerate Code
Run code generation after pulling.
flutter gen-l10n