Home>戻る

〜第五章 マップを作ろう〜


いよいよマップを表示してみましょう。
マップは「草原」「木」「家」「岩山」のように小さなチップを組み合わせて出来ています。
チップのサイズは32×32ドットとしました。8の倍数にするのが一般的のようです。
画面サイズは320×240ドットにしたので、 320÷32=10、240÷32=7.5 ということで1画面に10チップ×7.5チップ=75チップ分入ります。

チップには番号を割り当てます。
例えば「草原は1」「木は2」「家は3」というように。
そして表示させる時に、1だったら草原画像、2だったら木の画像というように判別します。
int mapdata[][] = new int mapdata[64][48];
このようにマップデータは二元配列にすれば分かりやすいでしょう。
この場合は最大で64×48チップ分の広さのマップが入ります。

mapdata[0][0] = 1;
mapdata[0][1] = 0;
mapdata[0][2] = 4;
....

このようにマップデータをプログラム中で指定すると、長くなってしまうので、 一般的にデータファイルから読み込むようにします。

<map01.dat>
01 00 04 02 00 0A 0B 04 ....

map01.datという別ファイルを作り、バイナリデータを入れておきます。
そしてプログラムでファイルを読み込み、一気にmapdata配列に入れるようにします。

そして描画部分で、mapdataの値によってそのチップを描画させるようにします。

以上が簡単なマップ描画の仕組みです。
しかし、マップには後々「その場所は通行可能か」「イベントはあるか」などの情報が必要になります。
そのために、また違う配列をマップの大きさ分用意すると、メモリ使用量が多くなり、管理も大変になります。
そこで効率の良い管理方法があります。マップの情報を枠(セル)に収めるやり方です。
セルには「グラフィックデータ」「イベント」「通過フラグ」といった情報を収めます。
class MapCell{
	int gra;//グラフィックデータ
	int event_flag;//イベントフラグ
	boolean move_flag;//通過可能フラグ
}
例えばこのようにMapCellクラスを作ります。
そしてプログラム本体でMapCellクラスのテーブルを作ります。
MapCell mapcell[] = new MapCell[30];

mapcell[0].gra = 1;
mapcell[0].event_flag = 0;
mapcell[0].move_flag = true;

mapcell[1].gra = 2;
mapcell[1].event_flag = 0;
mapcell[1].move_flag = false;
...
そして、マップデータの値からセルを選び出して、データを取り出すという作業をします。
int mapdata[][] = new int mapdata[64][48];
...(省略)

//描画部分
gra_data = mapcell[ mapdata[x][y] ].gra;
if(gra_data == 1){
	//草原の絵
}

...(省略)

//通行可能か
move_data = mapcell[ mapdata[x][y] ].move_flag;
if(move_data == false){
	//通れない
}
以上です。
例えば、同じ地面のグラフィックスでも「通れる地面」と「通れない地面」を作る場合は、セルを2つ分用意するようにします。

<データファイル>
map00.dat
map_chip.gif

<プログラム>

MapCell.java
1
2
3
4
5
6
7
8
9
10
11
class MapCell{
   int gra;//グラフィックデータ
   int event_flag;//イベントフラグ
   boolean move_flag;//通過可能フラグ

   MapCell(int a,int b,boolean c){
      gra=a;
      event_flag=b;
      move_flag=c;
   }
}

made by Cソース→HTML変換プログラム『道具箱』 ver12.1 はるキッチンソフト

Rpg05.java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
// RPG05 第五章 マップを作ろう
// 2004/07/10

import java.awt.*;
import java.awt.event.*;
import java.applet.*;
import java.io.*;
import java.net.URL;

public class Rpg05 extends Applet implements Runnable,KeyListener{
   Image buffer;//イメージバッファ
   Graphics bufferg;//バックバッファ
   
   final int CHIP_SIZE=32;//チップサイズ

   float FrameTime;//1フレームあたりの時間(秒)
   long waitTime;//現在時刻保存用

   Image ball_image;//ボールイメージ
   float ball_px,ball_py;//ボール座標
   float bl_speed;//ボールの速度

   //キーの状態(離している=0、押し続けている=1、押した瞬間=2)
   int key_states[] = new int[5];//4方向(上=0,下=1,左=2,右=3)+Zキー=4

   //マップデータ
   int map_data[][] = new int[64][64];//64×64
   int map_width,map_height;//マップの横幅、高さ(チップ数)
   Image map_image;//マップチップ画像
   
   //セルテーブル
   MapCell celltbl[] = {
      new MapCell(0,0,false),//草原
      new MapCell(1,0,true),//芝生A
      new MapCell(2,0,true),//芝生B
      new MapCell(3,0,false),//家
      new MapCell(4,0,false),//木A

      new MapCell(5,0,true),//木B
      new MapCell(6,1,true),//城
      new MapCell(7,2,true),//海
      new MapCell(8,3,true),//塔の上
      new MapCell(9,4,true),//塔の下

      new MapCell(10,0,true),//洞窟
      new MapCell(11,0,true),//岩山
      new MapCell(12,5,true),//宇宙A
      new MapCell(13,5,true),//宇宙B
      new MapCell(14,5,true),//クリスタル
   };

