Easily integrate Multi-Language in Flutter App

--

Multi-language support in your application is very important to cover global market. Many tutorials are available for Flutter Localization & Integrate multi-language support in Flutter but I made a very easy tutorial for add multi-language in Flutter app. Also this tutorial helpful for beginners to learning about Flutter Localization.

Here is the complete demo app with full source code for Flutter Localization & Multi-Language support in Flutter.

Why Multi-Language?

Adding multi-language support in application is crucial for global accessibility, enhanced user experience, market expansion, cultural sensitivity, competitiveness, and adaptability to user preferences. It ensures a wider audience, increased satisfaction, and a strategic edge in a diverse and competitive landscape.

Multi-language support in Flutter

Getting Stated with Multi-Language :

First you need to create a new Flutter project with follow this steps :

  1. Open your terminal or command prompt.
  2. Enter the following command :
flutter create multi_language_app

Add Dependency :

By default, Flutter only provides US English localizations. So, need to add flutter_localizations as a dependency to your pubspec.yaml file. As of December 2023, this package supports 115 languages and language variants.

Open the pubspec.yaml file and make the following changes:

dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
shared_preferences: ^latest_version

Add the Languages :

First create the language folder under your lib folder. Then create create the language.dart file in language folder. After that create an abstract class which contains all localized strings. We need to define all localized texts in different language string files which is looks like below :

After that you can create other Languages class as per your requirement and extend Languages class and overrides all strings. Here I added the three languages which is English, Arabic, and Hindi.

Here is the my language_en.dart file :

Here is the my language_ar.dart file :

Here is the my language_hi.dart file :

Create LocalizationsDelegate :

The LocalizationDelegate in Flutter is required for multi-language support as it manages the localization logic, allowing the app to dynamically switch between different languages.

AppLocalizationsDelegate is the key file for localization. Create a class and extend LocalizationsDelegate and give our created Languages class in a generic parameter. After that you need to override with 3 methods which is isSupported, load and shouldReload. So, now create the localization folder under your lib folder. Then create create the delegation.dart file in localization folder which is as per below :

Setup the main.dart file :

Need to create the MyApp class with StatefulWidget because whenever changing language at time whole app rebuild and reflect with the new language. So, first need to set some properties in MaterialApp Widget.

We need to add MaterialApp widget supportedLocales and localizationsDelegates inside MyApp() class like below :

supportedLocales: const [
Locale('en', ''),
Locale('ar', ''),
Locale('hi', ''),
],
localizationsDelegates: const [
AppLocalizationsDelegate(),
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],

Here is the full source code for the main.dart file :

Also you can use the SharedPreference for store language locale & get locale which we used in main class. I have defined it in the constant.dart file.

When run the application, we ought to get the screen’s output like the underneath screen capture.

Final Output — Flutter Multi-Language App

Conclusion :

In this blog, we learned about the multi-language support in Flutter, exploring how to create a truly globalized app that caters to a diverse audience. From handling localization and internationalization to implementing language-switching mechanisms.

By incorporating robust language support in your Flutter applications with me, you not only enhance user accessibility but also will open doors to new markets and opportunities.

❤ ❤ Thanks for reading this article ❤❤

Codeklips

Thank you for reading until the end. Before you go:

--

--

Prashant Vaddoriya - Senior Flutter Developer

Senior Flutter Developer | Mobile App Development | Android App Development | iOS App Development