start     Articole     Despre mine    

Invata animatie pentru jocuri in lumini de discoteca

A sosit timpul sa trecem la o lectie foarte spectaculoasa. Iti voi arata aici cat de usor este sa faci o animatie pe calculator. Prin programare, desigur.

OK, dar care e treaba cu luminile de discoteca? Vei afla imediat!

Iti amintesti programul facut in lectia trecuta? Da, cel in care aprindeam in culori alese aleator fiecare dintre cele 10×10 puncte ale ecranului nostru virtual.

Asa cum unii dintre voi mi-ati marturisit, ati rulat programul de mai multe ori, fascinati de rezultatele obtinute. (Va avertizasem deja ca poate crea dependenta! 🙂 )

Ce-ar fi, insa, ca programul sa se ruleze singur, fara sa fie nevoie sa apesi butonul “Executa”?

 

Hai sa vedem cum am putea face ca aprinderea ecranului in culori alese aleator sa se faca in mod automat, o data pe secunda.

In primul rand va trebui ca intreg programul anterior sa il punem in corpul unei functii. (Pe care o putem denumi, de exemplu, FunctieDesenare).

Apoi va trebui ca in cadrul programului sa apelam functia predfinita StartAnimatie, careia ii vom da ca parametru numele functiei de desenare. Prin urmare, programul efectiv va consta in instructiunea StartAnimatie(FunctieDesenare).

Daca te-ai grabit sa testezi deja programul, ai observat cu siguranta ca nu merge. Ecranul se aprinde in culori alese aleator, insa ramane la fel si dupa o secunda, si dupa doua, si asa mai departe.

Motivul este acela ca functia StartAnimatie doar da un imbold animatiei, insa nu ii asigura si combustibilul pentru a o sustine in timp. Acest combustibil este asigurat prin apelul Animeaza(FunctieDesenare) chiar inainte de finalul functiei FunctieDesenare. Animeaza este o alta functie predefinita, care are rolul de a-i spune calculatorului sa apeleze din nou functia FunctieDesenare, dupa ceva timp.

Daca testam acum programul rezultat vom vedea deja rezultate. Si chiar te rog s-o faci. Caseta de testare o vei gasi ceva mai jos.

Ce parere ai? Animatia merge, nu-i asa? Lumini de discoteca avem, asa ca am putea considera lectia incheiata.

Dar cum facem sa controlam timpul? Am zis mai sus ca dorim sa schimbam continutul ecranului doar o data pe secunda.

Aici te ajuta functia predefinita TimpScurs. Ea primeste ca parametru un numar de milisecunde si returneaza 1 (adevarat) daca s-a scurs acel timp de la ultima desenare, sau 0 (fals) in caz contrar. (O milisecunda inseamna a mia parte dintr-o secunda. Ceea ce inseamna ca clasicul “O ora. 60 de minute. 3600 de secunde.” putea fi continuat cu “3600000 de milisecunde.“.)

Prin urmare, daca dorim ca redesenarea ecranului sa se faca doar atunci cand s-a scurs o secunda (adica 1000 de milisecunde) de la desenarea anterioara, va trebui ca in cadrul functiei FunctieDesenare desenarea sa o facem in corpul unui if in care testam conditia (TimpScurs(1000) == 1).

 

In continuare iata intregul program:

// PROGRAM LUMINI DE DISCOTECA

// definitie functie:

function FunctieDesenare()
{
  if (TimpScurs(1000))
  {
    var i;
    var j;

    i = 1;
    while (i<=10)
    {
      j = 1;
      while (j<=10)
      {
        AprindeNrCul(j, i, NrAleator(7));
        j = j+1;
      }
      i = i+1;
    }
  }

  Animeaza(FunctieDesenare);
}

// start program:

StartAnimatie(FunctieDesenare);

 

Si iata si caseta de testare:

(Browserul tau nu suporta Canvas!…)

(Poti opri programul apasand butonul “Reseteaza”.)

 

Poate nu realizezi inca, dar ti-am dat in aceasta lectie o mina de aur. Tie iti ramane, insa, munca de a sapa in ea pentru a scoate la iveala aurul (sub forma a diverse animatii sau joculete interesante). Pentru inceput, un mic exercitiu: cum ai face ca redesenarea ecranului sa se faca mai rapid (de exemplu, de 4 ori pe secunda)?

 

Daca exista ceva ce nu ai inteles din acest articol, atunci iti recomand cu caldura cartea Cum programezi un joc de la zero, pe care o poti cumpara in format electronic de aici. In plus, eu sunt aici si imi face placere sa raspund intrebarilor tale.





Loading Facebook Comments ...

No Trackbacks.