JSBinding + SharpKit / 实战：转换 2DPlatformer

最后修改：2015年07月29日

2016年2月25日

 

2DPlatformer 是 Unity3D 的一个官方 Demo。本文将介绍使用 JSBinging + SharpKit 转换 2DPlatformer 的过程。

本文并不详细介绍每个步骤的细节。因为他们将在其他文章里做详细介绍。

 

准备工作：首先准备好 JSBinding 的工程，正确导入 JSBinding 插件。

2DPlatformer 是Unity3D的第一个示例代码，一共不到10M。麻雀虽小，五脏俱全。牵扯到很多东西，比如 prefab 的使用，结构体序列化，场景切换，音乐等等。

我们的目标是：在已有的工程中，不添加/更新任何C#代码，不用JS重写任何C#代码，花费最少的时间把整个 2DPlatformer 游戏添加进去。

 

分析：

  1. 2DPlatformer 的 C# 代码全部都在 2DPlatformer/Scripts/ 文件夹中。现在需求是不允许更新C#代码，那么我们最终得把这个文件夹删掉。
  2. 既然要删掉所有的C#代码，那功能由谁来实现呢？此时强大的 SharpKit 出场了。他可以自动把 C# 代码转换在 JS 代码。

 

下载：

Unity官方原版 2DPlatformer（版本2.1）：https://www.assetstore.unity3d.com/en/#!/content/11228

 

以下是具体步骤：

 

1. 将 2DPlatformer 导入到工程中，并确定C#版本能够正确运行

为了方便，导入后，建立一个 2DPlatformer 文件夹，把东西都拖进去。如图。

放完后一定要确保能够正常运行，因为项目包含 Project Settings ，如果没有正确导入，C#版本本身就会出错。

 

2. 配置 JSBindingSettings.classes

这里给出的是 2D Platformer 所有用到的类型，可以将这个数组替换掉代码中的 JSBindingSettings.classes 数组。

应该是不改也可以，因为代码里 JSBindingSettings.classes 数组已经包含下面这些类了。

public static Type[] classes = new Type[]
    {
        typeof(PerTest),
        typeof(PerTest.RefObject),

        typeof(Debug),
        typeof(Input),
        typeof(GameObject),
        typeof(Transform),
        typeof(Vector2),
        typeof(Vector3),
        typeof(MonoBehaviour),
        typeof(Behaviour),
        typeof(Component),
        typeof(UnityEngine.Object),
        typeof(YieldInstruction),
        typeof(WaitForSeconds),
        typeof(WWW),
        typeof(Application),
        typeof(UnityEngine.Time),
        typeof(Resources),
        typeof(TextAsset),
        
        typeof(IEnumerator),
        typeof(List<>),
        typeof(List<>.Enumerator),
        typeof(Dictionary<,>),
        typeof(Dictionary<,>.KeyCollection), 
        typeof(Dictionary<,>.ValueCollection), 
        typeof(Dictionary<,>.Enumerator), 
        typeof(KeyValuePair<,>), 
        
        typeof(System.Diagnostics.Stopwatch),
        typeof(UnityEngine.Random),
        typeof(StringBuilder),

        typeof(System.Xml.XmlNode),
        typeof(System.Xml.XmlDocument),
        typeof(System.Xml.XmlNodeList),
        typeof(System.Xml.XmlElement),
        typeof(System.Xml.XmlLinkedNode),
        typeof(System.Xml.XmlAttributeCollection),
        typeof(System.Xml.XmlNamedNodeMap),
        typeof(System.Xml.XmlAttribute),

        // for 2d platformer
        typeof(LayerMask),
        typeof(Physics2D),
        typeof(Rigidbody2D),
        typeof(Collision2D),
        typeof(RaycastHit2D),
        typeof(AudioClip),
        typeof(AudioSource),
        typeof(ParticleSystem),
        typeof(Renderer),
        typeof(ParticleSystemRenderer),
        typeof(DateTime),
        typeof(GUIElement),
        typeof(GUIText),
        typeof(GUITexture),
        typeof(SpriteRenderer),
        typeof(Animator),
        typeof(Camera),
        typeof(Mathf),
        typeof(Quaternion),
        typeof(Sprite),
        typeof(Collider2D),
        typeof(BoxCollider2D),
        typeof(CircleCollider2D),
        typeof(Material),
        typeof(Color),
        typeof(PolygonCollider2D),
    };

 

