Sencha Ext JS 国际化和本地化.docVIP

Sencha Ext JS 国际化和本地化 Ext JS 提供”开箱即用”的国际化功能,并且很容易扩展.Ext JS 打包了超过40种本地化语言包,从印尼语到马其顿语,都很容易实现. 在本文中,我们将提供一些特殊情况和需求的解决方案,在这之前我们先看看所谓的国际化是个什么功能. 主要重点是应用程序要提供给用户选择语言的设置.这就要求应用程序是”可翻译”的,这样的功能常被称作”i18n”(internationalization单词取首尾,中间18个字母)或者”国际化”.”可翻译”的意思不仅仅是将一个语言转换为另一个语言,还要考虑到与之关联的其他技术要求. Sencha 为大多数情况下提供了良好的国际化和本地化解决方案,考虑到企业环境下的一些特殊需求,它也是可以扩展的. 怎样本地化Ext JS应用程序 你可以从Sencha推荐的官方文档找到详细方法本地化你的应用程序.也有一些其他的推荐方法在社区成员Saki发的博客里.接下来,我们将要提到: * 怎样直接在应用程序里写语言文件(通过singleton或override),这样它们就可以直接集成到产品构建中 * 怎样生成,通过Sencha Cmd在相同应用程序中配置不同语言进行产品构建 * 怎样每次改变语言后重新加载整个应用程序 * 怎样启动应用程序之前轻松加载额外资源 * 怎样在应用程序的不同部分使用不同的语言 需求来源 企业开发者和普通开发者是不一样的,因为他们有特殊的需求.当企业开发者选一个框架用时,他们要仔细小心的评估他们的用户需求. 具有一定规模的公司普遍得出同样的结论:跨开发框架的多语言管理是个麻烦事.适用于大型组织的多语言被关注,因为他们的商业进程在产品开发和企业发展的不同阶段需要不同语言.在某些情况下，语言要求定期更换,翻译的工作需要在应用外进行,大多是由第三方软件管理,并通过一个或多个Web服务加载到应用程序里. 这种方法的优点是: * 改变语言不需要开发者重新构建应用-改变后立即生效. * 翻译的工作不必由那个写代码的人来做. 可以这么认为,委托翻译的人由于不知道谁写的代码或者如何在JavaScript文件里编码而造成一些问题.可是,完全可以想到使用翻译层翻译内容,一个可以由非程序员使用，并且将数据加载到应用程序里. 我们将描述我们的方法,它原生的实现了一个翻译层.项目一开始就使用良好的方法构建国际化到应用程序里是很重要的,可以避免痛苦的重构阶段. 优雅的方法 首先,我们要深刻理解Sencha localization guide和Saki博客里的那篇文章:应用程序主屏构建之前加载语言数据. 这个方案适用于Ext JS 5之前的所有版本: 在应用程序的”index.html”文件里加入依赖到特殊的资源. 为了实现这个,我们先要用一个”单例”的类来存储翻译变量,像这样: Ext.define(Jnesis.Labels, { singleton: true, button: My english button, title: My english title }); 这样,应用程序的任何地方都能访问译文了,怎样访问呢?就像打字一样简单:Jnesis.Labels.button 或 Jnesis.Labels.title 这样做比”重写”类的方法优点在于本地化的值在一个文件里且容易使用,因为像上面看到的那样,每个元素是一个变量. 一旦做到这一点,我们选择其他语言后只需要”重写”覆盖这个语言文件.有两个步骤: 1. 从web服务加载数据,服务器响应回的JSON看起来像这样: { button: Mon Bouton, title: Mon titre } 我们需要解析数据并用解析到的值覆盖我们默认的本地化单例类: Ext.define (Jnesis.Application, { launch: function () { Ext.Ajax.request({ url: get-localization, params:{locale:fr}, callback: function (options, success, response) { var data = Ext.decode(response.responseText, true); Ext.override(Jnesis.Labels, data); Ext.create(Jnesis.view.main.Main); } })