Błędny rycerz – Zadanie

Błędny rycerz

Figurki
Janek uwielbia bawić się małymi figurami żołnierzy, rycerzy. Całymi godzinami ustawia je i bawi się w parady, rozgrywa starożytne bitwy, organizuje przemarsze.

Rycerze
Jego największą pasją są rycerze. Pędzący rycerze! Uwielbia obserwować jak poruszają się wzdłuż podłogi.

Remont
Niestety w domu jest remont i  Janek nie może już bawić się figurkami  na podłodze. Dlatego poprosił Ciebie o napisanie programu który będzie symulował pędzącego przez ekran rycerza. To nawet większy fan niż figurki na podłodze!

Twoja rola
Twoim zadaniem jest napisanie animacje w której kwadrat albo kółko (to właśnie błędny rycerz) pędzi przez ekran. Z góry na dół czy z lewej strony w prawą, czy po skosie – jak chcesz.
Chodzi o to by sprawić trochę radości młodszemu bratu!
Powodzenia!

Autor: Daniel Olkowski

 

Liczba komentarzy: 2

  • Jerzyku

    #plansza {
    background-color: green;
    } //lightblue

    Animacja

    //Dowolny program w JavaScript ktory przeglarka wykona
    let plansza_gry, rysowanie;
    let X = -10;
    plansza_gry = document.getElementById(“plansza”);
    rysowanie = plansza_gry.getContext(“2d”);

    function Animacja() {
    rysowanie.clearRect(0, 0, 400, 200);

    rysowanie.beginPath();
    rysowanie.fillStyle = “purple”;
    rysowanie.arc( X , 80, 10, 0, 2*Math.PI);
    rysowanie.lineTo( X-10 , 90);
    rysowanie.lineTo( X-10 , 110);
    rysowanie.lineTo( X+10 , 110);
    rysowanie.lineTo( X+10 , 90);
    rysowanie.lineTo( X+20 , 90);
    rysowanie.fill();
    rysowanie.closePath();

    //rysowanie.beginPath();
    //rysowanie.fillStyle = “red”;
    //rysowanie.arc( X , 90, 10, 0, 2*Math.PI);
    //rysowanie.fill();
    //rysowanie.closePath();

    if( X >= 450) {
    X = -10
    }

    X = X + 2
    }
    setInterval (Animacja, 10);

  • Norri_pl

    #plansza {
    background-color: black;
    }

    Animacja

    let plansza_gry, rysowanie;
    let temp;
    let niebieska_kulka_srodek_x = 50;
    let niebieska_kulka_predkosc_x = 5;

    plansza_gry = document.getElementById(“plansza”);
    rysowanie = plansza_gry.getContext(“2d”);

    function AnimacjaDwaKolka() {
    rysowanie.clearRect(0, 0, 400, 200);

    rysowanie.beginPath();
    rysowanie.fillStyle = “green”;
    // rysowanie.arc(niebieska_kulka_srodek_x, 100, 10, 0, 2*Math.PI);
    rysowanie.fillRect(niebieska_kulka_srodek_x, 90, 30, 30);
    rysowanie.fill();
    rysowanie.closePath();

    niebieska_kulka_srodek_x = niebieska_kulka_srodek_x + niebieska_kulka_predkosc_x;

    if (niebieska_kulka_srodek_x 370) {
    niebieska_kulka_predkosc_x = -1 * Math.abs (niebieska_kulka_predkosc_x);
    }
    }
    setInterval (AnimacjaDwaKolka, 10);

Dodaj komentarz