用ECMAScript4 ( ActionScript3) 實現Unity的熱更新 -- 熱更新Live2D
阿新 • • 發佈：2018-12-07
ini dma public lin img uil edi package module
live2D是一個很強大的2D動畫組件。我們可以使用AS3腳本對它進行熱更新。
live2D在Unity中的使用請看這裏：
如何獲取Live2D
總得來說，我們可以先去live2D官網下載它的Unity SDK,然後即可在Unity中使用。我們這裏使用的是live2d 2.1版。
我們的目標是把 Live2D_SDK_Unity_2.1.02_1_jp\sample\Demo\ 這個unity示例工程改造成as3熱更新版本。
準備熱更新工程
首先您要先創建一個空白的Unity工程。然後將下載好的Live2D SDK目錄中，上面提到的Live2D_SDK_Unity_2.1.02_1_jp\sample\Demo\ 下的所有文件拖拽到Unity項目裏。
然後使用ActionScript3熱更新腳本系統將Live2D 的API導出給AS3腳本備用。如果您不了解這個熱更新腳本，請看這裏的鏈接和之前的系列教程。
- 現在將AS3 熱更腳本的Unity插件導入Unity工程。
- 從菜單創建ActionScript3熱更新工程。
- 由於live2D的類庫並非代碼提供，而是以dll形式提供，因此我們需要在ActionScript3項目中配置將這個dll也導出到API。打開熱更新工程的genapi.config.xml文件，將Live2DUnity.dll加入到配置文件中:
<!--Configure DLLs to export--> <buildassemblys> <assembly value="D:\Program Files\Unity\Editor\Data\Mono\lib\mono\2.0\System.dll"></assembly> <assembly value="D:\Program Files\Unity\Editor\Data\Managed\UnityEngine\UnityEngine.CoreModule.dll"></assembly> <assembly value="D:\Program Files\Unity\Editor\Data\UnityExtensions\Unity\GUISystem\UnityEngine.UI.dll"></assembly> <assembly value="F:\UnityAS3\Live2DDemo\Library\ScriptAssemblies\Assembly-CSharp.dll"></assembly> <assembly value="F:\UnityAS3\Live2DDemo\Assets\Live2D\Live2DUnity.dll"></assembly> </buildassemblys>
- live2D的特殊之處：live2D的Demo中，角色的繪制是通過 MonoBehaviour 的 OnRenderObject 方法被調用時繪制的。OnRenderObject默認不會在腳本中使用，因此我們需要在Unity工程中創建一個類代理一下。 我們在主工程中創建如下代碼:
using System.Collections; using System.Collections.Generic; using UnityEngine; namespace Live2DUtil { public class Live2DBehaviour : MonoBehaviour { // Use this for initialization public virtual void Start() { } // Update is called once per frame public virtual void Update() { } public virtual void OnRenderObject() { } } }
Live2DBehaviour - 執行CreateUnityAPI.bat,導出API代碼。
- 新建一個場景。然後將 Assets/ASRuntimePlayer/下的AS3Player和AS3StartupProgress 兩個預設添加到場景中。操作完成後界面應該是這樣
- 點擊AS3Player,將文檔類設置為Live2DDemo。
- 將攝像機的參數設置為如下參數:
- 現在可以在ActionScript3熱更工程中寫代碼了。在as3工程中新建類Live2DDemo.as。
- 然後將如下代碼寫入as3熱更腳本。然後編譯執行，我們就能用熱更新腳本創建live2d動畫角色，並且還能和鼠標互動。
package { /** * ... * @author ... */ public class Live2DDemo { public function Live2DDemo() { } } } import live2d.EyeBlinkMotion; import live2d.Live2D; import live2d.Live2DModelUnity; import live2d.UtSystem; import live2d.framework.L2DPhysics; import live2d.framework.L2DTargetPoint; import live2dutil.Live2DBehaviour; import unityengine.Camera; import unityengine.GameObject; import unityengine.Input; import unityengine.Matrix4x4; import unityengine.MonoBehaviour; import unityengine.Resources; import unityengine.Screen; import unityengine.TextAsset; import unityengine.Texture2D; var lmodel:GameObject = new GameObject("as3live2dmodel"); class SimpleModel extends Live2DBehaviour { var mocFile:TextAsset; var physicsFile:TextAsset; var live2DModel:Live2DModelUnity; var eyeBlink:EyeBlinkMotion = new EyeBlinkMotion(); var dragMgr:L2DTargetPoint = new L2DTargetPoint(); var physics:L2DPhysics; var live2DCanvasPos:Matrix4x4; override public function start():void { Live2D.init(); load(); } function load():void { mocFile = Resources.load("haru.moc") as TextAsset; physicsFile = Resources.load("haru.physics.json") as TextAsset; live2DModel = Live2DModelUnity.loadModel__(mocFile.bytes); live2DModel.setTexture(0,Resources.load_("haru.1024/texture_00", Texture2D) as Texture2D); live2DModel.setTexture(1,Resources.load_("haru.1024/texture_01", Texture2D) as Texture2D); live2DModel.setTexture(2,Resources.load_("haru.1024/texture_02", Texture2D) as Texture2D); var modelWidth:Number = live2DModel.getCanvasWidth(); live2DCanvasPos = Matrix4x4.ortho(0, modelWidth, modelWidth, 0, -50.0, 50.0); if (physicsFile != null) physics = L2DPhysics.load(physicsFile.bytes); trace("loaded"); } override public function update():void { if (live2DModel == null) return; live2DModel.setMatrix(transform.localToWorldMatrix * live2DCanvasPos); var pos = Input.mousePosition; //if (Input.getMouseButtonDown(0)) //{ //// //} //else if (Input.getMouseButton(0)) { dragMgr.set(pos.x / Screen.width * 2 - 1, pos.y / Screen.height * 2 - 1); } //else if (Input.GetMouseButtonUp(0)) //{ //dragMgr.Set(0, 0); //} dragMgr.update(); live2DModel.setParamFloat("PARAM_ANGLE_X", dragMgr.getX() * 30); live2DModel.setParamFloat("PARAM_ANGLE_Y", dragMgr.getY() * 30); live2DModel.setParamFloat("PARAM_BODY_ANGLE_X", dragMgr.getX() * 10); live2DModel.setParamFloat("PARAM_EYE_BALL_X", -dragMgr.getX()); live2DModel.setParamFloat("PARAM_EYE_BALL_Y", -dragMgr.getY()); var timeSec:Number = Number( UtSystem.getUserTimeMSec()) / 1000.0; var t:Number = timeSec * 2 * Math.PI; live2DModel.setParamFloat("PARAM_BREATH", (0.5 + 0.5 * Math.sin(t / 3.0))); eyeBlink.setParam(live2DModel); if (physics != null) physics.updateParam(live2DModel); live2DModel.update(); } override public function onRenderObject():void { if (live2DModel == null) return; if (live2DModel.getRenderMode() == Live2D.L2D_RENDER_DRAW_MESH_NOW) live2DModel.draw(); } } lmodel.addComponent(SimpleModel);
Live2DDemo其中我們可以看到，絕大多數代碼都可以直接照著Demo的C#代碼照搬即可。
我們在腳本中使用的SimpleModel 繼承自 之前C#工程裏創建的Live2DBehaviour,它提供了onRenderObject方法，我們直接在腳本中override此方法即可。
最終效果如下:
用ECMAScript4 ( ActionScript3) 實現Unity的熱更新 -- 熱更新Live2D