Sloppy's Blog

Cocos2d-x生成JS绑定

Posted on

cocos2d-x 的JS及Lua的绑定还是比较简单的。而且官方也提供了文档，以下是lua的Lua绑定官方教程：
@查看Lua教程当然JS跟LUA是差不多的。下面我们需要在绑定之前做点准备：（我是基于Cocos2d-x 3.11.1,windows 10 64位）

准备工作

  • 下载cocos2d-x 3.11.1
  • 下载apache-ant,android-sdk,android-ndk
  • 下载python 2.7.3，Cheetah-2.4.4，PyYAML-3.11.win32-py2.7，（这里虽然我是64位操作系统，但是我用的是还是Python32位，建议朋友们也用这个版本，不然会出现奇怪的问题）
  • 运行cocos2d目录下的setup.py，设置对应的androidsdk，ndk，ant相关的root目录，设置d:\cocos2d-x-3.11.1\tools\cocos2d-console\bin Path环境变更，当然这一步可以不做，
  • 安装python，设置环境变量path:c:\Python27
  • 创建js项目，启动cmd命令行，运行命令：{cocos new -l js -d c:\cocos HelloJsGame} ,不包括大括号，创建后，HelloJsGame\frameworks\cocos2d-x\tools目录下没有bindings-generator这个目录，可以自己从cocos2d-x 3.11.1的源目录copy过来。

编写代码

打开HelloJsGame.sln，文件，新建一个类文件ErayUIHelper.h,ErayUIHelper.cpp,添加一个简单的方法：

Header file:
static void log(const std::string& value);

cpp File:
void ErayUIHelper::log(const std::string& value) {
    CCLOG("ErayUIHelper::log:%s",value.c_str());
}

开始生成绑定

  • 打开项目目录：\frameworks\cocos2d-x\tools\tojs，随便找其中一个ini文件，自己改名，我这里改成coolexp.ini,具体内容可以参考这些ini自己写，我的在这里下载@下载ini文件,这里我加了一个script_path的字段，内容是：custom/scripting/auto/，我是为了让生成的文件自动放到我的项目目录下，不然放在cocos2d-x/cocos的scripting目录下，不好管理，

  • 修改genbindings文件，添加一个变量，在原来的project_root变量下面一行，可以自己搜索，内容是：
    frameworks_root = os.path.abspath(os.path.join(os.path.dirname(file), ‘..’, ‘..’,’..’))

  • 同样修改上面的py文件，添加内容：config.set(‘DEFAULT’, ‘framework_dir’, frameworks_root)

  • 修改genbindings.py里的custom_cmd_args为：custom_cmd_args = {‘coolexp.ini’: (‘coolexp’, ‘jsb_coolexp_auto’),}

  • 修改项目下面的：frameworks\cocos2d-x\tools\bindings-generator\generator.py,在main函数里添加如下代码获取自定义目录：

      # add custom path
  scriptPath = "scripting/js-bindings/auto/"
  try:
      scriptPath = config.get(s, 'script_path')
  except:
      print "parse cocos-ini"

  • 在gen_opts对象里添加一键值：script_path’: scriptPath，在Generator构造函数里添加：
    self.script_path= opts[‘script_path’]

  • 修改项目目录frameworks\cocos2d-x\tools\bindings-generator\targets\spidermonkey\templates\layout_head.c第一行为：
    #include “${script_path}${out_file}.hpp”

  • 生成绑定，运行命令：genbindings.py，过一会会看见success相关的字样

修改项目

  • CPP部分:在项目里，添加，custom/scripting/auto/jsb_coolexp_auto.hpp,cpp文件，修改AppDelegate.cpp文件，在sc->start()，前添加代码：sc->addRegisterCallback(register_all_coolexp);，当前要include “custom/scripting/auto/jsb_coolexp_auto.hpp”
  • JS部分：直接在ctor构造函数里添加：ErayUIHelper.log(“from JS”);，运行项目，是不是在控制台输出了“ErayUIHelper::log:from JS”

好了，上面是演示JS调用C++,下面作为简单调用

c++调用JS

这里演示一个最快速的方法，我们在app.js文件里添加全局函数：


    function callfromcpp(a,b){
        cc.log(“callfromcpp:%d,%d”,a,b);
    }

然后修改ErayUIHelper.log方法：


    添加头文件：#include “scripting/js-bindings/manual/ScriptingCore.h”
    void ErayUIHelper::log(const std::string& value, cocos2d::Node* parent) {
        CCLOG(“ErayUIHelper::%s”,value.c_str());
        ScriptingCore::getInstance()->evalString(“callfromcpp(2,3)”);
    }

运行，是不是在控制台输出：callfromcpp 2,3
最后的项目结构图：HelloJSGame

对应的文件参考下载@下载参考文件