Animacije


V zanki rišimo predmet, pri katerem se koordinati x in y spreminjata. V animaciji uporabimo časovno funkcijo delay(interval).
Zaslon bomo brisali s funkcijo clearDrawing.

Poglejmo primer. Zamislimo si, da se nam bliža vesoljček.

  void main()
  {
     setColor(red);
     for(int i = 0 ; i < 50; i++)
     {
         fillCircle(150, i*5, 50);
         delay(0.1);
         clearDrawing();
     }
   }

Preskusi ta program tudi brez  clearDrawing() tako, da to vrstico zakomentiraš, kot kaže spodnji zgled:

     //clearDrawing();
 

Razlaga zgornje kode

  1. Nastavimo barvo risanja (temu rečemo tudi barva črnila).
  2. Izvedimo zanko 50 krat.
  3. Rišemo zapolnjen krog. Koordinata x bo nespremenjena (150 ), saj se naj vesoljček premika le navzdol, ne pa vodoravno ali poševno. Koordinato y pa v vsaki ponovitvi zanke spremenimo na  (i * 5):
    ko je i  = 0 , je y = i * 5 = 0 * 5 = 0 , zatem i povečamo za 1
    ko je i = 1 , je y = i * 5 = 1 * 5 = 5 , zatem i povečamo za 1
    ko je i = 2 , je y = i * 5 = 2 * 5 = 10 , zatem i povečamo za 1
    Tako se y v vsakem koraku povečuje za 5, dokler i ne doseže 49. Tedaj bo y enak 49 * 5 = 245 .
  4. Z metodo  delay(0.1) - vsakokrat ustavimo izvajanje programa za desetinko sekunde.
  5. clearDrawing() - počisti zaslon, tako da vidimo le sličico, ki smo jo narisali v trenutni iteraciji zanke

Animacije in število sličic na sekundo

Spremenimo lahko tudi čas prekinitve programa v vsaki ponovitvi zanke. Podatek v metodi delay je, podan v okroglem oklepaju, je čas prekinitve in  je podan kot racionalno število (double) in ne celo (int). Tako lahko povemo, koliki del sekunde naj traja prekinitev. 

Če podamo prekinitev za 0.1 sekunde, bomo imeli animacijo z 10 sličicami v sekundi. Video(PAL) uporablja 25 sličic na sekundo. 

Več sličic na sekundo imamo, bolj gladko teče animacija. Poskusi s prekinitvami 0.5 sekunde ( delay(0.50); ) in poglej, kako izgleda animacija. Ali je bolj sunkovita ali bolj gladka? Poskusi še z  delay(0.025). Izberi število slikic na sekundo, ki je najbolj primerno tvojemu računalniku in programu!

Še en način, kako  izboljšamo animacijo:


getDrawingHeight() vrne višino okna kot celoštevilčni podatek (int). Lahko bi žogo premikali, dokler ne doseže dna okna. Pri računanju koordinate y bi morali odšteti višino žoge, kajne? 

Neee , morda pa hočemo, da žoga odleti z okna. Zato najprej napravimo, da se žoga pomika, dokler y ne doseže višine okna. Pa poskusimo!

  
  void main() {              
int y = 0;      // iniciacija y              
int visinaOkna = getDrawingHeight();              
setColor(green);       // zelena zoga              
while(y < visinaOkna )         
   
{               
       fillCircle(150, y, 50);   // narisemo krog
 
       // V vsaki ponovitvi zanke povecamo y za 5 pikslov     
       y = y + 5;              
       
delay(0.1);              
       
clearDrawing();           
   
}       
}

nadaljevanje sledi ...