2021-05-07

CocosCreator JSB学习：JavaScript/TypeScript调用C++函数（下篇）

第二部分:绑定

首先下载好creator并安装好，我这边下载的是2.4.5版本（这个没啥要求的，尽量用较新的稳定版本吧），然后在设置里面配置好原生环境，NDK,SDK那些路径记得配下；打开creator，新建一个名为JsbTest的helloworld项目，然后构建（一定要勾选调试模式，一定要勾选调试模式，一定要勾选调试模式!!!）    重要的部分来了，后来的同学赶紧做好，睡觉的同学该醒醒了，来，都注意听啦（敲黑板啦，敲黑板...）

1：新建一个Demo空项目，然后选择Android平台构建，构建成功之后，项目根目录中就会出现build文件夹，如下图所示：

2：用VS2017打开win32工程，并在Classes目录下新建JsbTest.h和JsbTest.cpp文件，如下图所示：

3：编写C++代码,选择需要绑定的c++文件（包括头文件和源文件），这里我新建一个头文件和cpp文件，这里c++文件的作用就是在控制台输出：jsbinding succeed ! oh yeah!,用于提示调用成功，头文件内容如下：

JsbTest.h

JsbTest.cpp 

然后把.h文件和.cpp文件拷贝到以下目录（下面修改.ini配置文件的时候方便一点，当然也可以拷贝到其他目录，但是我没试过）

Creator软件根目录\2.4.5\resources\cocos2d-x\tools\tojs

然后我们开始创建.ini配置文件（其实就是复制一个来自己修改一下啦），这里我只讲要修改的，.ini文件里的参数的具体用法请看这里108（就不要问我了，因为我也搞不清楚），这里非常感谢原作者，这是我的启蒙教程

找个内容最简单的.ini文件来修改，这里我选的是目录下的cocos2dx.ini，复制一份到当前目录下，并改名为JsbTest.ini（随便叫啥都可以啦，这里为了方便起见，就和c++文件叫一样的名字好了），然后用文本编辑器打开JsbTest.ini文件，并且修改为以下内容（这里如果是照着我的教程来的，cpp文件和头文件是我贴出来的内容，可以直接复制）

[JsbTest]
# the prefix to be added to the generated functions. You might or might not use this in your own
# templates
prefix = JsbTest
 
# create a target namespace (in javascript, this would create some code like the equiv. to `ns = ns || {}`)
# all classes will be embedded in that namespace
target_namespace = 
 
# the native namespace in which this module locates, this parameter is used for avoid conflict of the same class name in different modules, as "cocos2d::Label" <-> "cocos2d::ui::Label".
cpp_namespace = 
 
android_headers = -I%(androidndkdir)s/platforms/android-14/arch-arm/usr/include -I%(androidndkdir)s/sources/cxx-stl/gnu-libstdc++/4.8/libs/armeabi-v7a/include -I%(androidndkdir)s/sources/cxx-stl/gnu-libstdc++/4.8/include -I%(androidndkdir)s/sources/cxx-stl/gnu-libstdc++/4.9/libs/armeabi-v7a/include -I%(androidndkdir)s/sources/cxx-stl/gnu-libstdc++/4.9/include
android_flags = -D_SIZE_T_DEFINED_ 
 
clang_headers = -I%(clangllvmdir)s/%(clang_include)s 
clang_flags = -nostdinc -x c++ -std=c++11 -U __SSE__
 
cocos_headers = -I%(cocosdir)s/cocos -I%(cocosdir)s/cocos/editor-support -I%(cocosdir)s/cocos/platform/android -I%(cocosdir)s/external/sources
 
cocos_flags = -DANDROID
 
cxxgenerator_headers = 
 
# extra arguments for clang
extra_arguments = %(android_headers)s %(clang_headers)s %(cxxgenerator_headers)s %(cocos_headers)s %(android_flags)s %(clang_flags)s %(cocos_flags)s %(extra_flags)s 
 
# what headers to parse
headers = %(cocosdir)s/tools/tojs/JsbTest.h
 
replace_headers = 
 
# what classes to produce code for. You can use regular expressions here. When testing the regular
# expression, it will be enclosed in "^$", like this: "^Menu*$".
classes = JsbTest
 
classes_need_extend = 
 
# what should we skip? in the format ClassName::[function function]
# ClassName is a regular expression, but will be used like this: "^ClassName$" functions are also
# regular expressions, they will not be surrounded by "^$". If you want to skip a whole class, just
# add a single "*" as functions. See bellow for several examples. A special class name is "*", which
# will apply to all class names. This is a convenience wildcard to be able to skip similar named
# functions from all classes.
 
skip = 
 
rename_functions = 
 
rename_classes =
 
# for all class names, should we remove something when registering in the target VM?
remove_prefix = 
 
