OpenGLを使った地図描画エンジンの作り方（1）

スマホアプリ開発の最新トレンド！ ぜったい外せない位置情報活用術 番外編

OpenGLを使った描画の骨組み

　OpenGLを使った骨組みアプリは、下記5点で構成されています。

1. MainActivity
2. MapView
3. GL20SurfaceView
4. GL20MyRenderer
5. Shader（OpenGLES20を使う際に定義する必要があるため追加）

　まず、アプリ本体を構成するMainActivityは以下になります。

　今回のサンプルはリソースファイルから表示する図形を読み込むサンプルになっていますので、onCreateメソッドでリソースファイル「01.txt」を読み込みます。リソースファイルを含めたソースファイルは、GitHubからダウンロードが可能です。

MainActivity.java

package com.example.codezine_sample;

import java.io.BufferedReader;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.util.ArrayList;

import com.example.codezine_sample.MapView;

import android.os.Bundle;
import android.app.Activity;
import android.content.res.AssetManager;
import android.util.Log;
import android.view.Menu;

public class MainActivity extends Activity {
    
    private MapView _MapView ;                    //MapView
    private ArrayList<String[]> opgl_coordList; //ファイルから読み込んだ座標データを一時保存しておく場所です。
    static private final String FILE_PATH = "01.txt";
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //ファイル読み込みなど操作するときはtry{}catch{}で囲みます。
        try{
            //元からあるassetsフォルダに入れたtextファイルを読み込んでArrayListに格納します。
            AssetManager assets = getAssets();
            InputStream in = assets.open(FILE_PATH);
            BufferedReader br = new BufferedReader(new InputStreamReader(in));
            String str;
            opgl_coordList = new ArrayList<String[]>();
            while ((str = br.readLine()) != null) {
                String[] split_str = str.split("\t");
                opgl_coordList.add(split_str);
            }
            br.close();
        }catch (Exception e){
            Log.e("open and input text","読み込み失敗");
        }

        //描画領域の作成
        _MapView = new MapView(this,opgl_coordList);
        setContentView(_MapView);
        opgl_coordList = null;
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public void onDestroy(){
        _MapView = null;
        opgl_coordList = null;
        super.onDestroy();
    }
}

　次に、地図エンジン本体のMapViewを生成します。

　MainActivityで読み込まれたリソースファイルから描画を行うための点列に変換しています。

MapView.java

package jp.co.yahoo.map.codezine_sample;

import java.io.BufferedReader;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.io.IOException;
import java.util.ArrayList;
import android.content.Context;
import android.widget.FrameLayout;

public class MapView extends FrameLayout{
    
    private GL20SurfaceView mSurfaceView = null;    //描画用ビュー
    private Context mContext = null;    //Context
    private float[] mCoordList;        //Float形式の座標を格納する配列
    
    //コンストラクタ
    public MapView(Context context,InputStream is) throws IOException {
        super(context);

        //地図データを読み込む
        mCoordList = loatData(is);

        //Contextを設定
        mContext = context;

        //描画のためのビューを初期化
        mSurfaceView = new GL20SurfaceView(mContext, this);

        //SurfaceViewを追加する
        this.addView(mSurfaceView);
    }

    //地図データを設定します。
    private float[] loatData(InputStream is) throws IOException {
        BufferedReader br = new BufferedReader(new InputStreamReader(is));

        String str;
        ArrayList<String> list = new ArrayList<String>(); //行ごとのリスト
        //ファイルから１行ごとに読み込む
        while ((str = br.readLine()) != null) {
            list.add(str);
        }
        br.close();
        if(!(list.size()>0)) return null;

        //読み込んだファイルをFloat配列へ変換する
        float[] res = new float[list.size() * 3];  //x,y,zの順に格納されたfloat配列
        for(int i=0; i<list.size(); i++){
            str = list.get(i);
            String[] str_coord = str.split("\t");
            res[i * 3 + 0] = Float.valueOf(str_coord[0]);    //X座標
            res[i * 3 + 1] = Float.valueOf(str_coord[1]);    //Y座標
            res[i * 3 + 2] = 0.0f;                            //Z座標
        }
        list.clear();

        return res;
    }

    //地図データを返します。
    public float[] getCoordinateList() {
        return mCoordList;
    }

    //地図データの初期化します。
    public void release() {
        mCoordList = null;
    }

}