Mapchip を並べて背景画像を表示



Mapchip の Index 番号を配列で定義して、背景画像を表示します。

前田稔の超初心者のプログラム入門

プログラムの作成

  1. 2012/9 Windows Vista 以降のOSで、Java Applet で swing を使うと何故かキーの取得が出来ません。 (^_^;)
    そこで swing の使用を止めて AWT で作成したプログラムに組み替えます。
    漢字変換を OFF にして、ウインドウ上でクリックしてから操作して下さい。
  2. メモ帳などでタイプして rpgmap.java の名前で保存して下さい。
    Applet はサーバーにアップロードすることが前提なので、ファイル名やクラス名を小文字で統一しています。
    //★ Mapchip を並べて背景画像を表示    前田 稔
    //   appletviewer rpgmap.htm
    import java.applet.*;
    import java.awt.*;
    import java.io.*;
    import javax.imageio.ImageIO;
    import java.net.URL;
    import java.util.*;
    
    public class rpgmap extends Applet
    {   card    obj;
        // 20, 24,  16, 16,  Mapのサイズ(縦の並びと横の並び), Mapchipの幅と高さ
        int     TT[][] =
    { { 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 40, 8, 9, 8, 9, 41, 2, 2, 2, 2, 52, 53, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 12, 6, 4, 4, 4, 43, 2, 2, 2, 2, 72, 73, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 32, 26, 56, 57, 4, 64, 65, 66, 41, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 12, 28, 76, 77, 4, 4, 4, 4, 15, 2, 2, 2, 52, 53, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 62, 30, 30, 50, 51, 4, 4, 4, 35, 2, 2, 2, 72, 73, 2, 2, 2, 52, 53, 2, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 71, 4, 4, 4, 15, 2, 2, 2, 2, 2, 2, 2, 2, 72, 73, 2, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 12, 4, 58, 59, 35, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 40, 66, 66, 67, 4, 78, 79, 64, 65, 8, 9, 8, 9, 9, 41, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 12, 25, 6, 7, 4, 4, 5, 24, 25, 4, 4, 4, 4, 4, 43, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 12, 28, 26, 27, 4, 58, 59, 5, 6, 7, 58, 59, 4, 4, 43, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 62, 30, 50, 51, 24, 78, 79, 25, 26, 27, 78, 79, 4, 4, 64, 9, 9, 41, 2, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 71, 4, 4, 4, 4, 4, 48, 49, 30, 50, 51, 56, 57, 4, 35, 2, 2, 2 }, 
      { 2, 54, 55, 2, 2, 2, 42, 4, 4, 56, 57, 4, 68, 69, 2, 2, 71, 76, 77, 4, 43, 2, 2, 2 }, 
      { 2, 74, 75, 2, 2, 2, 62, 50, 51, 76, 77, 4, 43, 2, 2, 2, 62, 30, 30, 31, 63, 2, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 2, 2, 71, 4, 4, 4, 43, 2, 54, 55, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 2, 54, 55, 2, 2, 62, 30, 30, 31, 63, 2, 74, 75, 2, 2, 2, 2, 2, 2, 2, 2 }, 
      { 2, 2, 2, 2, 74, 75, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 54, 55, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 74, 75, 2, 2 }, 
      { 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 3, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 } };
    
        // Initialize
        public void init()
        {   obj = new card(getCodeBase().toString() + "chip.gif",16,16);
            setBackground(Color.gray);
        }
    
        // Paint Method
        public void paint(Graphics g)
        {   for(int i=0; i<20; i++)
                for(int j=0; j<24; j++)
                    obj.View(g,TT[i][j], j*16+20,i*16+20);
        }
    }
    
    //★ 画像を切り分ける class card は Java Applet カードゲームと同じです。
    class card extends JApplet
    {   private Image   Img;            // CARD Image
          ・・・
    }
    
  3. Java Applet を起動する HTML ファイルです。
    <html>
      <body>
        <h3>Mapchip を並べて背景画像を表示</h3>
        <applet code="rpgmap.class" width="440" height="400">
        </applet>
      </body>
    </html>
    
  4. プロジェクトのフォルダーに MapChip の画像ファイル(chip.gif)を格納して下さい。
    chip.gif は 32*32 の Sprite が2段10列に並んだ画像ですが、今回は 16*16 のサイズに設定して4段20列で処理します。
    インターネットブラウザを起動して HTML ファイルを表示して下さい。
    Sprite(Mapchip)を組み合わせた背景画像が描画されたら完成です。

プログラムの説明

  1. Applet のプログラムは java.applet.* を import して、extends(クラスの継承) で Applet を指定して下さい。
    Java ウインドウ操作用の API を使用するので java.awt.* をインポートします。
    ImageIO で画像を入力するので java.io.*, javax.imageio.ImageIO, java.net.URL をインポートします。
    card obj; は card object class の領域です。
    card object class の説明は カードの画像を切り分けて描画する を参照して下さい。
    TT[][] は Mapchip の並び情報(Index 番号)を配列で定義しています。
        import java.applet.*;
        import java.awt.*;
        import java.io.*;
        import javax.imageio.ImageIO;
        import java.net.URL;
        import java.util.*;
    
        public class rpgmap extends Applet
        {   card    obj;
            // 20, 24,  16, 16,  Mapのサイズ(縦の並びと横の並び), Mapchipの幅と高さ
            int     TT[][] =
        { { 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 }, 
              ・・・
          { 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 3, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2 } };
        
  2. init() はアプレットの初期化を行うメソッドです。
    new card() で card class をインスタンス化します。
    Java Applet の動作環境では、ローカルフォルダーはセキュリティで保護されています。
    一般的に画像は、アプレットのディレクトリ(CodeBase または DocumentBase)から入力します。
    getCodeBase() で URL を取得して "chip.gif" と結合してパラメータで渡します。
    16, 16 はマップチップ一枚分の幅と高さです。
    背景色を gray に設定しています。
        // Initialize
        public void init()
        {   obj = new card(getCodeBase().toString() + "chip.gif",16,16);
            setBackground(Color.gray);
        }
        
  3. インデックスを定義した配列 TT[20][24] に従って、背景画像を描画します。
        // Paint Method
        public void paint(Graphics g)
        {   for(int i=0; i<20; i++)
                for(int j=0; j<24; j++)
                    obj.View(g,TT[i][j], j*16+20,i*16+20);
        }
        

Java Game Program