ひろひろの生活日記(LIFE Of HIROHIRO)

パソコン講習とソフト開発をしています。自作小説も掲載しています。ネット情報発信基地(上野博隆)Hirotaka Ueno

ブロック崩しのコーディング(1)

2020年06月06日 16時21分45秒 | ゲーム開発(Game development)

ブロック崩しのコーディング(1)

コーディングの途中経過(Java Script)です。

ーーーーーーー


function sgn(a) {
    if(a > 0) return(1); else return(-1);

WIDTH  = 640;
HEIGHT = 480;
// white, red, yellow, green, blue
var colortable = ["red","yellow","green"];
var username = ["ipad","iphone","android"];         //端末の名前

var br = 10;       // ボールの半径
var paddlew = 96;      // パドルの幅
var paddleh = 16;      // パドルの高さ
var blockw = 48;       // ブロックの幅
var blockh = 24;       // ブロックの高さ
var blocks = [];
var blocksu = 50;
var endflag = 0;       // 処理の終わりを判定する
var paddlex = 0;       // パドルのx座標
var paddley = 0;       // パドルのy座標

// ブロックスに配列要素にプロパティを付与する。
function bkock() {
    this.id = -1;
    this.x = 0;
    this.y = 0;
    this.color = 0;
}


// 初期処理
function init(){
    canvas = document.getElementById('world');
    canvas.width = WIDTH;
    canvas.height = HEIGHT;
    ctx = canvas.getContext('2d');
    ctx.font = "64px 'MS Pゴシック'";
    user = window.navigator.userAgent.toLowerCase();
    for(i=0; i
        if(user.indexOf(username[i]) > 0)break;
    }
    if(i
        document.addEventListener("touchmove", touchmove);
    }else{
        document.addEventListener("mousemove", mousemove);
    }
// ブロックスを定義する。
    blocks = new Array(blocksu);
    for(i=0; i
        blocks[i] = new block();
        }
    }
    for(i=0; i
        blocks[i].id = 1;
        blocks[i].x = (i % 10) * (blockw + 4) + 64;
        blocks[i].y = Math.floor(i / 10) * (blockh + 4) + 64;
        blocks[i].color = Math.floor(blocks[i].y / 28) % 3;
    }
}


//スマホ/タブレットのタッチイベントで起動する関数
function touchmove(e){
    if  (e.targetTouches.length == 1){
        touch = e.targetTouches[0];
        touchpice(touch.pageX ,touch.pageY);
    }
}

//pcのマウスクリックイベントで起動する関数
function mousemove(e){
    touchpice(e.clientX ,e.clientY);
}

//引数で指定した位置にある駒の移動処理(※変更前です)
function touchpice(tx,ty){
    element = document.getElementById("idselect");
    if(element.value != turn) return;          //相手の番の場合は無効
    cx = Math.floor((tx-8)/psize);
    cy = Math.floor((ty-8)/psize);
    if(isinside(cx,cy,0,0,bw,bh)==false)return;          //将棋盤バッファ外なら処理を終了
    if(startx == -1){
        movestart(cx,cy);          //移動開始
    }else{
        moveend(cx,cy);          //指定したマスに駒を移動させる
        startx = -1;
        redraw();          //将棋盤バッファのデータに基づいて画面を再描画
    }
}

