Cocos Creator之游戏多语言转换

如果你的游戏需要推广到海外,游戏语言是中文那肯定是不行的。必须转换为相对应的语言,比如说你在欧美推广,那你就需要转换为英文,所以游戏中必须有切换语言的选项,相信大家玩过大部分大型的游戏都是有这个选项的,这里主要介绍英文的转换,其他语言也是一样的。不懂得或者有其他问题的可以加qq讨论群:706176551。

1.我们需要去下载i18n转换语言的插件

用Creator创建一个空白项目

打开->扩展->扩展商店
image.png
点击creator插件
image.png

然后找到我们所需要的插件,点击他,里面会有下载按钮,点击下载
image.png
image.png
下载完成后这里有安装按钮点击它
image.png
它会弹出对话框,询问你是安装到全局目录还是项目目录,“全局目录”指的是安装在你的系统,之后你所有的项目都可以用到,“项目目录”指可用于单个项目。我这里安装到项目目录。安装完成后你会发现控制台会显示绿色的一行字,来提示你安装成功。打开->扩展->你会发现多了i18n这个选项,如果没有你可以关闭项目重新打开。
image.png
我们的资源管理器也会多出一些文件
image.png

2.创建自己需要的语言文件

打开->扩展->i18n,它会弹出一个界面
image.png

现在这个界面什么都没有,需要我们创建。在这里我点击“+”创建“zh”和“en”这两种语言,也就是中文和英文。
image.png
它会标明语言文件所在的路径。
image.png

3.编辑语言文件的内容

双击打开zh.js脚本,我们为脚本增加一些内容


image.png

再打开en.js脚本,进行同样的操作,只不过是把对应的内容翻译成英文。
image.png

4.搭建一个简单的界面来测试

界面如下,分别是单选框toggle组件和lable组件


image.png

并且为文本组件添加一个“LocalizedLabel ”的组件,这个组件只有安装i18n插件才会有的。
image.png
并在组件的DataID写上我们创建好语言的ID,例如:label_text.hello
image.png
也为中文和英文两个lable下的LocalizedLabel DataID写上中文和英文的key值,界面现在是这样子的
image.png

5.语言的初始化和切换

创建一个i18n的TypeScript脚本,挂载在Canvas下,
image.png

写了两个点击toggle触发的事件,并为场景的toggle绑定相应的事件。接下来是测试成果。刚开始界面是这样的
image.png
运行后是这样的
image.png
它会默认是中文,我们点击切换英文看看有什么变化呢?咦!真的变了呢!
image.png

下面贴上涉及到的完整代码

zh.js

'use strict';

if (!window.i18n) {
    window.i18n = {};
}

if (!window.i18n.languages) {
    window.i18n.languages = {};
}

window.i18n.languages['zh'] = {
    // write your key value pairs here
    "label_text": {
        "hello": "你好!",
        "bye": "再见!",
        "zh":"中文:",
        "en":"英文:"
    }
};

en.js

'use strict';

if (!window.i18n) {
    window.i18n = {};
}

if (!window.i18n.languages) {
    window.i18n.languages = {};
}

window.i18n.languages['en'] = {
    // write your key value pairs here
    "label_text": {
        "hello": "Hello",
        "bye": "Bye",
        "zh":"Chinese:",
        "en":"English:"
    }
};

i18n.ts


import _i18n = require("LanguageData");
const {ccclass, property} = cc._decorator;

@ccclass
export default class i18n extends cc.Component {
    

    onLoad () {
        _i18n.init("zh");   //初始化中文,参数是我们创建语言的名字
    }

    start () {

    }

    update (dt) {
        //如果切换了语言,会刷新文字
        _i18n.updateSceneRenderers();
    }

    //切换中文
    OnZHToggleClick(e){
        if (e.isChecked) {
            _i18n.init("zh")
        }
    }

    //切换英文
    OnENToggleClick(e){
        if (e.isChecked) {
            _i18n.init("en")
        }
    }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,262评论 4 61
  • 《裕语言》速成开发手册3.0 官方用户交流:iApp开发交流(1) 239547050iApp开发交流(2) 10...
    叶染柒丶阅读 27,926评论 5 19
  • 最近一个姐姐跟我们吐槽说:我年纪大了,如果只是谈谈恋爱吃吃饭,不想结婚,我真的没时间精力应付,所以我都会直接问他们...
    ceiba沐清阅读 341评论 2 2
  • 如果你有出没在酒场,这些小知识与技巧是你必须要学会的,他会影响你的一生! 酒桌礼仪 1.酒桌上虽然“感情深,一口闷...
    小林故事会阅读 541评论 0 4
  • 桃樱花 小小花朵簇拥在一起,仿佛在说着什么悄悄话。那花瓣是白色的,但又不同于梨花的白,好像这白色里面还夹着其他的颜...
    广电1702B徐璐阅读 202评论 0 0