Internationalizing Flutter Apps

What’s internationalization
Why internationalize apps?
Flutter Intl plugin
How to implement it in Flutter
and a Sample Demo

Transcript

1. Internationalizing Flutter Apps Maureen Josephine Software Developer - Carepay Twitter : @J_Akello
2. AGENDA • What’s internationalization • Why internationalize apps? • Flutter Intl plugin • How to implement it in Flutter • Demo • Q/A
4. Internationalization Internationalization is how you architect your code to make it easy to localize text and layouts for each language or “locale” that the app supports.
5. Localization(l10n) & Internationalization(i18n)
6. Why Internationalize Apps?
10. Implementing Int’l in Flutter • Add a separate package - flutter_localizations • Specify additional MaterialApp properties • Using Dart intl tools NOTE: The package Currently Supports 77 Languages
11. Add Package to Pubspec.yaml dependencies: flutter: sdk: flutter flutter_localizations: sdk: flutter
12. APP LOCALIZATION PROPERTIES MaterialApp( //place app localization here localizationsDelegates: [ GlobalMaterialLocalizations.delegate, GlobalWidgetsLocalizations.delegate, ], supportedLocales: [ const Locale('en', 'US'), const Locale('sw', 'SW'), ], // )
13. Dart Intl Tools $ flutter pub run intl_translation:extract_to_arb --output-dir=lib/l10n lib/main.dart $ flutter pub run intl_translation:generate_from_arb \ --output-dir=lib/l10n --no-use-deferred-loading \lib/main.dart lib/l10n/intl_*.arb Windows :- ) $ flutter pub run intl_translation:generate_from_arb \--output-dir=lib/l10n--no-use-deferred-loading \lib/main.dart \lib/l10n/intl_en.arb lib/l10n/intl_fr.arb lib/l10n/intl_messages.arb Check More on this Here internationalization#dart-tools
14. Links https://api.flutter.dev/flutter/flutter_localizations/flutter_localizations-library.html https://docs-flutter-io.firebaseapp.com/flutter/flutter_localizations/MaterialLocalizationSw-class.html https://pub.dev/packages/intl
15. DEMO
17. THANK YOU @J_Akello