localize_and_translate 2.0.9
localize_and_translate: ^2.0.9 copied to clipboard
Flutter Localization In Human Way, Help with localizing your app
localize_and_translate #
Flutter Localization In Human Way
Screenshots #
Video Tutorial #
- Arabic : nfDYussovfQ
Methods #
Method | Job |
---|---|
init() |
initialize things, before runApp() |
translate('word') |
word translation |
googleTranslate('word', from: 'en', to: 'ar') |
google translate |
setNewLanguage(context,newLanguage:'en',restart: true, remember: true,) |
change language |
isDirectionRTL() |
is Direction RTL check |
currentLanguage |
active language code |
locale |
active Locale |
locals() |
locales list |
How To Use #
- add
localize_and_translate: <latest>
as dependency inpubspec.yaml
- run
flutter pub get
into app folder - add
.json
translation files as assets
- For example :
'assets/langs/ar.json'
|'assets/langs/en.json'
- structure should look like
{
"appTitle" : "Example",
"buttonTitle": "العربية",
"textArea" : "Thisi is just a test text",
}
{
"appTitle" : "تجربة",
"buttonTitle": "English",
"textArea" : "هذا مجرد نموذج للتأكد من اداء الاداة",
}
- define them as assets in pubspec.yaml
flutter:
assets:
- assets/langs/en.json
- assets/langs/ar.json
- run
flutter pub get
- add imports to main.dart
import 'package:flutter/material.dart';
import 'package:localize_and_translate/localize_and_translate.dart';
- wrap app entry into
LocalizedApp()
** make sure you define it's child into different place "NOT INSIDE" ** - convert your
main()
method to async, we will need next - add
WidgetsFlutterBinding.ensureInitialized();
at very first ofmain()
- inside
main()
define: Languages + Root dir, then callawait translator.init();
- so now your
main()
should look like this
main() async {
// if your flutter > 1.7.8 : ensure flutter activated
WidgetsFlutterBinding.ensureInitialized();
LIST_OF_LANGS = ['ar', 'en']; // define languages
LANGS_DIR = 'assets/langs/'; // define directory
await translator.init(); // intialize
runApp(
LocalizedApp(
child: MyApp(),
),
);
}
- define your
LocalizedApp()
child asMaterialApp()
like this
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Home(), // re Route
localizationsDelegates: translator.delegates, // Android + iOS Delegates
locale: translator.locale, // active locale
supportedLocales: translator.locals(), // locals list
);
}
}
- Enjoy
- we use
translate("appTitle")
- we use
googleTranslate("test", from: 'en', to: 'ar')
setNewLanguage("en")
: and it's parameters
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
String testText =
translator.currentLanguage == 'ar' ? 'جار الترجمة' : 'Translating..';
@override
void initState() {
super.initState();
Future.delayed(Duration.zero, () async {
testText = await translator.googleTranslate(
testText,
from: 'en',
to: translator.currentLanguage,
);
setState(() {});
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
drawer: Drawer(),
appBar: AppBar(
title: Text(translator.translate('appTitle')),
// centerTitle: true,
),
body: Container(
width: double.infinity,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
SizedBox(height: 50),
Text(
translator.translate('textArea'),
textAlign: TextAlign.center,
style: TextStyle(fontSize: 35),
),
Text(
testText,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 35),
),
OutlineButton(
onPressed: () {
translator.setNewLanguage(
context,
newLanguage: translator.currentLanguage == 'ar' ? 'en' : 'ar',
remember: true,
restart: true,
);
},
child: Text(translator.translate('buttonTitle')),
),
],
),
),
);
}
}
Complete Example #
Known Issues #
- Not working with flutter version < 1.12.13