5 Mart 2016 Cumartesi

Kurtul Oyunu (Html5)

  Bu yazımda pekiştirmek ve pratik yapmak için yazdığım ikinci oyunumu tanıtacağım.Bu oyunun yapımında da html5-JavaScript-JQuery kodlarını kullandım. Kısaca karakterimiz olan bir top nesnesi ile üzerimize gelen basamaklar dediğim çubuklardan kurtularak oyun alanının üzerine çıkmaya çalışıyoruz.

  Oyunumuzun görüntüsü şu şekildedir.

  Bu oyunları yazmamım en büyük nedenleri analitik düşünme ve algoritma kurma becerilerimi geliştirmektir. Topun duvarlar ile çarpışması veya basamaklar ile çarpışmaları olsun , basamakların uzunlukları ve çıktıkları konumları olsun bunların ayarlanması gerçekten ufkunuzu açıyor.

Örneğin basamakların ilk oluşturulduğu kod parçası şu şekildedir.

function basamaklariOlustur() {
    var indis;
    var x, en;
    var y = 0;
    for (indis = 0; indis <= basamakSayisi; indis++) {

        do {
            x = 10 + Math.random() * 300;
            en = 75 + Math.random() * 200;
        } while (x + en > alanG - 10);// konumu + eni sağdan fazla olmamasını sağlıyoruz

        //2 ve 3 katlarında köşelerden çıkmayı garanti ediyoruz
        if ((indis % 2) == 0 && !(x > 10 && x < karakterBoyutu - 2)) {
            do {
                x = 10 + Math.random() * 300;
            } while (!(10 < x && x < karakterBoyutu - 2));// 

        } else if ((indis % 3) == 0 && !(x + en > alanG - karakterBoyutu - 8 && x + en < alanG - 10)) {
            do {
                x = 10 + Math.random() * 300;
                en = 75 + Math.random() * 200;
            } while (!(x + en > alanG - karakterBoyutu - 8 && x + en < alanG - 10));// 

        }

        y -= 70;//her basamak arasına uzaklık koyuyoruz
        basamaklar[indis] = new BasamakNesnesi(x, y, en, basamakBoyu);
    }
}

Karakterimizin hareket kodları şu şekildedir.


function karakterHareket() {
    if (btnSol) {
        karakter.x += -karakterHareketpx;
    } else if (btnSag) {
        karakter.x += +karakterHareketpx;
    }
    // soldan çıkmaz
    if (karakter.x < 10 && btnSol) {
        karakter.x = 10;
    }// sağdan çıkmaz
    else if (karakter.x > alanG - 10 - karakterBoyutu && btnSag) {
        karakter.x = alanG - 10 - karakterBoyutu;
    }
    carpismaKontrol();

}

Kodlara ulaşmak için github adresine gidin.