PDA

View Full Version : How to implement Localization in Extjs 6.2 with Sencha architect 4.2



Ganesh020981
13 Jul 2017, 2:58 AM
Hi,

How to implement Localization in Extjs 6.2 with Sencha architect 4.2?

Thanks and Regards,
Ganesh. R

petr.vecera
13 Jul 2017, 7:25 AM
There is no "direct" support for localization inside SA but you should be able to do localization in the same way you do it for normal ExtJS apps https://docs.sencha.com/extjs/6.2.0/guides/core_concepts/localization.html

Ganesh020981
14 Jul 2017, 12:22 AM
There is no "direct" support for localization inside SA but you should be able to do localization in the same way you do it for normal ExtJS apps https://docs.sencha.com/extjs/6.2.0/guides/core_concepts/localization.html


Hi,

Thanks much for your reply..

Now

I am using Extjs 6.2 with Sencha Architect 4.2.1.
I need to use localization in our application.

I have done below code for localization .
Ext.define('Test',{
singleton:true,
insert:'<u>I</u>nsert' });

I need to use use this code in my view file like

requires:['Test.js'],
items:[{
xtype:'button',
text:Text.insert
}]

The above code is working fine in when I have using webapp folder.

But if I write in inside of sencha architect, it will take string in text below code like.

requires:['Test.js'],
items:[{
xtype:'button',
text:'Text.insert'
}]

So it will come in button Text.insert as as string.

so can you please help anyone, how to use variable value in button text using sencha architect.

Thanks and Regards,
Ganesh. R

petr.vecera
14 Jul 2017, 12:33 AM
This is quite problematic. If you are not able to do it using data binding and viewmodel you would have to use some kind of workaround, for example these https://www.youtube.com/watch?v=lLmLD3unWO4

senacle
6 Oct 2017, 5:49 AM
I've searched for long time to localize my app.
Some different post found and i've tested different solutions.
Finally, i did like described here.

Here's screenshot to see how to proceed.

1. Select the object (like a textField) and add a Process Config (click on the +)
57052

2. You will see some change on the object (in this example : me.processLogin)
57053

3. Click on the left_to_right arrow to go to the declaration of the process funtion and add the field for trnalsation (in this example : config.fieldLabel = Localization.login;)
57054

4. Don't forget to declare your translation file. I add a js resource in Sencha Architect
57057

57058

The translation does'nt appear in the Sencha Architect Window.
You need to save and load the app in the browser to see the translation.

You need to compile as many app as locale of your project...
Maybe it's possible to include all locale in the app and add some initialisation in the launch with the locale parameter.
I will try this later.

senacle
9 Oct 2017, 1:42 AM
If you want your translation data coming from server, you can do as described in https://www.sencha.com/blog/internationalization-localization-with-sencha-ext-js.



For the client side

In Sencha Architect, add a js resource for the class declaration :


Ext.define('Localization', {
singleton: true
});


In the launch part of your app, request the translation data before the initial view :


launch: function() {
Ext.Ajax.request({
url: 'path/to//the/file/localization.php',
params: {
locale: 'fr'
},
callback: function (options, success, response) {
var data = Ext.decode(response.responseText, true);
Ext.override(this.Localization, data);
Ext.create('MyApp.view.MyInitialView');
}
});
}



For the server side (in the php way)

The datas must be sent in json format.

One file for each localization, like fr.php

<?php
$lang_array['fr'] = [
"LOGIN" => "IDENTIFIANT"
];
?>

One script to generate the json data : localization.php


<?php
$locale = "fr";//On définit la locale par dafaut à fr
if (isset($_POST['locale']) && $_POST['locale'] != "") {
$locale = $_POST['locale'];
}
include $locale.'.php';
echo json_encode($lang_array[$locale]);
?>

fr.php and localization.php in the same folder.


By proceding like this, no need to compile as many Architect app as languages.
The fr.php, en.php, it.php, etc... can be share with the client code and the serveur code.
Only on file per language to maintain.

:):):)

Hope it can help some of you.

senacle
1 Dec 2017, 6:21 AM
I forgot this.

For the config to localize in your Extjs part, do this kind of declaration:

title: Localization.LOGIN