   //初期化
   public void init(){
      Thread t;
      Dimension d = getSize();
      MediaTracker mediaT = new MediaTracker(this);

      //ボール画像ロード
      ball_image = getImage(getDocumentBase(),"chara13.gif");
      mediaT.addImage(ball_image,0);
      
      //マップチップ画像ロード
      map_image = getImage(getDocumentBase(),"map_chip.gif");
      mediaT.addImage(map_image,0);

      //ロード待ち
      try{
         mediaT.waitForAll();
      }catch(InterruptedException e){}

      //マップデータロード(20×15サイズ)
      readData("map00.dat",20,15);

      ball_speed = 128;//ボールの速度。1秒で128ドット。

      //ボールの初期座標(マップ上で4,6の位置)
      ball_px = 4*32;
      ball_py = 6*32;

      //現在時刻保存
      waitTime=System.currentTimeMillis();

      addKeyListener(this);//キー入力リスナー
      requestFocus();//フォーカス取得

      //スレッドを開始する
      t = new Thread(this);
      t.start();

      //バッファを作成する
      buffer = createImage(d.width,d.height);
   }


   //マップデータを読み込む
    private void readData(String filename,int max_x,int max_y){
      int i,x,y;
      InputStream is = null;

      map_width = max_x;
      map_height = max_y;

      try{
         is = new URL(getDocumentBase(),filename).openStream();

         x=y=0;
         while((i=is.read()) != -1){
            map_data[x][y]=i;
            if(++x == map_width){
               ++y;
               x=0;

               if(y==map_width)break; //終了条件
            }
         }
         is.close();
      }catch(IOException e){}
    }

   //実行
   public void run(){
      try{
         //ここがゲームループ
         while(true){
            //1フレーム時間計算(秒)
            FrameTime = ( System.currentTimeMillis()-waitTime ) /1000.0f;
            waitTime = System.currentTimeMillis();

            action();//処理
            repaint();//描画

            //ちょっと休憩(0.01秒)
            Thread.sleep(10);
         }
      }
      catch(Exception e){
      }
   }
   
   //描画更新
   public void update(Graphics g){
      paint(g);
   }

   //描画
   public void paint(Graphics g){
      int i,j,x,y;
      int cell_data,gra;

      //バッファのグラフィックコンテキストを取得する
      if(bufferg == null){
         bufferg = buffer.getGraphics();
      }
      
      //バッファを描画する
      Dimension d = getSize();
      bufferg.setColor(Color.white);
      bufferg.fillRect(0,0,d.width,d.height);

      //マップ描画
      for(i=0;i<map_height;i++){
         for(j=0;j<map_width;j++){
            //セルデータ取得
            cell_data = map_data[j][i];

            //セルデータからマップグラフィックスを取得
            gra = celltbl[ cell_data ].gra;

            //マップチップからグラフィックスの位置を取得
            x = (gra%16)*32;
            y = (gra/16)*32;

            bufferg.drawImage(map_image,j*32,i*32,(j+1)*32,(i+1)*32,x,y,x+32,y+32,this);
         }
      }

      //ボール表示
      bufferg.drawImage(ball_image,(int)ball_px,(int)ball_py,this);

      //フォント
      bufferg.setColor(Color.black);
      bufferg.drawString("マップサイズ("+map_width+","+map_height+")。",10,20);
      bufferg.drawString("現在の座標は(" +(int)ball_px+ "," +(int)ball_py+ ")。",10,40);
      bufferg.drawString("現在のマップ上での位置は(" +(int)ball_px/32+ "," +(int)ball_py/32+ ")。",10,60);

      //ウインドウを更新する
      g.drawImage(buffer,0,0,this);
   }


   //処理
   public void action(){

      Dimension d = getSize();

      //移動処理

      //上
      if(key_states[0] == 1){
         ball_py -= FrameTime * ball_speed;
         //上端
         if(ball_py < 0){
            ball_py = 0;
         }
      }

      //下
      if(key_states[1] == 1){
         ball_py += FrameTime * ball_speed;
         //下端
         if(ball_py > d.height-CHIP_SIZE){
            ball_py = d.height-CHIP_SIZE;
         }
      }

      //左
      if(key_states[2] == 1){
         ball_px -= FrameTime * ball_speed;
         //左端
         if(ball_px < 0){
            ball_px = 0;
         }
      }

      //右
      if(key_states[3] == 1){
         ball_px += FrameTime * ball_speed;
         //右端
         if(ball_px > d.width-CHIP_SIZE){
            ball_px = d.width-CHIP_SIZE;
         }
      }

      //Zキーを押した時
      if(key_states[4] == 2){
         //キーの状態を押し続けに変更。
         key_states[4] = 1;
      }
   }

   //キーが押された瞬間(使わない)
   public void keyTyped(KeyEvent e){
   }

   //キーを押している時
   public void keyPressed(KeyEvent e){
      int key;

      key=e.getKeyCode();

      switch(key){
      //上キー
      case KeyEvent.VK_UP:
         key_states[0] = 1;
         break;
      //下キー
      case KeyEvent.VK_DOWN:
         key_states[1] = 1;
         break;
      //左キー
      case KeyEvent.VK_LEFT:
         key_states[2] = 1;
         break;
      //右キー
      case KeyEvent.VK_RIGHT:
         key_states[3] = 1;
         break;
      //Zキー
      case KeyEvent.VK_Z:
         //最初に押した時に2を入れる
         if(key_states[4] == 0){
            key_states[4] = 2;
         }
         break;
      }
   }

   //キーが放された瞬間
   public void keyReleased(KeyEvent e){
      int key;

      key=e.getKeyCode();

      switch(key){
      //上キー
      case KeyEvent.VK_UP:
         key_states[0] = 0;
         break;
      //下キー
      case KeyEvent.VK_DOWN:
         key_states[1] = 0;
         break;
      //左キー
      case KeyEvent.VK_LEFT:
         key_states[2] = 0;
         break;
      //右キー
      case KeyEvent.VK_RIGHT:
         key_states[3] = 0;
         break;
      //Zキー
      case KeyEvent.VK_Z:
         key_states[4] = 0;
         break;
      }

   }
}