Сенча локализация - PullRequest
Новая
       2

Сенча локализация

0 голосов
/ 06 марта 2012

Мне нужно использовать локализации на sencha 1.1.1

// app-en.js 

Locale = {
title: 'hello'

}

// app-fr.js 

Locale = {
title: 'salut'

}

Моя панель. 

var panel = new Ext.Panel({fullscreen: true, html: 'Text to locate'});

Как определить язык и изменить его?

Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 13 июля 2015

Вы хотите локализовать свои представления, используя переопределения.Взгляните на этот сайт для получения дополнительной информации: http://www.ladysign -apps.com / developer / как локализовать ваши сенсорные приложения / 

Ext.define('MyApp.view.Main', {
    extend: 'Ext.tab.Panel',
    xtype: 'main',
    requires: [
        'Ext.TitleBar',
        'Ext.Video'
    ],
    TAB_ONE_TITLE_SHORT: 'Hello',
    TAB_ONE_TITLE: 'Hello Sencha Touch 2',
    TAB_ONE_HTML: 'This app was written in English.',
    config: {
        tabBarPosition: 'bottom',
    },
    initialize: function() {

        var items = [{
                title: this.TAB_ONE_TITLE_SHORT,
                iconCls: 'home',

                styleHtmlContent: true,
                scrollable: true,

                items: {
                    docked: 'top',
                    xtype: 'titlebar',
                    title: this.TAB_ONE_TITLE
                },

                html: this.TAB_ONE_HTML
            }
        ];

        this.add(items);
        this.callParent();
    }
});

Ипереопределение 

Ext.define('MyApp.utils.nl.Main', {
    override: 'MyApp.view.Main',

    TAB_ONE_TITLE_SHORT: 'Hallo',
    TAB_ONE_TITLE: 'Hallo Sencha Touch 2',
    TAB_ONE_HTML: 'Deze app is geschreven in het Nederlands.',
});

В качестве альтернативы вы также можете включить существующие файлы, используя класс загрузчика фреймворка.Это будет вызвано перед запуском приложения:

Добавьте ваши файлы ресурсов в app.json 

"js": [
    {
      "path": "../touch/sencha-touch.js",
      "x-bootstrap": true
    },
    **{
      "path": "resources/translations/resources_nl.js",
      "remote": true
    },
    {
      "path": "resources/translations/resources_de.js",
      "remote": true
    },
    {
      "path": "resources/translations/resources_en.js",
      "remote": true
    },
    {
      "path": "resources/translations/resources_fr.js",
      "remote": true
    },**
    {
      "path": "app.js",
      "bundle": true,
      "remote": true
      /* Indicates that all class dependencies are concatenated into this file when build */
    }
],

Мои пользователи могут выбирать язык, я сохраняю его в локальном хранилище.Мой запасной вариант - английский.Вот мой app.js, где я использую класс Ext.Loader для загрузки требуемого языкового файла 

/*
 This file is generated and updated by Sencha Cmd. You can edit this file as
 needed for your application, but these edits will have to be merged by
 Sencha Cmd when it performs code generation tasks such as generating new
 models, controllers or views and when running "sencha app upgrade".

 Ideally changes to this file would be limited and most work would be done
 in other places (such as Controllers). If Sencha Cmd cannot merge your
 changes and its generated code, it will produce a "merge conflict" that you
 will need to resolve manually.
 */

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false
});

**Ext.Loader.syncRequire(['resources/translations/*'], function() {
    Resources = Resources[localStorage.getItem('language') || 'EN'].texts;
});**

Ext.application({
    name: 'MyApp',

    requires: [],

    models: [],

    stores: [],

    views: [],

    controllers: [],

    launch: function() {
        ...
    },

    onUpdated: function() {
        Ext.Msg.confirm(
            "Application Update",
            "This application has just successfully been updated to the latest version. Reload now?",
            function(buttonId) {
                if (buttonId === 'yes') {
                    window.location.reload();
                }
            }
        );
    }
});

Вот пример языкового файла (resources / translations / resources_en.js): 

var Resources = Resources || {};

Resources.EN = {
    texts: {
        generic: {
            loading: "Load...",
            online: "Online",
            offline: "Offline",
            login: "Log in",
            logoff: "Log out",
            ...
        },
        list: {
            emptyText: "No elements have been found.",
            ...
        },
        map: {
            noMarkers: "There is no data to display on the map.",
            ...
        },
        settings: {
            scaleSize: "Scale screen?",
            ...
        },
        document: {
            openingDocumentFailed: "Opening document failed. Do you have an application that can open this type of document?",
            ...
        }
    }
}

Плюсы этого решения в том, что теперь вы можете использовать многоязычный текст, декларативный в представлениях: 

Ext.create('Ext.Container', {
    renderTo: Ext.getBody(),
    items   : [
        {
            xtype: 'button',
            text : **Resources.generic.cancel**
        }
    ]
});
0 голосов
/ 07 марта 2012

Загрузите подходящий файл JavaScript в соответствии с локалью.Для лучшей идеи посмотрите этот вопрос или этот вопрос .

Затем просто используйте код следующим образом: 

var panel = new Ext.Panel({
   fullscreen: true, 
   html: Locale.title
});
...