3. 生成JS绑定

配置好 JSBindingSettings.classes 后就可以生成绑定了。

点击菜单：【JSB | Generate JS and CS Bindings】

（如果 Unity 版本没改，JSBindingSettings.classes 的列表也没有变化，此步骤如已执行过不需要再执行）

 

4. 正确配置 JSBindingSettings 里的各个导出路径设置

需要配置以下几个参数，路径都是相对于 Assets 文件夹：

PathsNotToJavaScript：简称为A，是指哪些路径不要转换成JS。比如说类库，或者 JSBinding 本身。

PathsToJavaScript：简称为B，是指那些在A中路径下的，但是又要导出的。

 

有点乱，详细解释一下。A和B是用于配置哪些路径要保留C#，哪些路径下的C#要转换成JS。

通常来说，基础框架代码是不需要转换成JS的，而且是相对固定的，比较少会进行改动。所以把这些路径配置到A数组。

这样就表示，除了A以外的其他路径里的C#类，都将被标记 [JsType(...)]标签，之后将被 SharpKit 编译生成JS代码。

而B是啥呢？B只是用于对A做一些例外，就是属于A数组，但是又要被转换成JS的。比如说，JSBinding/ 因为是插件源代码，肯定不转换成JS，所以 JSBinding/ 会配置在A数组里。

但是我们在 JSBinding/Samples 里放了一些示例代码，我希望他们被编译成JS，所以我就把 JSBinding/Samples 配置在B里，表示要转换。

 

PathsNotToCheckOrReplace：简称C。

跟A和B类似，但是用于说明 prefab 的处理。对于脚本，我们是将其编译成JS，才可以进行更新。对于 prefab，因为 prefab 上绑定了脚本，那么必须要解除这个绑定关系才可以。

解除的方法是将脚本都替换成 JSComponent，这里不详细解释。C这个数组用于说明，不要对哪些路径下的 prefab 进行处理。比如说 "JSBinding/Prefabs/_JSEngine.prefab" 是不需要处理的。

NGUI/ 路径下的 prefab 也不需要处理，因为这些 prefab 不会绑定要被导成JS的C#脚本。

 1     /*
 2      * Formula:
 3      * All C# scripts - PathsNotToJavaScript + PathsToJavaScript = C# scripts to export to javascript
 4      * see JSAnalyzer.MakeJsTypeAttributeInSrc for more information
 5      */
 6     public static string[] PathsNotToJavaScript = new string[]
 7     {
 8         "JSBinding/",
 9         "Stealth/",
10         "DaikonForge Tween (Pro)/",
11         "NGUI/",
12     };
13     public static string[] PathsToJavaScript = new string[]
14     {
15         "JSBinding/Samples/",
16         "DaikonForge Tween (Pro)/Examples/Scripts",
17     };
18     /// <summary>
19     /// By default, menu
20     /// 
21     /// JSB | Check All Monos for all Prefabs and Scenes
22     /// JSB | Replace All Monos for all Prefabs and Scenes
23     /// 
24     /// handles all Prefabs and Scenes in whole project
25     /// add paths(directory or file name) to this array if you want to skip them
26     /// </summary>
27     public static string[] PathsNotToCheckOrReplace = new string[]
28     {
29         "JSBinding/",
30         "JSBinding/Prefabs/_JSEngine.prefab",
31         "Plugins/",
32         "Resources/",
33         "Src/",
34         "StreamingAssets/",
35         "UnityVS/",
36         "DaikonForge Tween (Pro)/",
37         "NGUI/",
38     };
View Code

 

 

5. 往2DPlatformer 的所有 C# 源代码中的类和结构体添加 [JsType()] 标记。

上一个步骤已经配置好了，这一步只要运行菜单即可。

运行菜单：【JSB | Add JsType Attribute for all structs and classes】

 

修改后会有像下面这样的变化：

// 原来的代码