function main() {
    while(endflag == 0) {
        ballx = WIDTH / 2;      // ボールのx座標
        bally = HEIGHT - 170;   // ボールのy座標
        bx1 = 2;                // ボールの速度(x成分)
        by1 = -2.5;             // ボールの速度(y成分)
        x = WIDTH / 2;          // パドルの位置(x座標)
        y = HEIGHT - 64;        // パドルの位置(y座標)
        paddlex = x - (paddlew / 2);
        paddley = y - (paddleh / 2);

        for(i=0; i
            blocks[i].id = 1;
            blocks[i].x = (i % 10) * (blockw + 4) + 64;
            blocks[i].y = Math.floor(i / 10) * (blockh + 4) + 64;
            blocks[i].color = Math.floor(blocks[i].y / 28) % 3;
        }
        gameover = 0;
        while(endflag == 0){
            //キーコード取得しパドルの位置を移動させる。← →
            x = paddlex;
      k = event.keyCode;
            if(k==100) x -= 8; if(k==102) x += 8;
            //パドルがゲーム画面内ならパドルの位置を変更する
            if( (x >= (paddlew / 2)) && (x <= (WIDTH - (paddlew / 2))){
                paddlex = x;
            }
            //ボールの速度と位置の変更
            x = ballx + bx1;
            y = bally + by1;
            //ボールが左右の壁に当たるとxの速度を反転する
            if( (x < br) || (x > (WIDTH - br ) bx1 = -bx1;
            //ボールが天井にあたるとyの速度を反転する
            if( y
            //ボールが底にあたるとゲームオーバー
            if( y > HEIGHT ) gameover += 1;
            //パドルとボールとの距離の差を計算する
            dx = paddlex -x;
            dy = paddley -y;
//つづく(2)
            //ゼロ割を回避するための処理
            if(dy == 0) dy = 1;
            //パドルとボールが当たっているかの判断
            if((Math.abs(dx) < (paddlew / 2 + br)) && (Math.abs(dy) < (paddleh / 2 + br)
            {
                //角度により反射を判定
                if(Math.abs(dx / dy) > (paddlew / paddleh)){
                    bx1 = -bx1;
                    ballx = paddlex - sgn(dx) * (paddlew / 2 + br);
                } else {
                    bx1 = -dx / 10;
                    by1 = -by1;
                    bally = paddley - sgn(dy) * (paddleh / 2 + br);
                }
            }
            //ブロックとボールが当たった時の処理
            for(i=0; i
                dx = blocks[i].x - x;
                dy = blocks[i].y - y;
            //ゼロ割を回避するための処理
            if(dy == 0) dy = 1;
            //ブロックとボールが当たっているかの判断
            if((Math.abs(dx) < (blockw / 2 + br)) && (Math.abs(dy) < (blockh / 2 + br)
            {
                //角度により反射を判定
                if(Math.abs(dx / dy) > (blockw / blockh)){
                    bx1 = -bx1;
                    ballx = blocks[i].x - sgn(dx) * (blockw / 2 + br);
                } else {
                    by1 = -by1;
                    bally = blocks[i].y - sgn(dy) * (blockh / 2 + br);
                }
                blocks[i].id = 0;
                break;
            }
            ballx += bx1;
            bally += by1;
//つづく(描画処理)
            blockdraw();
            paddledraw();
            balldraw();
            if(gameover > 0){
                gemeoverdraw();
                if(gameover > 200) break;
            }
            //クロックの処理
        }
    }
}
//描画ファンクションのコーディング
//つづく
// ブロックの描画
function blockdraw() {

    for (i=0; i
        if(blocks[i].id == 1) {
            wkcolor = blocks[i].color;
            wkx = blocks[i].x;
            wky = blocks[i].y;
            ctx.fillStyle = colortable[wkcolor];
            ctx.fillRect(wkx, wky, blockw, blockh);
        }
    }
}
// パドルの描画
function paddledraw() {
     ctx.fillRect(paddlex, paddley, paddlew, paddleh);
}
// ボールの描画
function balldraw() {
     wkx = Math.floor(ballx);
     wky = Math.floor(bally);
     ctx.fillStyle = "white";
     ctx.arc(wkx,wky,br,0*Math.PI,2*Math.PI);
     ctx.fill();
}
// ゲームオーバーの表示
function gameoverdraw(){
    ctx.font = "64px 'MS Pゴシック'";
    ctx.fillStyle = "white";
    ctx.fillText("GAME OVER",180,300); 
}

 

 


コメント    この記事についてブログを書く
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする
« ABEMプレミアム登録してもうた。 | トップ | ブロック崩しのレビュー »
最新の画像もっと見る

コメントを投稿

ブログ作成者から承認されるまでコメントは反映されません。

ゲーム開発(Game development)」カテゴリの最新記事