このマニュアルはCubism 2 (前バージョン）用です。現行バージョンのCubismはこちら。
Live2Dモデルを表示するまでの基本的な流れ
1. 初期化
a. インスタンスの作成(mocの読み込み)
b. テクスチャの関連付け
c. グラフィック環境の関連付け ( プラットフォームによっては必要なし )
d. 表示位置と大きさの指定
2. 更新時
a. 頂点の更新
b. 描画
これらのうち初期化時の流れがプラットフォーム依存のコードになります。
また、表示位置の指定時の基準も環境により異なることがあります。(サンプルでは出来るだけ同じにしています)
1-a. インスタンスの作成 (mocの読み込み)
まずはLive2Dモデルのインスタンスを作成します。
このインスタンスから表示やアニメーションなどの操作を行います。
プラットフォームごとにLive2DModelXXX ( 例えばiPhoneならLive2DModelIPhone )のようにモデルクラスが用意されています。
mocデータから読み込むには各Live2DModelXXXクラスのstatic関数として定義されているloadModel 関数を利用します。
ほとんどのプラットフォームではファイルのパスから読み込む方法とバイト配列から読み込む方法の2つが提供されています。
または、
のようにして読み込みます。
1-b．テクスチャの関連付け
mocファイルとテクスチャファイルを読み込んだらその関連付けの設定が必要です。
テクスチャの設定には、setTexture 関数を利用します。
一つ目の引数はModelerで設定したモデルテクスチャ番号です。
二つ目の引数はテクスチャです。
これはプラットフォーム(グラフィック環境)によって型は変わります。
例えばOpenGLならばglGenTextures によって作成された整数になります。
プラットフォームによっては描画時にグラフィックエンジンなどへの参照が必要になるため、モデルへの設定が必要な場合があります。
OpenGLやDirectXなどの初期化をLive2D内部では行わないため、外部で適切に初期化してください。
iPhoneの場合： 必要なし
Androidの場合：
Flashの場合：
DirectXの場合：
これまでの設定を行えば、モデルを描画することはできますが多くの場合表示位置や縮尺が違いすぎて画面には表示されません。
何も指定しない状態では、モデルは左上を原点として右下までの大きさがModelerでの設定サイズ (参考)になります。
そのためsetMatrix関数に行列を設定して位置と大きさを指定します。
4x4のサイズの行列を使用します。
float型の16の長さの配列で、並び順はOpenGL準拠です。
また、getCanvasWidth(),getCanvasHeight()でモデルのサイズを取得できます。
OpenGLでの画面設定例
画面の中心を原点とし、左上(-1,1)、右下(1,-1)
モデルの位置設定
画面中心と横幅をモデルと合わせる設定。
この例では直接配列を編集していますが、一般的には行列用のクラスを使って設定します。
頂点の計算はupdate関数で行います。そのため、アニメーションさせるには毎フレーム呼ぶ必要があります。
draw関数でモデルを描画します。