用ECMAScript4 ( ActionScript3) 實現Unity的熱更新 -- 熱更新Live2D

時間 2019-11-18

標籤 ecmascript4 ecmascript actionscript3 actionscript 實現 unity 更新 live2d live 欄目 JavaScript 简体版

原文原文鏈接

live2D是一個很強大的2D動畫組件。咱們可使用AS3腳本對它進行熱更新。html

live2D在Unity中的使用請看這裏：json

如何獲取Live2D

總得來講，咱們能夠先去live2D官網下載它的Unity SDK,而後便可在Unity中使用。咱們這裏使用的是live2d 2.1版。api

咱們的目標是把 Live2D_SDK_Unity_2.1.02_1_jp\sample\Demo\ 這個unity示例工程改形成as3熱更新版本。ide

準備熱更新工程

首先您要先建立一個空白的Unity工程。而後將下載好的Live2D SDK目錄中，上面提到的Live2D_SDK_Unity_2.1.02_1_jp\sample\Demo\下的全部文件拖拽到Unity項目裏。動畫

而後使用ActionScript3熱更新腳本系統將Live2D 的API導出給AS3腳本備用。若是您不瞭解這個熱更新腳本，請看這裏的連接和以前的系列教程。ui

如今將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此方法便可。
最終效果以下:this

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。