1 using UnityEngine;
2 using System.Collections;
3 
4 public class Gun : MonoBehaviour
5 {
6     public GameObject rocketGO;                // Prefab of the rocket.
7     public float speed = 20f;                // The speed the rocket will fire at.

// 执行菜单后（生成了 [JsType()] 标记）：

1 using UnityEngine;
2 using System.Collections;
3 
4 using SharpKit.JavaScript;
5 [JsType(JsMode.Clr,"../../StreamingAssets/JavaScript/SharpKitGenerated/2DPlatformer/Scripts/Gun.javascript")]
6 public class Gun : MonoBehaviour
7 {
8     public GameObject rocketGO;                // Prefab of the rocket.
9     public float speed = 20f;                // The speed the rocket will fire at.

 

6. 对代码进行少量修改

6.1 往以下几个文件添加这段代码：

（为啥：请看 JSBinding + SharpKit / Coroutine支持）

// 文件

  1. BackgroundPropSpawner.cs
  2. Bomb.cs
  3. PickupSpawner.cs
  4. Remover.cs
  5. Spawner.cs

// 要添加的代码

void LateUpdate()
{
    jsimp.Coroutine.UpdateCoroutineAndInvoke(this);
}

 

6.2 对 BackgroundPropSpawner.cs 文件做如下修改（明确从 while 中 break 出来，而不是判断 object 是不是变成空了）：

（为啥：对GameObject go调用 Destroy后，在C#中 (go == null) 为 true，但 JavaScript 为 false。）

// 修改前：

 1                 // While the prop exists...
 2         while(propInstance != null)
 3         {
 4             // ... and if it's facing left...
 5             if(facingLeft)
 6             {
 7                 // ... and if it's beyond the left spawn position...
 8                 if(propInstance.transform.position.x < leftSpawnPosX - 0.5f)
 9                     // ... destroy the prop.
10                     Destroy(propInstance.gameObject);
11             }
12             else
13             {
14                 // Otherwise, if the prop is facing right and it's beyond the right spawn position...
15                 if(propInstance.transform.position.x > rightSpawnPosX + 0.5f)
16                     // ... destroy the prop.
17                     Destroy(propInstance.gameObject);
18             }
19 
20             // Return to this point after the next update.
21             yield return null;
22         }

// 修改后：

 1         while(propInstance != null)
 2         {
 3             // ... and if it's facing left...
 4             if(facingLeft)
 5             {
 6                 // ... and if it's beyond the left spawn position...
 7                 if(propInstance.transform.position.x < leftSpawnPosX - 0.5f)
 8                 {
 9                     // ... destroy the prop.
10                     Destroy(propInstance.gameObject);
11                     break;
12                 }
13             }
14             else
15             {
16                 // Otherwise, if the prop is facing right and it's beyond the right spawn position...
17                 if(propInstance.transform.position.x > rightSpawnPosX + 0.5f)
18                 {
19                     // ... destroy the prop.
20                     Destroy(propInstance.gameObject);
21                     break;
22                 }
23             }
24 
25             // Return to this point after the next update.
26             yield return null;
27         }

 

6.3 往 JSComponent 添加以下代码到合适的位置（打开代码你就知道该怎么加了，也可能已经有了，只是注释掉了，取消注释即可）

（为啥需要这一步？2DPlatformer 从动画 SendMessage 去执行 MonoBehaviour 代码，我们不支持、也不推荐这种方式，但他既然用了，我们先暂时特殊支持一下）

// 1 添加这3个变量定义到类中
    int idDestroyChildGameObject = 0;
    int idDisableChildGameObject = 0;
    int idDestroyGameObject = 0;

// 2 添加这3个成员初始化到函数 initMemberFunction 中
    idDestroyChildGameObject = JSApi.getObjFunction(jsObjID, "DestroyChildGameObject");
    idDisableChildGameObject = JSApi.getObjFunction(jsObjID, "DisableChildGameObject");
    idDestroyGameObject = JSApi.getObjFunction(jsObjID, "DestroyGameObject");

// 3 添加这3个函数到类中
    void DestroyChildGameObject()
    {
        callIfExist(idDestroyChildGameObject);
    }

    void DisableChildGameObject()
    {
        callIfExist(idDisableChildGameObject);
    }

    void DestroyGameObject()
    {
        callIfExist(idDestroyGameObject);
    }

 

7. 生成一个 js 文件，记录每个脚本要对应哪个JSComponent。

执行菜单：【JSB | Generate MonoBehaviour to JSComponent_XX】

这一步是提前计算每个 MonoBehaviour 脚本，要使用哪个 JSComponent 文件进行对应。

生成了文件：StreamingAssets/JavaScript/MonoBehaviour2JSComponentName.javascript，打开这个文件看看就会明白了。

 

8. 【JSB | Compile Cs to Js】

编译完成后  将在 StreamingAssets/JavaScript/SharpKitGeneratedFiles.javascript 文件里找到 2DPlatformer 的所有代码。

 

9. 解除所有 prefab 及 场景中GameObject 对 C# 源代码的引用

因为我们最终的目的是要删除整个 2DPlatformer/Scripts 文件夹，那么任何 prefab 及 GameObject 显然都不可以引用任何 C# 源代码。

对于 MonoBehaviour 来说，我们的做法是将其替换成固定的类 JSComponent，这个类足够强大，可以支持绝大部分继承于 MonoBehaviour 的类，最主要的是支持序列化。

对于其他类或结构体，他们都将被转换为 JS 代码，GameObject 不会引用到。

在真正的项目中使用时，最好先备份，再执行这个菜单。

执行菜单：[JSB | Replace all monos for all Prefabs and Scenes]

 

Replace.txt 示例。显示了所有将要被处理的 prefab 及 scene。刚好包含了所有 2DPlatformer 的所有东西。确定好了就点OK吧！让奇迹发生~

 1 2DPlatformer/Prefabs/Characters/enemy1.prefab
 2 2DPlatformer/Prefabs/Characters/enemy2.prefab
 3 2DPlatformer/Prefabs/Characters/hero.prefab
 4 2DPlatformer/Prefabs/Environment/backgroundAnimation.prefab
 5 2DPlatformer/Prefabs/Environment/backgrounds.prefab
 6 2DPlatformer/Prefabs/Environment/Bus.prefab
 7 2DPlatformer/Prefabs/Environment/Cab.prefab
 8 2DPlatformer/Prefabs/Environment/env_clouds.prefab
 9 2DPlatformer/Prefabs/Environment/env_fog.prefab
10 2DPlatformer/Prefabs/Environment/env_riverMid.prefab
11 2DPlatformer/Prefabs/Environment/env_riverTop.prefab
12 2DPlatformer/Prefabs/Environment/Foregrounds.prefab
13 2DPlatformer/Prefabs/FX/part_splash.prefab
14 2DPlatformer/Prefabs/FX/part_warp.prefab
15 2DPlatformer/Prefabs/FX/splash.prefab
16 2DPlatformer/Prefabs/killTrigger.prefab
17 2DPlatformer/Prefabs/mainCamera.prefab
18 2DPlatformer/Prefabs/pickupManager.prefab
19 2DPlatformer/Prefabs/platformEnd.prefab
20 2DPlatformer/Prefabs/Props/bomb.prefab
21 2DPlatformer/Prefabs/Props/bombCrate.prefab
22 2DPlatformer/Prefabs/Props/explosionCircle.prefab
23 2DPlatformer/Prefabs/Props/explosionParticle.prefab
24 2DPlatformer/Prefabs/Props/healthCrate.prefab
25 2DPlatformer/Prefabs/Props/rocket.prefab
26 2DPlatformer/Prefabs/Props/rocketExplosion.prefab
27 2DPlatformer/Prefabs/Props/swan.prefab
28 2DPlatformer/Prefabs/spawner.prefab
29 2DPlatformer/Prefabs/UI/ui_100points.prefab
30 2DPlatformer/Prefabs/UI/ui_bombHUD.prefab
31 2DPlatformer/Prefabs/UI/ui_healthDisplay.prefab
32 2DPlatformer/Scenes/Level.unity

 

菜单执行前：

执行菜单后：

 

添加一个 JSEngine.prefab 到场景中

场景是：2DPlatformer/Scenes/Level.unity

 

运行！

 

运行成功后，删除 2DPlatformer/Scripts/ 文件夹！

 

Windows版本可执行程序截图：

 

 

Unity代码热更新方案 JSBinding + SharpKit 首页

posted on 2015-05-04 21:24  AnswerWinner  阅读(1815)  评论(0)  编辑  收藏  举报

导航