Internationalizing Your Flutter App

An image showing a mobile app contains languages symbols which suggest on internationalizing your flutter app.
Original Image Credit to: EKATERINA BOLOVTSOVA | Icons from Icons8 | Edited by Louiejay Lomibao

Not all of your users can speak or read English. That is why internationalizing your Flutter app comes into the picture. But what is internationalization?

Basically, people who speak a different language cannot understand your app, thus, it must be internationalized. That implies you must develop the app in a style that allows you to localize values such as text and layouts for each language or locale supported by the app. Flutter has widgets and classes that aid with internationalization, while the Flutter libraries themselves are multilingual.


Dependencies & Internationalizing

Naturally, Flutter provides just US English localizations by default. To add language support, an application must provide new MaterialApp (or CupertinoApp) settings and include the flutter localizations package. This package supports 78 languages as of November 2020.

Thus, we must add this plugin called flutter_localizations by inserting the code below into our pubspec.yaml file.

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations: # Add this line
    sdk: flutter         # Add this line

Next, run pub get packages, then import the flutter_localizations library and specify localizationsDelegates and supportedLocales for MaterialApp. We can utilize it by importing the package below:

import 'package:flutter_localizations/flutter_localizations.dart';
return const MaterialApp(
  title: 'Localizations Sample App',
  localizationsDelegates: [
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
  ],
  supportedLocales: [
    Locale('en', ''), // English, no country code
    Locale('es', ''), // Spanish, no country code
  ],
  home: MyHomePage(),
);

Therefore, To tailored our Widgets it should localized messages with the proper left-to-right and right-to-left layout. After installing the flutter localizations package and applying the code above, the Material and Cupertino packages should now be correctly localized in one of the 78 supported locales.

To see if your app is localize, try to change the target platform’s locale to Spanish.

Apps built with WidgetsApp are similar, except that the GlobalMaterialLocalizations.delegate is not required.

Although the Locale default constructor is still entirely valid, the full Locale.fromSubtags constructor is preferred because it supports scriptCode.

Additionally, LocalizationsDelegates list items are factories that generate collections of localized data. While the delegate on the other hand provides the Material Components library with localized strings and other values.

Lastly, The GlobalWidgetsLocalizations.delegate specifies the widget library’s default text orientation, which can be left-to-right or right-to-left. Which all of these will be useful for internationalizing your Flutter app.

Conclusion

To conclude, people who speak a different language cannot understand your app, it must be internationalized. To add language support, an application must provide new MaterialApp settings and include the flutter localizations package. This blog explains the principles and workflows required to localize a Flutter application. If your Flutter app needs to communicate with its users in different variations, the official Flutter documentation explains it in the advanced locale definition section. Thank you for reading. Farewell

Leave a Comment

Your email address will not be published. Required fields are marked *