Pentru a "blit" este să copiați biți dintr-o parte a memoriei grafice a unui computer într-o altă parte. Această tehnică se ocupă în mod direct de pixelii unei imagini și le atrage direct pe ecran, ceea ce o face o tehnică de redare foarte rapidă, adesea perfectă pentru jocuri de acțiune 2D cu ritm rapid.
Cele mai multe platforme gamedev susțin o formă de lovitură; aici voi folosi regulat Flash și AS3 pentru o demonstrație web-friendly.
Mai întâi trebuie să știm cum să creăm o suprafață în memoria grafică. În Flash, putem face acest lucru:
var bmd: BitmapData = BitmapData nouă (550, 500);
Aceasta creează un dreptunghi format din 550 de ori 500 pixeli - adică puncte de culoare. Apoi, putem afișa acești pixeli prin trecerea acestor date pixel într-un obiect bitmap și adăugând-o pe ecran:
var bitmap: bitmap = Bitmap nou (bmd); addChild (bitmap); // adăugați la ecran utilizând lista de afișare a Flash
Aceasta va afișa pur și simplu un dreptunghi alb de 550x500px, deoarece culoarea albă este culoarea implicită pentru pixeli într-un nou BitmapData
obiect.
Acum, să presupunem că vrem să tragem un fundal pe acest dreptunghi. Putem face acest lucru prin copierea pixelilor din imaginea de fundal direct în existent BitmapData
obiect, mai degrabă decât să adăugați o nouă imagine pe ecran.
// nu este afișat: importarea unei imagini în obiectul backgroundImage. var backgroundRectangle: dreptunghi = dreptunghi nou (); backgroundRectangle.x = 0; backgroundRectangle.y = 0; backgroundRectangle.width = backgroundImage.width; backgroundRectangle.height = backgroundImage.height; bmd.copyPixels (backgroundImage, backgroundRectangle, new Point (0,0));
În codul de mai sus, am importat o imagine în imagine de fundal
obiect (aceasta ar putea fi o fotografie JPEG, o imagine din camera web a utilizatorului, un fundal generat procedural - nu contează) și apoi a definit un dreptunghi care a subliniat o zonă a acestei imagini (în acest caz, tocmai am subliniat întreaga imagine).
Apoi, am copiat pixelii din această zonă dreptunghiulară a imaginii în 550x500px existent BitmapData
obiect din înainte - punct nou (0,0)
doar spune că ar trebui să începem la coordonate (0,0)
(adică colțul din stânga sus) al dimensiunii de 550x500 pixeli BitmapData
.
Presupunând că imaginea importată este de 550x500px, aceasta înseamnă că va acoperi complet albul nostru simplu BitmapData
. Acum, de vreme ce noi bmp
Bitmap-ul este legat de acest lucru BitmapData
, vom vedea că imaginea apare pe ecran!
Putem apoi să adăugăm o altă imagine pe această temă. Să spunem asta faceImage
este o imagine 75x75px a unei fețe, cu un fundal transparent. Putem pur și simplu face acest lucru:
// nu este afișat: importarea unei imagini în obiectul faceImage. var faceRectangle: dreptunghi = dreptunghi nou (); faceRectangle.x = 0; faceRectangle.y = 0; faceRectangle.width = faceImage.width; faceRectangle.height = faceImage.height; bmd.copyPixels (faceImage, faceRectangle, punct nou (Math.random () * 550, Math.random () * 500));
Este aproape același cod ca înainte: pixelii de pe imaginea feței se copiază pe BitmapData
, pe partea de sus pixelii existenți care au fost copiați din imaginea de fundal. Diferența mare este că copiem fața într-o poziție aleatoare, mai degrabă decât (0,0)
.
Iată cum arată acest lucru în acțiune:
Este important să menționăm că această imagine a feței nu este pur și simplu "stratificată" deasupra imaginii de fundal; pixelii (albul original inițial) BitmapData
au fost modificate fiecare individual pentru a se potrivi cu pixelii imaginii de fundal, iar apoi o zonă de pixeli de 75x75px a fost modificată din nou pentru a se potrivi cu pixelii imaginii feței. Când resetezi demo-ul de mai sus, toți pixelii din 550x500px BitmapData
sunt modificate pentru a se potrivi cu pixelii imaginii de fundal din nou.
Deoarece calculatorul schimbă direct pixelii individuali ai bitmapului, mai degrabă decât încercarea de a urmări mai multe straturi diferite, această metodă este incredibil de rapidă. În demo-ul de mai jos, am adăugat niște fizici simple și mă lovesc sute de imagini pe secundă.
Deși bliturile sunt deja foarte rapide, există lucruri pe care le putem face pentru a le face chiar mai repede.
În primul rând, putem blocare bitmap înainte de a face orice modificări la BitmapData
cu care este legată.
În timp ce bitmap-ul este deblocat, acesta va încerca să facă toate modificările aduse BitmapData
ca aceste modificări sunt făcute - așa că dacă lăsăm 100 de imagini într-o singură buclă, atunci calculatorul trebuie să se ocupe de redarea tuturor acestor schimbări, unul după altul, într-un timp foarte scurt.
În schimb, putem bloca bitmap, blit cele 100 de obiecte la BitmapData
, și apoi deblocați bitmap-ul; bitmap-ul nu se va schimba în timp ce este blocat, chiar dacă BitmapData
modificări de 100 de ori. Asta inseamna ca calculatorul trebuie doar sa reeduca bitmapul o data pe bucle, mai degraba decat de 100 de ori - mult mai rapid!
O a doua tehnică de optimizare este de a reduce numărul de pixeli pe care îi blitzăm la un moment dat. De exemplu, să presupunem că lăsăm o imagine de fundal și apoi o imagine fată deasupra acesteia, iar apoi vrem să elimina fața și reveniți la un fundal gol. (Rețineți că imaginile nu sunt stratificate, pixelii feței au fost copiați deasupra pixelilor din fundal.)
Cea mai simplă modalitate de a face acest lucru este de a bloca pur și simplu întreaga imagine 550x500px pe fundal BitmapData
din nou, acoperind tot ce era înainte.
Dar aici este o alternativă: putem să aflăm în ce zonă a ecranului este acoperită imaginea feței și apoi o imagine secundară dreptunghiulară a fundalului din zona respectivă! Această tehnică este cunoscută sub numele de murdare dreptunghiuri.
Blitzul este adesea o alegere excelentă a metodei de redare a jocurilor de acțiune 2D, deoarece oferă o modalitate rapidă de a face foarte multe schimbări individuale ale ecranului foarte repede, datorită manipulării direct a pixelilor.
Este de multe ori mai puțină intensitate a memoriei decât alte metode de redare, deoarece trebuie stocate mai puține informații grafice - totul este într-un singur bitmap.
Țineți cont de faptul că această viteză și putere apar de obicei la prețul convenabil - de exemplu, dacă doriți să faceți ca un obiect din prim plan să nu se micșoreze, atunci nu puteți modifica pur și simplu lăţime
și înălţime
valori; trebuie să repetați fundalul deasupra acestuia și apoi să redrawn obiectul puțin mai mic, de peste și peste din nou.