時間が空きましたが、
5日目からのつづきです。
マップの作成
マップの作成は
Tiled Map Editor を使用しました。
まずチップを作成し、それを元にマップを作ります。
チップの微調整は難しかったです。
さらにキャラクタ画像の作成も行いました。
後にアニメーションもしようと思っているので、こちらは仮のキャラクタ画像です。
ここまで出来たら ActivityにSurfaceViewを追加し、そこに描写します。
Eclipse で SurfaceViewの拡張クラスを追加すると、
レイアウト用のXMLの作成画面に、そのカスタムビューを追加できる項目が増えます。
今回は、 SurfaceViewの拡張クラスの名前をMapViewにしたのでその名前が出ています。
MapView クラスに Tiled Map Editor で作成したデータを読み込みます。
Tiled Map Editorを読み込むライブラリがいくつか公開されていたので、
今回は、TMXLoaderを使用しました。
public MapView(Context context, AttributeSet attrs) {
super(context, attrs);
holder = getHolder();
//callbackメソッドを登録
holder.addCallback(this);
mapData = TMXLoader.readTMX(MAP_FILE_NAME, context);
characterData = TMXLoader.readTMX(CHARACTER_FILE_NAME, context);
mapImage = TMXLoader.createBitmap(mapData, context, 0, mapData.layers.size());
characterImage = TMXLoader.createBitmap(characterData, context, 0, characterData.layers.size());
}
TMXLoader.readTMX() で読み込み、TMXLoader.createBitmap()で Bitmapクラスに変換しています。
また、MapViewクラスは Callback,Runnable インターフェースを継承し、
runメソッド内で描画します。
public void run() {
Canvas c = null;
while (true) {
try {
c = holder.lockCanvas();
if (c != null) {
int imagesize = 640;
int viewheight = this.getHeight();
int viewwidth = this.getWidth();
float scaleheight = (float)viewheight / (float)imagesize;
float scalewidth = (float)viewwidth / (float)imagesize;
Rect src = new Rect(0, 0, imagesize, imagesize);
Rect dst = new Rect(0, 0, viewwidth, viewwidth);
c.drawBitmap(mapImage, src, dst, new Paint());
mMatrix.setScale(scalewidth, scalewidth);
mMatrix.postTranslate(32*scalewidth*heroX, 32*scalewidth*heroY);
c.drawBitmap(characterImage, mMatrix, new Paint());
}
} finally {
if (c != null) {
holder.unlockCanvasAndPost(c);
}
}
}
}
起動すると、以下のスクリーンショットになります。
7日目へ。