KREIRANJE ANIMACIJE KOSOG HICA U PROCESSING-U
U prethodnim člancima je pokazana animacija kretanja lopte u horizontalnoj ravni, ali se lopta kretala samo po pravoj liniji menjajući x i y koordinatu. U nastavku će biti opisano kako se može uvesti gravitacija, kao PVector objekat, koja utiče na kretanje lopte, tako da njeno kretanje odgovara situaciji u prirodi. Na taj način lopta(krug) se može opisati putanju slobodnog pada, horizontalnog, vertikalnog ili kosog hica. U narednim primerima mora se uzeti u obzir da koordinatni sistem za iscrtavanje oblika nije baš kao u prirodi sa Y osom usmerenom naviše, već je pozitivan smer Y ose na dole. Zbog toga će se smer vektora gravitacije posmatrati kao da je suprotnog smera, dakle biće pomnožen sa (-1). Druga stvar koju treba uzeti u obzir je ta da granice koju animacija pokazuje kao stanje u prirodi neće biti prikazane u metrima nego u pikselima i da vrednosti širine i visine okvira u kojem se animacija odigrava neće biti one iz "prirode", tako da treba uvest razmeru. Npr. ako se želi prikazati animacija koja bi u prirodi bila širine 10m, a širina okvira je npr. 400px, onda treba uvesti razmeru 40(px/m).
Animacija slobodnog pada u processing-u
Video-tutorijal
Nastavićemo kreiranje animacije od prethodno uraćenog primera "HorizontalnoKretanjeLopte".(vidi stranu Osnove processinga sa Javom ); Animacija bi trebala da izgleda kao što se vidi u nastavku:
Izmenićemo malo klasu Lopta tako što ćemo uvesti vektore(PVector) za ubrzanje i brzinu, a postojeće koordinate xC, yC zameniti takođe vektorom koji pokazuje na centar lopte i predstavlja njen položaj u XOY ravni.
float r;//geometrijska koo
PVector polozaj;
PVector v;
PVector g;
PVector polozaj;
PVector v;
PVector g;
uvedena je i promenljiva koja predstavlja poluprečnik lopte u px.
Konstuktor klase Lopta, kao parametre prima vrednost poupre;nika i x i y koordinate centra lopte. Unutar konstruktora kreira se vektor položaja lopte na osnovu tih koordinata i inicijalizuje vrednost atributa r:
Konstuktor klase Lopta, kao parametre prima vrednost poupre;nika i x i y koordinate centra lopte. Unutar konstruktora kreira se vektor položaja lopte na osnovu tih koordinata i inicijalizuje vrednost atributa r:
public Lopta(float r, float x,float y)
{
{
this.r=r;
polozaj=new PVector(x,y);
g=new PVector(0,G);
}polozaj=new PVector(x,y);
g=new PVector(0,G);
vektor gravitacionog ubrzanja g bi trebalo da ima za y komponentu definisanu G=9.81 sa znakom minus, ali zbog okrenutog koordinatnog sistema( pozitvno y je na dole) ima pozitivnu vrednost što je već pomenuto na početku stranice. Konstanta G će biti definisana unutar glavnog skeča kao globalna promenljiva.
Metoda kretanje takođe će biti izmenjena tako da sada uzima u obzir uticaj ubrzanja:
Metoda kretanje takođe će biti izmenjena tako da sada uzima u obzir uticaj ubrzanja:
public void kretanje()
{
{
PVector a=PVector.div(g,frameRate);
v.add(a);
PVector dv=PVector.mult(v,RAZMERA);
polozaj.add(dv);
}v.add(a);
PVector dv=PVector.mult(v,RAZMERA);
polozaj.add(dv);
Prvo se kreira vektor ubrzanja tako što se vektor gravitacionog ubrzanja podeli sa brojem poziva draw metode u sekundi tj. sa frameRate promenljivom. upotrebljena je div metoda klase PVector da bi se zadržao vektor g originalnim(više o vektorima pročitajte u članku Vektori u Processing-u).
Uticaj ubrzanja je ostvaren vektorskim dodavanjem istog na vektor brzine v, ali je prethodno vektor ubrzanja pomnožen skalarno sa razmerom(opisano na početku članka) upotrebom mult metode klase PVector.
Obe promenljive frameRate i RAZMERA su definisani u glavnom skeču kao globalne, tako da su dostupne i unutar ove klase.
Uticaj ubrzanja je ostvaren vektorskim dodavanjem istog na vektor brzine v, ali je prethodno vektor ubrzanja pomnožen skalarno sa razmerom(opisano na početku članka) upotrebom mult metode klase PVector.
Obe promenljive frameRate i RAZMERA su definisani u glavnom skeču kao globalne, tako da su dostupne i unutar ove klase.
Iscrtavanje lopte koje je ranije bilo u draw metodi glavnog skeča se prebacuje u render metodu:
public void kretanje()
{
{
fill(255,0,0);
ellipseMode(CENTER);
ellipse(polozaj.x,polozaj.y,2*r,2*r);
}ellipseMode(CENTER);
ellipse(polozaj.x,polozaj.y,2*r,2*r);
Ovde se može uočiti da će boja lopte biti crvena, da je mod za iscrtavanje elipse(kruga) takav da koordinate u pozivu metode koja iscrtava krug(ellipse) predstavljaju centar kruga. Takođe treba uočiti da se sada za koordinate položaja koristi PVector objekat(polozaj).
Metoda koja proverava granične uslove je takođe izmenjena tako da sada koristi uvedene vektore brzine i položaja:
public void granicniUslovi()
{
{
if(v.y>0 && height-polozaj.y < r){
/*Uslov da se zaustavi*/
if(abs(v.y) < 0.3 && height-polozaj.y-r < -5)
{
}
v.y *= -0.8;//gubitak energije
}/*Uslov da se zaustavi*/
if(abs(v.y) < 0.3 && height-polozaj.y-r < -5)
{
noLoop();
}Prvi uslov koji se proverava je to da li je lopta stigla do zemlje i ako jeste treba da se promeni pravac brzine i nešto umanji intenzitet(množenje sa 0.8) zbog gubitaka energije pri udaru o tlo. Vrednost 0.8 je uzeta proizvoljno. Dodatni uslov proverava da li je smer brzine na dole jer se pri udaru pravac menja na gore, a može se desiti da u prvoj sledećoj iteraciji vrednost visine još uvek bude negativna. To bi neželjeno promenilo ponovo pravac lopte pre nego što ona bude na pozitivnoj visini, što bi na animaciji izgledalo kao "zarobljavanje" lopte na tlu.
Druga if naredba služi da zaustavi animaciju odskakanja kada brzina odbijanja postane dovoljno "mala".
Kompletna klasa Lopta sada izgleda:
Druga if naredba služi da zaustavi animaciju odskakanja kada brzina odbijanja postane dovoljno "mala".
Kompletna klasa Lopta sada izgleda:
Slika 1: Animacija slobodnog pada u processing-u - klasa Lopta
U glavnom skeču su definisane na početku promenljive i konstante koje su dostupne i u ostalim klasama:
int frameRate=20;
PVector brzina;//m/s
static final float RAZMERA=4;//10px=1m
Lopta lopta1;
static final float G=9.81;
PVector brzina;//m/s
static final float RAZMERA=4;//10px=1m
Lopta lopta1;
static final float G=9.81;
Deklarisan je objekat lopte kao i brzina lopte kao objekat klase PVector. Takođe i promenljiva frameRate čija je vrednost postavljena na 20 frejmova u sekundi, kao i konstanta G koja predstavlja vrednost gravitacionog ubrzanja.
U setup metodi definiše se objekat klase Lopta i postavi se atribut brzine lopte na vrednost brzine koja se definiše takođe u setup metodi, a predstavlja zapravo vektor početne brzine lopte. Ukoliko se ova vrednost postavi na (0,0) onda ćemo dobiti slobodan pad lopte. Dakle, setup metoda je definisana na sledeći način:
U setup metodi definiše se objekat klase Lopta i postavi se atribut brzine lopte na vrednost brzine koja se definiše takođe u setup metodi, a predstavlja zapravo vektor početne brzine lopte. Ukoliko se ova vrednost postavi na (0,0) onda ćemo dobiti slobodan pad lopte. Dakle, setup metoda je definisana na sledeći način:
void setup()
{
{
size(1000,600);//100m * 60m u prirodi
brzina=new PVector(0,0);
lopta1= new Lopta(25,30,height/4);
lopta1.v=brzina;
frameRate(frameRate);
}brzina=new PVector(0,0);
lopta1= new Lopta(25,30,height/4);
lopta1.v=brzina;
frameRate(frameRate);
Veličina okvira je postavljena na 1000 * 600px. Lopta čiji je poluprečnik 25px je postavljena u početni položaj 30px po x osi i na 1/4 visine od tla(height - (1/4)*height).
Unutar draw metode se definišu boja pozadine, boja konture i ispune lopte. Takođe se pozivaju metode definisane prethodno u klasi lopta: kretanje(), granicniUslovi() i render().
Kompletan skeč se može videti na slici ispod:
Unutar draw metode se definišu boja pozadine, boja konture i ispune lopte. Takođe se pozivaju metode definisane prethodno u klasi lopta: kretanje(), granicniUslovi() i render().
Kompletan skeč se može videti na slici ispod:
Slika 2: Animacija slobodnog pada u processing-u - glavni skatch
Horizontalni hitac u processing-u animacija
Da bi smo napravili animaciju horizontalnog hica od prethodno kreirane animacije, dodaćemo x komponentu početnoj brzini i dodati i granični uslov koji proverava da li je lopta udarila u levi ili desni zid, i ako jeste napraviti da se odbija o iste, tako što ćemo promeniti pravac brzine u x pravcu. Kreiranje vektora početne brzine je u setup metodi(obojeno crveno).
void setup()
{
{
size(1000,600);//100m * 60m u prirodi
brzina=new PVector(5,0);
lopta1= new Lopta(25,30,height/4);
lopta1.v=brzina;
frameRate(frameRate);
}brzina=new PVector(5,0);
lopta1= new Lopta(25,30,height/4);
lopta1.v=brzina;
frameRate(frameRate);
Takođe treba dodati unutar klase Lopta, a u metodi granicniUslovi() ispitivanje uslova za udar u levi ili desni zid:
public void granicniUslovi()
{
{
if(v.x > 0 && width-polozaj.x < r || v.x < 0 && polozaj.x < 0)
{
if(v.y>0 && height-polozaj.y < r){
/*Uslov da se zaustavi*/
if(abs(v.y) < 0.3 && height-polozaj.y-r < -5)
{
}{
v.x *= -0.8; //promena pravca i gubitak energije
}if(v.y>0 && height-polozaj.y < r){
v.y *= -0.8;//gubitak energije
}/*Uslov da se zaustavi*/
if(abs(v.y) < 0.3 && height-polozaj.y-r < -5)
{
noLoop();
}Animacija horizontalnog hica će izgledati:
Kosi hitac u processing-u animacija
Video-tutorijal
Kosi hitac animacija:završni deo |
Kosi hitac primer:Igrica fudbal |
Od prethodne animacije horizontalnog hica, sa malim izmenama, dobićemo animaciju kosog hica. Prvo, unutar setup metode, dodaćemo, pored komponente početne brzine u x pravcu i komponentu u y pravcu. Takođe ćemo spustiti početnu visinu lopte:
Animacija kosog hica kreirana pomoću alata Eeasy Java Simulation je opisana u članku: kosi-hitac.onrender.com/kos_Hitac
Animacija kosog hica kreirana pomoću alata Eeasy Java Simulation je opisana u članku: kosi-hitac.onrender.com/kos_Hitac
void setup()
{
{
size(1000,600);//100m * 60m u prirodi
brzina=new PVector(5,-8);
lopta1= new Lopta(25,30,3*height/4);
lopta1.v=brzina;
frameRate(frameRate);
}brzina=new PVector(5,-8);
lopta1= new Lopta(25,30,3*height/4);
lopta1.v=brzina;
frameRate(frameRate);
Posle ovih promena, animacija kosog hica bi izgledala:
|
Sledeće
Primer kosog hica u processingu >| |