STEP1.基本的な考え方
背景のスクロール方法としては、次の2案があると思います。
1)背景を配列により定義しておき、スクロール毎に表示部分を変えていく。
2)背景をあらかじめ作っておき、その中で自分の周囲のみ切り取って表示する。
この2つは基本的にはどちらでも動きますが、今回のような背景のデータが小さい場合は、2)の方が楽ですのでお勧めです。
|
|
STEP2.イメージの初期化
イメージ領域 |
maingrap |
迷路イメージ |
gc2 |
迷路イメージ(maingrap)に車などを書き込む為のイメージ領域 |
workgrap |
ゲーム画面全体 |
gc |
画面表示用 |
コード上では以下の様になっています。
Graphics maingrap;
Graphics workgrap;
Graphics gc2;
初期化ファイル内でグラフィックを定義します。
public void initialize(){
ura=createImage(445,528);
gc2=ura.getGraphics();
ura2=createImage(445,528);
workgrap=ura2.getGraphics();
MainImage=createImage(445,528);
maingrap=MainImage.getGraphics();
}
|
|
STEP3.背景準備
2次元配列back_pattanを定義し、backクラスを生成し、迷路パターンを写し取る。
これを使ってmaingrapに迷路全体のグラフィックを作成します。
迷路の配列 |
back_pattan |
迷路の配列 |
back[][] |
迷路の背景クラス(back) |
back_pattanは長いので、ソースをダウンロードして確認してください。
迷路の配列を初期化します。
back = new Back[NUMBER_OF_X][NUMBER_OF_Y];
迷路イメージを作成します。このイメージは1度だけ作成しており、後はこれをgc2にコピーし、
自分や敵の車を書き込みます。
【maingrapの作成】
maingrap.setColor(new Color(0,0,0)); //黒で背景をクリアしています。
maingrap.fillRect(0,0,445,528);
for(int j=0; j < NUMBER_OF_Y; j++){
for(int i=0; i < NUMBER_OF_X; i++){
int px_back = (int) (i*WIDTH_OF_BACK);
int py_back = (int) (j*HEIGHT_OF_BACK);
back[i][j] = new Back(back_pattan[i][j],px_back, py_back,this);
maingrap.drawImage(BackImage[back[i][j].getBack()],
i*WIDTH_OF_BACK,j*HEIGHT_OF_BACK,this);
}
}
|
|
STEP4.背景準備
迷路の配列 |
mycar_x |
自分の車の配列上のX位置 |
mycar_y |
自分の車の配列上のY位置 |
mycar_pvx |
X方向の位置(WIDTH_OF_BACKで0に戻る) |
mycar_pvy |
Y方向の位置(HEIGHT_OF_BACKで0に戻る |
WIDTH_OF_BACK |
背景の幅 |
HEIGHT_OF_BACK |
背景の高さ |
先ほど作った背景画面maingrap(イメージ領域:MainImage)を
イメージ領域ura(gc2)にコピーします。
gc2.drawImage(MainImage,0,0,this);
あとは、このgc2に、敵の車などを描画します。
public void paint(Graphics gc)の中で、自分の周囲の9こま分の画像をgc2から切り出し、
描画窓として、workgrap に貼り付ける処理を行います。
int vew_x=(mycar_x-4)*WIDTH_OF_BACK+mycar_pvx;
int vew_y=(mycar_y-4)*HEIGHT_OF_BACK+mycar_pvy;
workgrap.drawImage(ura, 0,0,288,288, vew_x,vew_y,vew_x+144,vew_y+144,this);
これにより、自分のキャラクタがスクロール画面を自由に移動している様に見えます。
最後に実際の表示を行います。
gc.drawImage(ura2, 0, 0, this);
|
といった感じです。かなりはしょって書きましたが、プログラムソースと見比べてみるとわかってくると思います。 |
|