Bishamon Personal コミュニティ

お世話になっております。
エフェクトを描画する際の回転のさせ方につきまして確認させていただきたく、スレッドを立てさせていただきました。

iOSは以下のように描画することで、想定どおりに(IDEで再生するのと同じように)エフェクトが描画できます。
・IDEでコンバートしたままだと若干小さいので、画面で使いたい大きさにするため、全体的に拡大。
・ラジアン角を指定することでで回転。(90度相当)

// 以下にはそれぞれ計算値が入っています。
float effectScale;
CGFloat pointX, pointY;

ml::matrix44 m;

// IDEからコンバートした状態では全体的に小さいので、拡大しています。
m.set_scale(effectScale, effectScale, effectScale);

m.set_translate(pointX, pointY, 0);

// 回転角はラジアンで指定。90度=1.57ラジアン
m.mul_rot_x(-1.0f * M_PI_2); // X軸に対して-90度回転

[effect setMatrix:m];

AndroidもAndroid用にコンバートした同エフェクトを使っているのですが、思うように描画できず、以下のようにして｢それらしく｣見えるよう調整しています。
・iOSと同様、全体的に拡大するのですが、そのままだと縦に潰れたようになってしまうため、縦を長めに拡大。
・回転角の値をいろいろ変えて試したところ、｢45｣が一番まともに描画できたため、回転には暫定的にこれを採用。

float effectScale;
CGFloat pointBaseX, pointBaseY;

float[] scale = new float[16];
Matrix.setIdentityM(scale, 0);
// 縦方向は長めに拡大
Matrix.scaleM(scale, 0, effectScale, effectScale * 1.95, effectScale);

float [] trans = new float[16];
Matrix.setIdentityM(trans, 0);
Matrix.translateM(trans, 0, pointX, pointY, 50.0f);

float [] modelMatrix = new float[16];
Matrix.setIdentityM(modelMatrix, 0);
// いろいろ調整したが、45(度？)回転が一番まともに描画できる
Matrix.setRotateM(modelMatrix, 0, -45.0f, 1.0f, 0.0f, 0.0f);

float [] m = new float[16];
Matrix.multiplyMM(m, 0, trans, 0, scale, 0);
Matrix.multiplyMM(m, 0, m, 0, modelMatrix, 0);

e.setMatrix(m);

iOSが正しく(想定どおり)描画できているのでAndroidも同じように描画させたいのですが、
どのように実装するのが正しいのでしょうか？
誤っている箇所がありましたらご指摘いただけますと幸いです。

お手数をおかけしますが、よろしくお願い致します。

依然として試行錯誤しております。
何か手掛かりが掴めれば、、と思っているのですが、いかがでしょうか。
上記以外に何か情報が必要でしたらお知らせください。
ご多忙中恐れ入りますが、よろしくお願い致します。

お世話になっております。

iOS 側では正しく描画されるが、Android側では同じように描画されないということで宜しいでしょうか。
Cameraのプロジェクションの設定がどのように設定しているか、iOS/Androidそれぞれを教えて頂けますでしょうか？

その他、何か考えられる原因がないか検討してみたいと思います。

ご担当者さま

ご確認いただきありがとうございます。
Cameraのプロジェクション設定などは以下のようにしております。

■iOS
GLViewの初期化処理にて

glMatrixMode(GL_PROJECTION);
glLoadIdentity();

float left   = rect.origin.x;
float right  = rect.origin.x + rect.size.width;
float top    = rect.origin.y;
float bottom = rect.origin.y + rect.size.height;
glOrthof(left, right, bottom, top, -100, 100);

glMatrixMode(GL_MODELVIEW);
glLoadIdentity();

のような設定を行っています。

また、1フレーム毎に

[manager begin2D];

// 各種描画処理
[self drawBackground];
[self drawBackgroundEffect]; // 背景エフェクト描画
[self drawMainFrame];
[self drawLinks];
[self drawIcons];
[self drawChangeValues];
[self drawLevels];
[self drawCutIn];
[self drawSkillCutIn];
[self drawEffect]; // エフェクト描画

[manager end];

のようにBMManagerクラスのメソッドを呼び出しています。

■Android
RendererクラスのonSurfaceChanged()にて

int screenW; // スクリーンの幅
int screenH; // スクリーンの高さ

gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();

gl.glOrthof(0, screenW, screenH, 0, 100.0f, -100.0f);
manager.ortho(0, screenW, screenH, 0, 100.0f, -100.0f);
manager.lookat(0, 0, 100.0f, 0, 0, 0, 0, 1, 0);

gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glLoadIdentity();

のように設定を行っています。
(Manager#lookat()の引数値に根拠はありませんが、現時点でそれらしく描画できそうな値を設定しているようです。)

Managerクラスのメソッド呼び出しは、iOSの｢drawEffect()｣に相当するメソッド内で

manager.begin();
for (Effect e : playEffects) {
	manager.drawEffect(e);
}
manager.end();

のようにしています。
(iOSのように描画処理全体の前後でManager#begin()、Manager#end()を呼び出すと崩れが起こったことが以前あったようで、現在もこの実装のままとなっているようです。)

iOSとAndroidとで実装には差異があることがわかりましたので
こちらでも引き続き調査を行ってまいりますが、
ここから何か心当たることなどがありましたらご教示いただけますと幸いです。
たびたびお手数をおかけしますが、ご確認のほどよろしくお願い致します。

ORTHOの設定の差により起きている問題かもしれません。

Android側の
＞gl.glOrthof(0, screenW, screenH, 0, 100.0f, -100.0f);
＞manager.ortho(0, screenW, screenH, 0, 100.0f, -100.0f);
＞manager.lookat(0, 0, 100.0f, 0, 0, 0, 0, 1, 0);

あたりが怪しいです。
０，０が画面左上になっているため、意図とした絵になっていないと思います。
合わせて注視点も０，０になっておりますので。
orthoの設定で、０，０を画面中心に設定してみてはいかがでしょうか？
または、注視点を画面中心に設定してください。

例ですが、
float hw = screenW * 0.5f;
float hh = screenH * 0.5f;
gl.glOrthof(-hw, hw, -hh, hh, 100.0f, -100.0f);
manager.ortho(-hw, hw, -hh, hh, 100.0f, -100.0f);
などです。

早々のご確認、ありがとうございます。
ぜひ試してみたいと思います。

お世話になっております。

アドバイスをいただいたとおりOrthoの設定を変更してみたところ、
全体的な描画位置や角度には変化があったものの、エフェクトの潰れに関しては改善されませんでした。

そこで、やはりまずはエフェクト描画処理のOS間の差分を埋めたいと考えています。
最初にコメントさせていただいたiOSの現実装
> ・IDEでコンバートしたままだと若干小さいので、画面で使いたい大きさにするため、全体的に拡大。
> ・ラジアン角を指定することでで回転。(90度相当)
と同じことをAndroidで行うには、どのようにすればよろしいでしょうか？

たびたびお手数ですが、ご確認のほどよろしくお願い致します。

すみません、「あたりが怪しいです」などと書いてしまい失礼いたしました。
こちらは Orthoの設定として

＞gl.glOrthof(0, screenW, screenH, 0, 100.0f, -100.0f);
＞manager.ortho(0, screenW, screenH, 0, 100.0f, -100.0f);
＞manager.lookat(0, 0, 100.0f, 0, 0, 0, 0, 1, 0);

そのアプリの状況にもよりますため、上記でも問題御座いません。
他の設定も試して頂きたかったのが目的でした。


>> ・IDEでコンバートしたままだと若干小さいので、画面で使いたい大きさにするため、全体的に拡大。
>> ・ラジアン角を指定することでで回転。(90度相当)
>と同じことをAndroidで行うには、どのようにすればよろしいでしょうか？

基本的にはマトリクスの設定にてBISHAMONのエフェクトクラスにsetMatrix()にて設定いたしますので、上記の拡大と回転を行ったマトリクスを生成して頂ければと思います。

ご確認ありがとうございます。

本件は、Matrixの設定がうまくいかずに質問をさせていただきました。
回転角を10度単位くらいで調整したり、LookAtを調整したり、処理順を変えてみたりと
いろいろ試してみてはいますが、
・iOSは90度(実際はラジアンで指定)回転することでうまく描画できている
・Androidは45度回転が一番マシ(ただし、縦が半分潰れたように歪んでしまう)
というところから前進しておりません。

エフェクト自体の問題なのでしょうか。。
今一度調整を試みてみます。

お世話になっております。

初めの投稿でのマトリクス計算方法にて問題ないように思います。
回転時の歪みについては、あと考えられるのはアスペクト比の問題かも知れません。

manager.ortho では、
　・gl.glOrthof　の設定
　・プロジェクションマトリクスをSDK内に保持
の処理のみを行っております。

また、IOSとAndroidのSDKはCPP部分は全く同じソースコードを利用しており、違いはありません。
Androidでは、Javaのラッパーを通している違いのみとなります。

他の原因の可能性が出てきましたら追ってご報告したいと思います。