电点国际化翻译系统,助力你开启海外项目之旅

发布于:2022-10-16 ⋅ 阅读:(897) ⋅ 点赞:(0)

1、前言

项目要走向国外市场,移动端Android和iOS,当然也包括后端和前端,需要进行国际化适配,但是之前的项目中是没有英文翻译文件的,所以需要将项目中所有的中文字符串进行收集交给专业的人士进行翻译,然后将翻译的英文内容分别整理到Android和iOS项目中去。

无疑这是一个很繁琐且很容易出错的事情,而且后续在开发的过程中还会新增中文字符串,这个时候我们又需要重新走一遍上面的流程,哪怕只是新增了一个字符串!于是我们需要一个系统去专门处理这件事件,将功能开发和英文翻译这两件事分离开来,让专业的人士去做专业的事情,所以这个翻译系统出现了。

2、翻译系统

2.1 流程图

翻译系统流程图.jpeg

3、使用手册

3.1 创建测试项目

首先,我当你是一个Android开发者,我们首先创建一个空项目,然后在项目中新增若干个module,模拟真实项目中的多module环境,在每个module中添加strings.xml文件,在这个文件中定义几个字符串,如图所示。

image-20220210100803436.png

3.2 下载翻译同步助手及使用说明

你先访问 http://translate.cretinzp.com/ 首次登录没有账号需要注册一个账号,而且你要自己记住这个账号密码,方便后面继续登录。

成功进入系统之后,访问 http://translate.cretinzp.com/#/translate/tools 下载最新版本的翻译同步助手。如果你本机没有java环境,你还需要在此页面下载你当前系统对应的jdk,并一路下一步安装。安装成功之后,打开刚刚下载的翻译同步助手,你将看到如下页面:

image-20220209161928914.png

  • A、如果你是Android开发者,那你点击选择本地项目地址按钮,选择你需要国际化项目的项目根目录就好了,选择完之后控制台会输出你选择的地址,请一定关注一下你选择的地址是否正确;如果你是iOS开发者,那你点击选择本地项目地址按钮,选择项目中的zh-Hans.lproj文件夹,注意一定要选择到这个文件夹,同样的关注一下控制台输出的地址是否以zh-Hans.lproj结尾。

  • B、如果你是Android项目就选择Android,反之选择iOS

  • C、工具需要校验身份,访问 http://translate.cretinzp.com/#/console 页面右上角点击你的用户名,在下拉框中选择获取token,复制对话框中的token值粘贴到这里才可正常使用功能。

image-20220209162513167.png

  • D、如果你本地有新增的字符串未上传到云端,那么你需要进行此操作。先点击预加载本地数据,此操作会收集当前项目中的所有字符串信息到内存中,控制台会输出收集到的字符串条数,如果出现条数为0,有可能你的项目地址选择不对,也有可能你的系统版本比较高,没有给到访问资源的权限,遇到这种情况请自行google解决办法。如果控制台中输出的条数是正常的,再点击上传本地数据到云端,查看控制台输出,成功之后可以访问后台查看你上传的数据。

  • E、如果翻译员在后台进行了翻译,你需要将翻译后的英文同步到本地,那么你需要进行此操作。先点击远程下载数据到本地,这个过程会请求后台接口拉取所有以及翻译好的英文数据到本地内存,控制台会输出云端已经翻译好的数据条数,再点击合并远程数据到本地,此时,工具会自动根据本地的中文字符串对应生成翻译好的英文文件。针对Android会生成 values-en/strings.xml 文件,针对iOS会生成en.lproj/Localizable.strings 文件,实现项目国际化。

3.3 上传本地翻译

先按照3.2中的说明选择项目,然后填入token,然后点击预加载本地数据,看控制台中的输入为收集到11条数据,app中有一条,其他5个module中各有2条,一共11条,合理,然后点击上传本地数据到云端,查看控制台输出成功。如图

image-20220210101631931.png

上传成功之后点击访问翻译后台按钮,查看后台是否有数据,如图所示

image-20220210101806624.png

3.4 对内容进行翻译

针对每一条数据,你可以直接在英文内容输入框中输入翻译后的内容,也可以点击右边智能翻译按钮进行翻译,智能翻译采用我正在维护的RollToolsApi中的一个翻译接口,详情请查看 https://www.mxnzp.com/doc/detail?id=21 ,当你认为翻译已经合理不希望别人再改动时,可点击右边的确认翻译按钮,告知别人这条翻译是已经确认过的。

翻译之后的效果如下:

image-20220210102516290.png

另外,点击右边的修改记录可以查看当前数据的所有修改记录。

3.5 同步翻译到本地

等翻译人员翻译完成之后,我们需要同步远程翻译到本地。同步翻译的操作依然在翻译同步助手上进行。点击工具上的远程下载数据到本地按钮,将远程翻译数据拉取到内存中,控制台输出拉取远程数据11条,然后点击合并远程数据到本地按钮,生成本地的英文翻译文件,看控制台输出:

image-20220210110547295.png

控制台输出合并完成,我们打开我们的项目,查看是否生成了英文翻译文件。

image-20220210111440180.png

可以看到英文翻译已经拉下来了。

3.6 看实际效果

我在首页上显示了这11条中文字符串,左边是中文的效果,右边的是切换成英文环境的效果。

image-20220210134730981.png

衷心希望你能一步一步的走完整个流程~~

4、后期展望

我是觉得技术是用来服务自己的,所以在遇到一些问题的时候希望能够通过代码解决一些实际问题,于是才花时间去研究这个东西。对于同是移动端开发的你,不知道有没有遇到过这个问题。如果你觉得有点意思,并且希望能添加一些东西,我希望你能跟我掰头掰头~

待办

  • 国际化显然不仅仅是移动端的事情,还包括后台和前端,后面我希望也能把他们包含进去。
  • 还有就是对多语言的支持,目前仅支持中文和英文,后续需要支持其他语言

如果你在使用过程中遇到什么问题,请及时联系我们,聪明的你一定可以找到我们的联系方式~

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到