2013年6月15日土曜日

[Android] フリーサイズの画像をOpenGLのテクスチャに表示する

How to stretch and reduce images.
前回までに作ったOpenGLで簡易画像ビュアーの機能を強化します。
ピンチイン・ピンチアウトの認識とOpenGL ES 2.0 のAPIを利用するので、Android2.2以降でマルチタッチ対応の端末が必要です。

このブログを書いている時点の開発環境は次の通りです。
・Windows8 (64bit)
・Eclipse Juno (32bit) (XP互換モードで起動)
・Android SDK r21.0.1

OpenGLで画像をテクスチャとして表示するためには、辺の長さが2の累乗(べき乗)の正方形である必要があります。
256×256ピクセル、512×512ピクセルなど。
このルールを守らないと端末によってはテクスチャが表示されないことがあります。

OpenGLの仕様とは言え、表示したい画像が全て正方形とは限りません。
今回は、縦と横のサイズが異なる画像を伸縮し、OpenGLで表示できる様にします。
そして1画面に2枚の画像を表示します。

300×200ピクセルの orientation.png


200×300ピクセルの portrait.png

二つの画像ファイルをプロジェクトの
res - drawable-mdpi
にコピーします。
resフォルダーの下に drawable-nodpi というフォルダーを作ってそこに画像ファイルをコピーしてさい
drawable-nodpi 以外のフォルダーに保存した画像は端末の解像度に応じて自動でスケーリングされるようです。(2014年5月31日訂正)
※ ic_launcher.png はAndroid-SDKのデフォルトでインストールされるアイコン画像です。

フリーサイズの画像をテクスチャに表示するため伸縮させ正方形に納めます。余白は透明のピクセルで埋めます。

伸縮させた画像がギザギザにならないようにMatrixを使ってアンチエイリアス処理をします

Activity(MainActivity.java) ※公開後、数カ所の不具合を発見したので修正させて頂きました。(2013年6月15日)

※特別な権限(Permission)は不要なのでマニフェストは省略します。
Android2.2以降で動作します。
Target SDK Version が8以上の設定でビルドできます。

実行するとこんな感じになります。

横長・縦長の画像を正方形のポリゴンにテクスチャとして表示しています。

前回のソースを元にしているのでフリックで移動、ピンチアウト・ピンチインで拡大縮小ができます。

関連ブログ
[Android] OpenGLで簡易画像ビュアーを作る
[Android] ジェスチャーでOpenGL簡易画像ビュアーに拡大縮小機能を追加する
[Android] OpenGLでプロ生ちゃんをアニメーションさせる
[Android] OpenGL ESで文字を表示する
[Android] OpenGLで頂点の多いポリゴンを扱うには
[Android] OpenGLでシャープ製端末用3D(立体視)アプリケーションを作る
[Blender] obj2opengl.plをJava用に改造する
[Windows8][Android] Can't bind to local 8600 for debugger

以上、参考になれば幸いです。

0 件のコメント:

コメントを投稿