# classes for which there will be no "parent" lookup
classes_have_no_parents = 
 
# base classes which will be skipped when their sub-classes found them.
base_classes_to_skip = 
 
# classes that create no constructor
# Set is special and we will use a hand-written constructor
abstract_classes = 
 
# Determining whether to use script object(js object) to control the lifecycle of native(cpp) object or the other way around. Supported values are 'yes' or 'no'.
script_control_cpp =

这里我修改了哪些地方呢？

1.文件第1行中括号内的：cocos2dx 修改为：JsbTest

2.第4行的:prefix = cocos2dx_ui 修改为：prefix = JsbTest

3.第7行的：target_namespace = jsb 修改为：target_namespace =

4.第26行的：（太长了我就不贴出来了） 修改为：headers = %(cocosdir)s/tools/tojs/JsbTest.h

5.第28行的：（太长了我懒得复制） 修改为：replace_headers =

6.第33行的：（这句更长，有那···么长） 修改为：classes = jsbTest

7.第35行的：（非长常，呸，肥肠长，呸呸，非常长） 修改为：classes_need_extend =

8.然后最后的所有参数，”="号后面的东西全部删除

保存完工，接下来就修改绑定脚本

在当前目录下找到：genbindings.py，用文本编辑器打开，在152行的：cmd_args的大括号里照着格式添加如下内容：

'JsbTest.ini': ('JsbTest', 'jsb_JsbTest_auto')

并保存

然后命令行运行：genbindings.py

绑定成功会出现：控制台很多脚本在绑定，然后在 Creator软件根目录\2.4.5\resources\cocos2d-x\cocos\scripting\js-bindings\auto 会生成最新的绑定文件（是不是最新的，你看文件修改日期就知道了）

然后把你的.h和.cpp文件移动或者复制到：

jsbTest（项目根目录）\build\jsb-default\frameworks\runtime-src\Classes

然后进入目录：
Creator软件根目录\2.4.5\resources\cocos2d-x\cocos\scripting\js-bindings\auto

在最下面你会看到jsb_JsbTest_auto.cpp文件和jsb_JsbTest_auto.hpp两个文件，这就是绑定后的源文件，把这两个文件拷贝到：
JsbTest（项目根目录）\build\jsb-default\frameworks\cocos2d-x\cocos\scripting\js-bindings\auto

然后进入：

Creator软件根目录\2.4.5\resources\cocos2d-x\cocos\scripting\js-bindings\auto\api

找到：jsb_JsbTest_auto_api.js文件并复制到：

JsbTest（项目根目录）\build\jsb-default\frameworks\cocos2d-x\cocos\scripting\js-bindings\auto\api

然后进入：

JsbTest（项目根目录）\build\jsb-default\frameworks\runtime-src\proj.win32

双击打开：hello_world.vcxproj 这个文件（第一次打开VS会有一个提示框，说啥c++位置啥的，提示框内全是文字，一定要点确定，一定要点确定，一定要点确定，重要的事说三遍），然后找到hello_world项目下的Classes并右键选择添加-现有项

选择刚才拷贝过来的.h和.cpp源文件并添加

然后选择libcocos2d项目下的auto并右键选择添加-现有项

添加绑定好的.hpp和.cpp文件

然后双击jsb_jsbTest_auto.cpp文件

 

这时会提示jsbTest.h文件找不到，我们亲自动手帮他找

右键单击libjscocos2d选择属性

 

选择c++-常规

 

在附加包含目录那里点击下拉框右边的三角形，选择编辑

点击空白的地方添加如下内容：

$(EngineRoot)..\runtime-src\Classes

并保存，然后就不会找不到JsbTest.h头文件啦

然后双击AppDelegate.cpp文件

 

 

 

第43行：

点击右键选择转到定义

然后会跳转到另一个cpp文件

在上面头文件包含里加上：

#include "jsb_jsbTest_auto.hpp"

然后在第127行（别问我为什么在127行，这里有空位置，我也不知道顺序会不会有影响，保险起见就在127行）添加如下内容：

sc->addRegisterCallback(register_all_JsbTest);

 

然后点击vs的本地Windows调试器调试一下，看看有无报错

接下来就可以在creator的脚本里面调用C++的接口了，

最后选择creator的安卓平台和调试模式，构建一下，再在win32目录下打开vs工程，编译运行下，

如无意外，你就能看到一下界面了：

欧耶！绑定成功啦

教程完！

第一次写教程，也是为了记录解决问题的过程，感谢@省粮 的小白教程，让我少走了很多弯路，如果该教程有啥不对的地方，希望大家反馈给我，如有错误我会及时改正，避免误导其他同学。

有啥问题也可以发帖交流，虽然我也不是很懂，但尽量做到知无不言言无不尽吧，大家一起学习吧，感谢！！！