How to Add Localization / Multi-Language Translation in Flutter

In this example, we are going to show you the way to Internationalizing Flutter apps. You will learn to add Localization and Multi-Language translation in Flutter App. See the example below:

First, you need to add get Flutter package in your project by adding the following lines in pubspec.yaml file.

dependencies:
  flutter:
    sdk: flutter
  get: ^4.3.8

Import package to script:

import 'package:get/get.dart'

Create Language Translation Map Class to add multiple language sentences:

import 'package:get/get.dart';

class WorldLanguage extends Translations {
  @override
  Map<String, Map<String, String>> get keys => {

        'en_US': {
          'hello': 'Hello, How are you?',
          'going': 'Where are you going?',
          'email': 'Hello @name, your email is @email'
        },

        'es_ES': {
          'hello': '¿Hola, cómo estás?',
          'going': '¿Adónde vas?',
          'email': 'Hola @name, tu correo electrónico es @email'
        },

        'ru_RU':{
          'hello':'Привет, как дела?',
          'going':'Куда ты направляешься?',
          'email': 'Здравствуйте @name, ваш адрес электронной почты @email',
        }

        //add more language here
      };
}

Change MaterialApp to GetMaterialApp like below, and add localization properties:

void main() {
  runApp(
    GetMaterialApp( 
      home: MyApp(),
      translations: WorldLanguage(), //Language class from world_languages.dart
      locale: Locale('en', 'US'), // translations will be displayed in that locale
      fallbackLocale: Locale('en', 'US'), // specify the fallback locale in case an invalid locale is selected.
    )
  );
}

To Translate to Local passed to GetMaterialApp, and when language changed:

Text("hello".tr)

"hello" key is from the Translation class.

To pass arguments with translation:

Text("email".trParams({
       'name':'John',
       'email':'[email protected]'
 }))               

To Change/Translate to Another Language:

var locale = Locale('es', 'ES');
Get.updateLocale(locale); //set language to Spanish (ES)
//you can save this language on preference, and get on app start

var locale = Locale('ru', 'RU');
Get.updateLocale(locale); //set language to Russian
//you can save this language on preference, and get on app start

When the locale is changed, it will translate the language to every active or inactive page.

Full Code Example:

File Directory:

1. main.dart
2. world_language.dart

main.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:testapp/world_languages.dart';

void main() {
  runApp(
    GetMaterialApp( 
      home: MyApp(),
      translations: WorldLanguage(), //Language class from world_languages.dart
      locale: Locale('en', 'US'), // translations will be displayed in that locale
      fallbackLocale: Locale('en', 'US'), // specify the fallback locale in case an invalid locale is selected.
    )
  );
}

class MyApp extends StatefulWidget{
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
          appBar: AppBar(
              title:Text("Language Translation"),
              backgroundColor: Colors.deepOrangeAccent
          ),
          body: Container(
            alignment: Alignment.topCenter,
            padding: EdgeInsets.all(15),
             child: Column(
               children:[
                  
                  Text("hello".tr),
                  Text("going".tr),
                  Text("email".trParams({
                      'name':'John',
                      'email':'[email protected]'
                  })),
                         
                  ElevatedButton(
                    onPressed: (){
                          var locale = Locale('en', 'US');
                          Get.updateLocale(locale);
                          //you can save this language on preference, and get on app start
                    }, child: Text("Translate to English"),
                  ),

                  ElevatedButton(
                    onPressed: (){
                          var locale = Locale('es', 'ES');
                          Get.updateLocale(locale);
                          //you can save this language on preference, and get on app start
                    }, child: Text("Translate to Spanish"),
                  ),

                  ElevatedButton(
                    onPressed: (){
                          var locale = Locale('ru', 'RU');
                          Get.updateLocale(locale);
                          //you can save this language on preference, and get on app start
                    }, child: Text("Translate to Russian"),
                  )  
                  
               ]
             )
          )
      );
  }
}

world_language.dart

import 'package:get/get.dart';

class WorldLanguage extends Translations {
  @override
  Map<String, Map<String, String>> get keys => {

        'en_US': {
          'hello': 'Hello, How are you?',
          'going': 'Where are you going?',
          'email': 'Hello @name, your email is @email'
        },

        'es_ES': {
          'hello': '¿Hola, cómo estás?',
          'going': '¿Adónde vas?',
          'email': 'Hola @name, tu correo electrónico es @email'
        },

        'ru_RU':{
          'hello':'Привет, как дела?',
          'going':'Куда ты направляешься?',
          'email': 'Здравствуйте @name, ваш адрес электронной почты @email',
        }

        //add more language here
      };
}

Output Screenshot:

Default English Language	When Translated to Spanish	When Translated to Russian

In this way, you can add Localization/multi-language translation in Flutter App.