Thanks for the tutorial, it helps a lot. One improvement: It's necessary to check if locale is not null for the localeResolutionCallback. Otherwise, there will be an error message (The getter 'languageCode' was called on null) if the language is adjusted while the app is open in the background. I would also add a default value if the string is not existing in the json: return _localizedStrings[key] ?? key;
Can you tell me how I check if locale is not null and where exactly I put it in the Code? I tried if (locale == null) { return supportedLocales.first; } as mentioned further down in this thread, but where I put is not correct. My iOS app doesn't crash any more but remains in English, doesn't switch languages...
@@cuenotes5768 It will be beautiful like this: if (supportedLocale.languageCode == locale?.languageCode || supportedLocale.countryCode == locale?.countryCode) { return supportedLocale; } But that's not all. You need to open the Runner.xcodeproj file on this path: your_project/ios/Runner.xcodeproj and add base Localization languages in Project info, Localizations section. This will fix your problem.
Mine is not working... Seems that with this new Flutter update something is no longer working... Error message - The Method ''Translate ' was called on null
thanks for the tutorial it works for me i'll add another useful method is how to get the language: String getLanguage() { return supportedLanguages[supportedLanguages .indexWhere((language) => language.locale == _locale)] .language; }
Thank you for a straight forward and simple to understand video. I feel much more confident in approaching this challenge in my app, even though I don't have any experience with it!
How to translate other strings in other layout its not working in other layouts it only works on the main layout error Error: Not a constant expression. title: Text(AppLocalizations.of(context).translate('title')),
Great tutorial I do have a small issue though. At 7:35 you are talking about checking that the current device locale is supported by the app. localeListResolutionCallback: (locale, supportedLocales) { // Check if the current device locale is supported for (var supportedLocale in supportedLocales) { if (supportedLocale.languageCode == locale.languageCode && supportedLocale.countryCode == locale.countryCode) { return supportedLocale; } } I have an error for locale.languageCode and locale.countryCode The getter 'languageCode' isn't defined for the class 'List'. Try importing the library that defines 'languageCode', correcting the name to the name of an existing getter, or defining a getter or field named 'languageCode' Any thoughts on what I am missing? thanks
Great job on your tutorials. What I find missing in this implementation is possibility to interpolate values in the translations. Perhaps add method that receives an array of values and replaces some placeholders inside the value ( e.g. "this string contains 2 values ${val1}...${val2}...")
Your forgot one major thing: For android it will work (because local callback will call once), but on iOS this will crash with a duplicated GlobalKey in MaterialApp! You have to check if local is gonna be null (because of first call it will!). Try master and stable branches, both got this error now
Of course: just check: if (locale == null) { return supportedLocales.first; } on the second call on iOS it will then automatically skip that step and return configured language on your device.
@@rebarius thanks a lot also can you suggest how can we change the locale dynamically like this github.com/flutter-devs/flutter_localization_demo/raw/master/screens/demo.gif
Hey Reso Coder. Thanks for valuable content. I came across flutter_i18n package, which looks little easy compared to flutter_localizations. Would like to know your opinion. Thanks..
@@antonkuchinsky9974, Hi friend, this is the sollution that worked for me: phrase.com/blog/posts/how-to-internationalize-a-flutter-app/ That one in the video doesn't work for me.
@@yacine101 I found that i called getTranslated for title in MaterialApp before AppLocalizatoin.delegate load) make sure that your delegate loaded at first
@@marcelhh5722 not clear what you mean. Add 2 break points, one on Localization.of, second on your closest value localize. If second called first, there is a mistake.
Hi Matt, I need to have nested json file keys, how can I come over it? if I say AppLocalizations.of(context).translate("key.nestedkey.nestednestedkey"), it will give me null. is it possible with library to do it?
A small helper to write less code in the beginning of each Widget with text: String _t(String k) => AppLocalizations.of(context).translate(k); Then, you can use _t("first_string") instead of AppLocalizations.of(context).translate('first_string'),
how can i use the following structure "login": { "welcome": "Welcome" }, and I call it like login.welcome, but I have this error Failed assertion: line 285 pos 10: 'data! = Null' if i define it like this "login.welcome" in the json if it works
Make Map _jsonMap; a variable of class AppLocalizations. Then override the function translate with this: dynamic translate(String key) { if(key.contains('.')) { List keys = key.split('.'); var tempMap = _jsonMap; for(String k in keys) { if(tempMap.runtimeType == tempMap[k].runtimeType) { tempMap = tempMap[k]; } else { return tempMap[k]; } } } return _localizedStrings[key]; } There might be a more efficient way, but I've just started dart this week.
When would you say is the best point in the App creation process to internationalize your app? After it is finished (I would prefer that) or during development?
i think after it is finished is fine. But you still need to setup your Text widgets to use the en only language, therefore it'll be easier to add more languages later
Hello, somehow it's not working, i don't know why, I did exactly the same methods and I tried twice in two apps, and when I changed the language setting, the app language just not change. Are your method still working considering right now it's 1.5 years later since you upload this video. Thank you!
how can i localize list items , when i have a list of strings for a dropdown? that is my list: List _titles = [' ', 'A', 'B', 'C.']; plese can somebody help'?
@Reso Coder, thanks for these amazing flutter training, I have similar use case of dynamically building widget label from json text and depending on chosen language, i need to render label text for specific language. any suggestion would be appreciated.
Is it really only me who thinks managing and maintaing this JSON files will be a PITA in a larger app? How are you going to add new Strings? Manually adding them to every JSON file???
@@LukePighetti isnt there any solution/plugin? like in android studio when makong native apps in java there is an editor for this as far as i can remember. it was so easy to manage multi language
@@Lensbreak You might find this useful. Localization in a similar style using Google Sheets. github.com/aloisdeniel/flutter_sheet_localization medium.com/@aurimas.deimantas/flutter-localisation-google-sheets-api-python-internalisation-paradise-8439cab57866
@@Lensbreak I personally don't care for a GUI editor because I agree that it's hacky but it sounded like that was a hard requirement for you so I tried to provide a solution for you.
@@ResoCoder lol good, thanks for this tutorial, but I found it very limited, we cannot use nested JSON object, we cannot change the lang dynamically, we cannot pass parameters to translated strings, that is why I have created this repository github.com/loicgeek/flutter_localization_boilerplate , that support all these features an more like saving user preferred language, it doesn't depend on any context, I've read a lot on didierboelens.com blog. It would be nice if you could check that and make a tutorial based on it. My English is very bad so I could not do that. thanks here is a demo app video facebook.com/loicgeek90/videos/2576796032591340/
So, do you realy want to have keys duplicated in multiple json files instead of having single json, containing single instance of every key like this: "key1": "locales": [ "en": "value1", "fr": "value2" ]
I mean, your solution will work perfectly fine too with some minor modifications to the code. Coming from Android, my solution is the closest to the strings.xml file.
If you use a translation service where you send the files to another company for translating, merging the strings back together would be hell. Splitting into multiple files is more comfortable. If you have a thousands of strings, all languages are loaded at the same time. This could also influence performance, if you just need one language.
Thanks for the tutorial, it helps a lot. One improvement:
It's necessary to check if locale is not null for the localeResolutionCallback. Otherwise, there will be an error message (The getter 'languageCode' was called on null) if the language is adjusted while the app is open in the background.
I would also add a default value if the string is not existing in the json: return _localizedStrings[key] ?? key;
Can you tell me how I check if locale is not null and where exactly I put it in the Code? I tried
if (locale == null) {
return supportedLocales.first;
}
as mentioned further down in this thread, but where I put is not correct. My iOS app doesn't crash any more but remains in English, doesn't switch languages...
@@cuenotes5768
It will be beautiful like this:
if (supportedLocale.languageCode == locale?.languageCode ||
supportedLocale.countryCode == locale?.countryCode) {
return supportedLocale;
}
But that's not all. You need to open the Runner.xcodeproj file on this path: your_project/ios/Runner.xcodeproj and add base Localization languages in Project info, Localizations section. This will fix your problem.
if (locale == null) {
locale = Localizations.localeOf(context);
}|
Above code work for me in IOS device!
@@holofox66 && instead of || ?
One of the best flutter tutorials.
very nice video, i wonder about how to switch between two language using button ?
Hi, have you found a good way to do this?
Very useful, great content, I will continue watching yours videos
the timbre of your voice is mesmerising ! :) thanks for explanations about localisation
Mashallah. How flexible and understandable your explanation way is.
This is an awesome channel for all Flutter developers!
your english is very good and clear as this tutorial too.
thanks!
Thanks! it works.. the problem now.. how can i switch language with buttons?
Mine is not working... Seems that with this new Flutter update something is no longer working... Error message - The Method ''Translate ' was called on null
wonderful tutorial and clear instructions. You wouldn't find anywhere else
thanks for the tutorial it works for me
i'll add another useful method is how to get the language:
String getLanguage() {
return supportedLanguages[supportedLanguages
.indexWhere((language) => language.locale == _locale)]
.language;
}
Thank you for a straight forward and simple to understand video. I feel much more confident in approaching this challenge in my app, even though I don't have any experience with it!
Quite useful tutorial. Must thank you with my native languages: спасибо, kiitos, kiitoš.
5:47 yes i am from Mexico and great tutorial!
How to translate other strings in other layout its not working in other layouts it only works on the main layout error Error: Not a constant expression.
title: Text(AppLocalizations.of(context).translate('title')),
That's better than google documentation 😂. Thank you!
Great tutorial
I do have a small issue though. At 7:35 you are talking about checking that the current device locale is supported by the app.
localeListResolutionCallback: (locale, supportedLocales) {
// Check if the current device locale is supported
for (var supportedLocale in supportedLocales) {
if (supportedLocale.languageCode == locale.languageCode &&
supportedLocale.countryCode == locale.countryCode) {
return supportedLocale;
}
}
I have an error for locale.languageCode and locale.countryCode
The getter 'languageCode' isn't defined for the class 'List'.
Try importing the library that defines 'languageCode', correcting the name to the name of an existing getter, or defining a getter or field named 'languageCode'
Any thoughts on what I am missing?
thanks
It's not localeListResolutionCallback, it's localeResolutionCallback
Is there any performance difference with intl package? Memory performance, for example.
Great job on your tutorials. What I find missing in this implementation is possibility to interpolate values in the translations. Perhaps add method that receives an array of values and replaces some placeholders inside the value ( e.g. "this string contains 2 values ${val1}...${val2}...")
what is the name of the vs code theme u using?
What if you were supporting US English and British English? Would you add another key pair and have GB instead of US?
There will be some easy way to load these json file from server and after use it ? Thanks so much
🔒 Get protected by NordVPN with a 75% discount 👇👇
resocoder.com/nordvpn-75off
You can also use the coupon code 👉resocoder👈 during the checkout.
the shouldLoad thing is probably for debugging purposes, so you don't have to do a hot restart, you can hot reload and it's gonna reload all the fonts
Was just wondering how to do this, thank you!!
Love your tutorials
How do you format long sentences paragraphs in json? If it goes across multiple lines?
Hi
great video!
How can I select the language instead of getting the devices's one?
thanks!
Your forgot one major thing: For android it will work (because local callback will call once), but on iOS this will crash with a duplicated GlobalKey in MaterialApp! You have to check if local is gonna be null (because of first call it will!). Try master and stable branches, both got this error now
facing same issue can you specify the fix
Of course: just check:
if (locale == null) {
return supportedLocales.first;
}
on the second call on iOS it will then automatically skip that step and return configured language on your device.
@@rebarius thanks a lot also can you suggest how can we change the locale dynamically like this github.com/flutter-devs/flutter_localization_demo/raw/master/screens/demo.gif
@@rebarius found this useful medium.com/saugo360/managing-locale-in-flutter-7693a9d4d6ac
@@nagaprasannabharadwajsarip1485 of course combine that with shared prefs or secure local storage and it should work
Hey Reso Coder. Thanks for valuable content. I came across flutter_i18n package, which looks little easy compared to flutter_localizations. Would like to know your opinion. Thanks..
The method 'translate' was called on null.
Receiver: null
Tried calling: translate("menu")
any idea about this error ?
Same problem. Localizations.of(context, Localizatoin) returns null? Could someone help?
@@antonkuchinsky9974, Hi friend, this is the sollution that worked for me:
phrase.com/blog/posts/how-to-internationalize-a-flutter-app/
That one in the video doesn't work for me.
@@yacine101 I found that i called getTranslated for title in MaterialApp before AppLocalizatoin.delegate load) make sure that your delegate loaded at first
@@antonkuchinsky9974 how can I accomplish that?
have you found a solution?
Thank you for the tutorial, and I Will follow you only because you mentioned Mexico in your video.🤣
Nice video
I can use this for translating a Text widget. How can I translate a string in a variable?
Just what I needed, thank you
Hello! I have this issue Localizations.of(context, Localizatoin) returns null. Could you help me with this?
have you found out a solution for this?
@@luthiers5488 yes, make shure that Localizations.of initializes before you try localize values
@@antonkuchinsky9974 and how?
@@marcelhh5722 not clear what you mean. Add 2 break points, one on Localization.of, second on your closest value localize. If second called first, there is a mistake.
AWESOME content! Thanks
is it possible to have dynamic string in the json files, thanks!
Hi is this help for web app?
Thanks for the clean explanation
also how can we change the language dynamically
Did you find a solution?
@@themindstorm9947you could found a better way to manage app localization in my comment above
I hope this link could be useful th-cam.com/video/AS-0SXT2qio/w-d-xo.html
Thank you for the tutorial, can you kindly extend it and add how to change the app language dynamically in app, thanks.
www.didierboelens.com/2018/04/internationalization---make-an-flutter-application-multi-lingual/
Great tutorial can you make one for search sort filter with flutter both on client and Firestore query
Great video! I love it
why didn't you say anything about dynamic language situations with button? When you shared this video.
Hello, how do I get the language to change automatically when user changes language while app is running without having to rerun.
Ty jsi ze Slovenska? WOW :D
Keep it up man
Thank you very much this is very helpful. One question: how can I allow users to change language from the app itself?
Did you find a way to do that?
I'm also trying..... not found yet!
Hi Matt,
I need to have nested json file keys, how can I come over it? if I say AppLocalizations.of(context).translate("key.nestedkey.nestednestedkey"), it will give me null. is it possible with library to do it?
A small helper to write less code in the beginning of each Widget with text:
String _t(String k) => AppLocalizations.of(context).translate(k);
Then, you can use
_t("first_string")
instead of
AppLocalizations.of(context).translate('first_string'),
Bruuh! that was awesome
how can i use the following structure
"login": {
"welcome": "Welcome"
},
and I call it like login.welcome, but I have this error
Failed assertion: line 285 pos 10: 'data! = Null'
if i define it like this "login.welcome" in the json if it works
Make Map _jsonMap; a variable of class AppLocalizations.
Then override the function translate with this:
dynamic translate(String key) {
if(key.contains('.')) {
List keys = key.split('.');
var tempMap = _jsonMap;
for(String k in keys) {
if(tempMap.runtimeType == tempMap[k].runtimeType) {
tempMap = tempMap[k];
} else {
return tempMap[k];
}
}
}
return _localizedStrings[key];
}
There might be a more efficient way, but I've just started dart this week.
How to change the language manually from the app itself?
I looking for the same
I am getting this error:
The method 'translate' was called on null.
Receiver: null
Tried calling: translate("menu")
Ant idea what the problem is ?
static String traslate(BuildContext context, String key) {
final keyTraslate = AppLocalizations.of(context).translate(key);
return (keyTraslate == null) ? key : keyTraslate;
}
did you found a solution for that error ? i have the same error
have you found out a solution?
To solve:
String translate(String key) {
if (translations!=null) return translations[key];
}
ani som nedopozeral video a uz som dal like :)
Správny Slovák sa hneď pozná 😄
The localizations package automatically checks if the locale is supported, so there is no need to implement the logic for that! 🙌🏻
When would you say is the best point in the App creation process to internationalize your app? After it is finished (I would prefer that) or during development?
i think after it is finished is fine. But you still need to setup your Text widgets to use the en only language, therefore it'll be easier to add more languages later
Moses Karunia ok thanks
Thanks for sharing this!!
Thank you so much its working very smoothly.
Hello, somehow it's not working, i don't know why, I did exactly the same methods and I tried twice in two apps, and when I changed the language setting, the app language just not change. Are your method still working considering right now it's 1.5 years later since you upload this video. Thank you!
Can we use yaml instead of json?
Isn't there any way to translate the whole app or do I need to write everything in multiple languages?
Thank you so much
, Each one has been explained
, Very very wonderful explanation.
What if the user just wanted to change the app language instead of device language?
why this error: Easy localization Formatexception: syntaxerror unexpected token < in JSON (at character 0)
how can i localize list items , when i have a list of strings for a dropdown?
that is my list:
List _titles = [' ', 'A', 'B', 'C.'];
plese can somebody help'?
Very good tutorial, thanks!
After this tutorial i have only a white screen on my app?
Very nice! Any chance JSON can be loaded at runtime instead of pre-packaged in app?
@Reso Coder, thanks for these amazing flutter training, I have similar use case of dynamically building widget label from json text and depending on chosen language, i need to render label text for specific language. any suggestion would be appreciated.
In android I got black screen after splash screen. I think because It wait to load string from file. Can you fix this?
Hello, Please help me, I am trying to detect whether device screen is
locked or not, how can I listen when user lock his device using hardware
key ?
Is it really only me who thinks managing and maintaing this JSON files will be a PITA in a larger app? How are you going to add new Strings? Manually adding them to every JSON file???
That's exactly what you do and it really sucks. Localization is NOT easy.
@@LukePighetti isnt there any solution/plugin? like in android studio when makong native apps in java there is an editor for this as far as i can remember. it was so easy to manage multi language
@@Lensbreak You might find this useful. Localization in a similar style using Google Sheets. github.com/aloisdeniel/flutter_sheet_localization medium.com/@aurimas.deimantas/flutter-localisation-google-sheets-api-python-internalisation-paradise-8439cab57866
@@LukePighetti thank you so much. quite nice, still seems a bit hacky to me but definitely an interesting approach to learn from
@@Lensbreak I personally don't care for a GUI editor because I agree that it's hacky but it sounded like that was a hard requirement for you so I tried to provide a solution for you.
Any reason for not just including the lang folder without having to include each individual file?
Like
assets:
- lang/
Oh, I didn't know something like this was possible 😑 Thanks!
definetly! That's enough! I don't know why all flutter devs online recommend that static config 😑
@@ResoCoder really ?
@@loicngou9592 Now I know, lol
@@ResoCoder lol good, thanks for this tutorial, but I found it very limited, we cannot use nested JSON object, we cannot change the lang dynamically, we cannot pass parameters to translated strings, that is why I have created this repository github.com/loicgeek/flutter_localization_boilerplate , that support all these features an more like saving user preferred language, it doesn't depend on any context, I've read a lot on didierboelens.com blog. It would be nice if you could check that and make a tutorial based on it. My English is very bad so I could not do that. thanks
here is a demo app video facebook.com/loicgeek90/videos/2576796032591340/
thanks ,you are great really working video
how to translate data inside listView builder can someone help..?
Mixed Text (RTL and LTR) breaks the RTL justification flutter Is there a solution to this problem.
thank you for this. Helped allot in my projects (y)
Extremely thank you!
Could you make a video on Provider please and thanks :)
Something like this th-cam.com/video/kDEflMYTFlk/w-d-xo.html ? It shows the complete architecture for state management using provider.
Same everywhere. How to handle the placeholder nobody says!
who saving it as json if can also be directly coded into a dart file?
Thank you
thanks for your effort brother , but it didn't work with me , I did all exactly like you , but with Arabic language , ['ar' , 'AR'] , please help
Gracias por el tutorial
Small request from our side : can you please make a video on amplitude integration to flutter app ????? Please it would help😀
The method 'translate' was called on null.
Receiver: null
Tried calling: translate("email_string")
how to fix this? need help asap
have you found a solution for this?
To solve:
String translate(String key) {
if (translations!=null) return translations[key];
}
Thanks for the tutorial, but it's not working on IOS
This doesn't work at all with null safety
Does not Work on ios
I found a way easier approach, but it took me really long to find it
@@YouWatchGames drop a link
@@edgedevstudio1826 on pub dev flutter i18n plugin make sure to add all languages on xcode
@@YouWatchGames why can't you freaking drop a link
@@edgedevstudio1826 relax pub.dev/packages/flutter_i18n
How to supprt "Arabic" language?
Obrigado!!!
Thank you (y)
How i can get the source code for this?
It's in the written tutorial.
Thanks
it work
so much boilerplate code here for this feature!
it's good
but if we have ac big app it will not be usefull
So, do you realy want to have keys duplicated in multiple json files instead of having single json, containing single instance of every key like this:
"key1": "locales":
[ "en": "value1",
"fr": "value2"
]
I mean, your solution will work perfectly fine too with some minor modifications to the code.
Coming from Android, my solution is the closest to the strings.xml
file.
If you use a translation service where you send the files to another company for translating, merging the strings back together would be hell. Splitting into multiple files is more comfortable. If you have a thousands of strings, all languages are loaded at the same time. This could also influence performance, if you just need one language.