マップを操作するには?


このイメージマップは、既に用意したint配列を元に描画をするわけですが、このint配列の内容は、別に固定されているわけではありません。後で配列の中身を書き換えてやれば、表示されるマップを変えることもできます。

では、先ほどのサンプルを修正して、上下左右キーと確定キーを使って、マップを自由に変えられるようにしてみましょう。

class MainCanvas extends Canvas {
  private int[] data;
  private ImageMap map;
  private int x,y,num;
  
  private static final int MAP_COLS = 7;
  private static final String[] MAP_NAME =
    new String[]{"平地","荒地","河川","道路"};

  MainCanvas() {
    setSoftLabel(SOFT_KEY_1, MAP_NAME[0]);
    setSoftLabel(SOFT_KEY_2, "END");
    setBackground(Graphics.getColorOfName(Graphics.WHITE));
    x = 3;
    y = 3;
    data = new int[]{
        2,2,2,2,3,0,0,
        2,2,3,3,3,3,3,
        2,2,3,0,0,0,1,
        2,0,3,0,0,1,1,
        0,0,3,0,1,1,1,
        0,0,3,0,1,1,1,
        0,0,3,0,0,1,1
    };
    try {
      MediaImage mi =MediaManager.getImage("resource:///images.gif");
      mi.use();
      Image img = mi.getImage();
      Image[] arr = new Image[]{img};
      map = new ImageMap(25,25,7,7,data,arr,true);
    }catch(Exception e){}
  }

  public void paint(Graphics g) {
    int dx = 10;
    int dy = 10;
    int w = 25;
    int h = 25;
    g.lock();
    g.clearRect(0, 0,Display.getWidth(), Display.getHeight());
    g.drawImageMap(map,10,10);
    g.setColor(Graphics.getColorOfName(Graphics.RED));
    g.drawRect(dx + x * w,dy + y * h,w,h);
    g.unlock(true);
  }

  public void processEvent(int type, int param) {
    switch(type){
    case Display.KEY_PRESSED_EVENT:
      switch(param){
      case Display.KEY_UP:
        y--; break;
      case Display.KEY_DOWN:
        y++; break;
      case Display.KEY_LEFT:
        x--; break;
      case Display.KEY_RIGHT:
        x++; break;
      case Display.KEY_SELECT:
        data[x + y * MAP_COLS] = num;
        break;
      }
      if (x < 0){ x = 0; }
      if (y < 0){ y = 0; }
      if (x > 6){ x = 6; }
      if (y > 6){ y = 6; }
      repaint();
      break;
    case Display.KEY_RELEASED_EVENT:
      switch(param){
      case Display.KEY_SOFT1:
        num = (num + 1) % 4;
        setSoftLabel(SOFT_KEY_1,MAP_NAME[num]);
        repaint();
        break;
      case Display.KEY_SOFT2:
        (IApplication.getCurrentApp()).terminate();
        break;
      }
      break;
    }
  }

}

ソフトキー1で表示するマップを変更し、上下左右キーで移動して確定キーでマップを変える。

このiアプリでは、現在の場所を示す赤い枠線が表示されます。上下左右のキーでこれを動かし、確定キーを押すと、現在ソフトキー1に現在表示されているマップに変更されます。ソフトキー1を押せば、現在のマップは「平地」「荒地」「河川」「道路」と切り替わります。processEvent部分を見てください。

switch(param){
case Display.KEY_UP:
  y--; break;
case Display.KEY_DOWN:
  y++; break;
case Display.KEY_LEFT:
  x--; break;
case Display.KEY_RIGHT:
  x++; break;
case Display.KEY_SELECT:
  data[x + y * MAP_COLS] = num;
  break;
}

こんな具合にして、現在の位置を示すx,yの値を変更し、int配列からその場所の値を変更しています。配列の中から、指定された位置の値を取り出すには、

横の位置+縦の位置×横の個数

このように計算をします。これで、その場所のマップに関するデータを配列から取り出し、変更できます。後からマップを自由に操作できると、イメージマップの利用範囲もぐっと広まりますね。



【編集部からのお知らせ】
All Aboutで家計に関するアンケートを実施中です!(抽選でAmazonギフト券1000円分を3名様にプレゼント)
アンケートはコチラのリンクから回答をお願いいたします(回答期限は2020年9月29日まで)

※記事内容は執筆時点のものです。最新の内容をご確認ください。
※OSやアプリ、ソフトのバージョンによっては画面表示、操作方法が異なる可能性があります。