Updated 2 May 2023
Multi-language support is an important feature to globalize the application and increase the user audience. Language is a factor that connects people and the same principle is applied to app development also. When a customer sees their native language, it creates an emotional bond with the app.
FACT
English continues to represent the most common language on the Internet, almost 75% of app users do not speak English, which leaves a considerable big market available for multilingual apps.
Transform your app idea into a reality with our Flutter app development services.
Flutter by default only provides the US English localization. For supporting other languages, the application must specify additional properties and include the package called flutter_localizations
. As of November 2020, this package supports 78 languages.
Check the below code for practical implementation.
Add the below package as a dependency to your pubspec.yaml
file:
1 2 3 4 5 |
dependencies: flutter: sdk: flutter flutter_localizations: #Add this line sdk: flutter #Add this line |
In the next step, import the flutter_localizations library and specify localizationsDelegates
and supportedLocales
for MaterialApp
:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
import 'package:flutter_localizations/flutter_localizations.dart'; MaterialApp( localizationsDelegates: [ // ... app-specific localization delegate[s] here GlobalMaterialLocalizations.delegate, GlobalWidgetsLocalizations.delegate, GlobalCupertinoLocalizations.delegate, ], supportedLocales: [ const Locale('en', ''), // English, no country code const Locale('es', ''), // Spanish, no country code // ... other locales the app supports ], ) |
Once the flutter_localizations
package is added, use the following instructions to add localized text to your application.
intl
package to the pubspec.yaml
file:
1 2 3 4 5 6 |
dependencies: flutter: sdk: flutter flutter_localizations: sdk: flutter intl: ^0.16.1 #Add this line |
generate
flag in the pubspec.yaml
file:
1 2 |
flutter: generate: true #Add this line |
l10n.yaml
with the following content:
1 2 3 |
arb-dir: lib/l10n template-arb-file: app_es.arb output-localization-file: app_localizations.dart |
${FLUTTER_PROJECT}/lib/l10n
, add the app_es.arb
template file.
1 2 3 |
{ "hello": "Hola!!" } |
${FLUTTER_PROJECT}/flutter_gen/gen_l10n
after which we will start using the localization in the app.
1 2 3 4 5 6 |
import 'package:flutter_localizations/flutter_localizations.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart'; // Add this line Widget build(BuildContext context) { return Text(AppLocalizations.of(context).hello); } |
In this way, we can support multi-languages in flutter apps.
If you have more details or questions, you can reply to the received confirmation email.
Back to Home
Be the first to comment.