模型說明

Live2D模型製作到顯示為止的基本流程

1. 初始化    
a. 製作實體(讀取moc)
b. 賦予貼圖關聯
c. 與繪圖環境連結 ( 有些平台不需要)
d. 指定顯示位置與尺寸 

2. 更新時
a. 更新頂點
b. 繪圖

這些初始化時的流程將成為依附平台的程式碼
此外,指定顯示位置的基準將依各環境有所不同。(範例檔已盡可能設定成一致)


1-a. 製作實體(讀取moc)

首先要製作Live2D模型的實體。
製作實體時可以操作顯示和動畫設定。
各平台環境下會各自有如Live2DModelXXX這樣的model class。(例如iPhone環境下Live2DModelIPhone)

讀取moc檔案時請利用loadModel函數。此函數此時被定義為Live2DModelXXX class的static函數。
幾乎所有的平台都提供從檔案路徑讀取和位元組陣列讀取這2種讀取方法。


Live2DModelXXX live2DModel = Live2DModelXXX::loadModel( path );


Live2DModelXXX live2DModel = Live2DModelXXX::loadModel( byteArray, size );

2種方法執行讀取。






1-b.賦予貼圖關聯

當讀取模型檔案(moc)和貼圖時需要設定賦予關聯。
可利用setTexture() 設定貼圖。
第1引數設定為在Modeler中設定的模型貼圖編號
第2引數設定為貼圖。
此處可能會因應不同平台(繪圖環境)而有所不同。
例如,在OpenGL中將會是由glGenTextures產生整數。


live2DModel->setTexture( 0 , texture_00 );
live2DModel->setTexture( 1 , texture_01 );
live2DModel->setTexture( 2 , texture_02 );



1-c. 與繪圖環境連結

因應各平台在繪圖時需要參考繪圖引擎等,因此可能需要於模型中進行設定。
Live2D內部將不會執行OpenGL或Directx等的初始化。請先於外部環境初始化。

iPhone不需要

Android
public void onDrawFrame(GL10 gl){
live2DModel->setGL( gl );
...
    
Flash
live2DModel->setGraphicsContext( context3D );


DirectX
LPDIRECT3DDEVICE9 g_pD3DDevice; 
live2DModel->setDevice(g_pD3DDevice) ;



1-d. 指定顯示位置與尺寸

如前述步驟設定後雖然就可以繪製模型。
但是多數的情況下會因圖像比例差距太大而無法正常顯示。
完全不指定的狀態下,Modeler的設定尺寸將預設為模型從左上原點到右下的尺寸。 (参考)
因此,請用setMatrix函數指定行列位置與尺寸。
這裡會使用4x4尺寸的行列。
將根據OpenGL執行float長度16的排列。
此外,可利用getCanvasWidth(),getCanvasHeight()取得模型尺寸。

OpenGL的畫面設定例
畫面的中心原點設為左上(-1,1)、右下(1,-1)
glViewport( 0, 0, deviceWidth, deviceHeight );
glMatrixMode( GL10.GL_PROJECTION ) ;
glLoadIdentity() ;
glOrthof( -1, 1, 1, -1, 0.5f, -0.5f );
模型位置設定
一併設定畫面中心和寬幅。
此例為編輯直接排列。一般在行列用的class設定即可。
float matrix[16];
matrix[0]  =  2/live2DModel->getCanvasWidth();//x軸的擴大率
matrix[5]  =  2/live2DModel->getCanvasWidth();//y
軸的擴大率
matrix[12] = -1;//x軸的移動
matrix[13] =  1;//y軸的移動
live2DModel->setMatrix( matrix );





2-a. 更新頂點

頂點的計算用update函數執行。因此如果要製作動畫每一格分鏡需要呼叫。

live2DModel->update();



2-b. 繪圖

使用draw函數繪圖。

live2DModel->draw();




サブページ (2): 模型的座標 模型貼圖編號
コメント