Sharing localization files between multiple packages in Flutter

When you develop a large application, you willy-nilly split it into packages, but if you use a standard mechanism that Flutter developers suggest in the official documentationthere is no direct way to share localization files between projects.

There is an option to re-configure flutter_localizations in a new package and fill out new translations there and transfer old ones. But it's difficult and it doesn't seem right.

Then I propose the second option. Share transfers from one package to another. In this article I will tell you how to do this.

Idea

Plastic bag flutter_localizations by default generates files in a folder /.dart_tool/flutter_gen/gen_l10nbut this directory cannot be shared with other packages.
Our task is to create a localization package and use the export file to export the file app_localizations.dart from /.dart_tool/flutter_gen/gen_l10n/so that it can be used by other packages, including our main one.

Implementation

I'll create a package called sputnik_localization and add plugins there intl And app_localizations:

flutter pub add flutter_localizations --sdk=flutter
flutter pub add intl:any

In the project:

MaterialApp(  
  ... 
  localizationsDelegates: const [  
    AppLocalizations.delegate,  
    GlobalMaterialLocalizations.delegate,  
    GlobalWidgetsLocalizations.delegate,  
    GlobalCupertinoLocalizations.delegate,  
  ],  
  supportedLocales: const [  
    Locale('en'),
  ],  
  ...
)

Then I will create a folder lib/l10n/generated. In a folder lib/l10n I’ll create the localization file itself app_en.arb. I will fill it with information:

{  
  "helloWorld": "Hello World!",
  "@helloWorld": {
      "description": "The conventional newborn programmer greeting"  
  }, 
  "alreadyHaveAccount": "Already have account?",  
  "signIn": "Sign in",  
  "signUp": "Sign up",  
  "invalidEmail": "Incorrect e-mail format",  
  "invalidPassword": "The password must contain no less than 6 and no more than 64 characters",  
  "passwordDontMatch": "The passwords don't match",  
  "unknownSignUpError": "Unknown error when creating an account", 
  "unknownSignInError": "Unknown error when logging in to the account"
}

Next you need to create a file in the root of the project l10n.yaml with the following content:

arb-dir: lib/l10n  
template-arb-file: app_en.arb  
output-localization-file: app_localizations.dart  
output-dir: lib/l10n/generated  
synthetic-package: false  
nullable-getter: false

arb-dir – location of localization files (in our case app_en.arb)
template-arb-file – main arb file
output-localization-file – the file where the localization will be generated
output-dir – the folder where the generation will go.
synthetic-package – a flag that is responsible for selecting the default localization directory (if false, then the value will be taken from arb-dir)
nullable-getter – allows you not to check for null the translation value every time you use it, for example, if the value is true – AppLocalizations.of(context).alreadyHaveAccount ?? "Значение если перевода нет".

Next we go to the export file, in my case it is called lib/sputnik_localization.dartin your case it is lib/<название_пакета>.dart. There I have the following code:

library sputnik_localization;  
  
export 'package:flutter_localizations/flutter_localizations.dart'; // пакет
export 'l10n/generated/app_localizations.dart'; // переводы
export 'src/utils.dart'; // мои дополнительные приколюхи

All! Now you can use it in your project:

IN pubspec.yaml connect:

sputnik_localization:  
  path: packages/sputnik_localization

In the project:

import 'package:sputnik_localization/sputnik_localization.dart';

...

AppLocalizations.of(context).helloWorld

Ready!

Addition

To make it easier to use the localization plugin, you can write an addition to the localization package, like my file utils.dart.

import 'package:flutter/material.dart';  
import 'package:sputnik_localization/l10n/generated/app_localizations.dart';  
  
extension BuildContextLocalizationEx on BuildContext {  
  AppLocalizations get tr =>; AppLocalizations.of(this);  
}

Conclusion

This way you can split your project into many packages and not lose localization files or worry about synchronizing several files. Use it for your health!

Have a good mood and kindness <3!

Similar Posts

Leave a Reply

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