Creați un joc Breaker de caramida cu Corona SDK Setarea aplicației

În această serie de tutori, vom construi jocul Brick Breaker de la zero, folosind kitul Corona SDK. Scopul acestui joc este acela de a controla o paletă asemănătoare pongului pentru a bate o minge împotriva unui teanc de cărămizi până când toți pauză.


Pasul 1: Prezentare generală a aplicației

Scopul acestui joc este de a folosi o paletă pentru a bate o minge într-un teanc de cărămizi până când toate cărămizile sunt rupte, fără a lăsa mingea să rateze zbaturi și să zboare de pe ecran. Dacă este reușit, utilizatorul va avansa la un nou nivel, altfel jocul se va încheia.


Pasul 2: Dispozitivul vizat

Primul lucru pe care trebuie să-l facem este să selectăm platforma pe care dorim să o executăm, astfel încât să putem alege dimensiunea imaginilor pe care le vom folosi.

Platforma iOS are următoarele caracteristici:

  • iPad: 1024x768px, 132 ppi
  • iPhone / iPod Touch: 320x480px, 163 ppi
  • iPhone 4: 960x640px, 326 ppi

Deoarece Android este o platformă deschisă, există multe dispozitive și rezoluții diferite. Câteva dintre caracteristicile cele mai comune ale ecranului sunt:

  • Google Nexus One: 480x800px, 254 ppi
  • Motorola Droid X: 854x480px, 228 ppi
  • HTC Evo: 480x800px, 217 ppi

În acest tutorial ne vom concentra pe platforma iOS cu design grafic, dezvoltând în mod special pentru distribuție pe un iPhone / iPod touch, dar codul prezentat aici ar trebui să se aplice dezvoltării Android cu SDK Corona.


Pasul 3: Interfața

Va fi afișată o interfață cu aspect frumos, care implică mai multe forme, butoane, imagini bitmap și multe altele.

Resursele de interfață grafice necesare pentru acest tutorial pot fi găsite în descărcarea atașată.


Pasul 4: Exportați grafica

În funcție de dispozitivul pe care l-ați selectat, poate fi necesar să exportați grafica în ppi recomandată, puteți face acest lucru în editorul dvs. preferat de imagini.

Am folosit Reglați dimensiunea? în aplicația Previzualizare pe Mac OS X.

Nu uitați să dați imaginilor un nume descriptiv și să le salvați în folderul proiectului.


Pasul 5: Main.lua

E timpul să scriem cererea noastră!

Deschideți editorul Lua preferat (orice editor de text va funcționa, dar nu toți editorii oferă o evidențiere a sintaxei Lua) și vă pregătiți să scrieți aplicația dvs. minunată. Nu uitați să salvați fișierul ca main.lua în dosarul proiectului.


Pasul 6: Structura codului

Ne vom structura codul ca și cum ar fi o clasă. Dacă știți ActionScript sau Java, ar trebui să găsiți structura familiară.

 Variabile și constante de clase variabile Declare funcții contructor (funcție principală) metode de clasă (alte funcții) apel funcția principală

Pasul 7: Ascundeți bara de stare

 display.setStatusBar (display.HiddenStatusBar)

Acest cod ascunde bara de stare. Bara de stare este bara din partea de sus a ecranului dispozitivului, care afișează ora, semnalul și alți indicatori.


Pasul 8: Încărcați motorul fizicii

Vom folosi motorul Box2D construit în Corona, folosiți acest cod pentru al include în aplicația dvs.:

 --Fizica Motorul fizicii locale = necesita 'fizica' fizica.start () fizics.setGravity (0, 0) - Stabiliți gravitatea la 0, deoarece nu o vom avea nevoie

Pasul 9: Variabile de joc și constante

Acestea sunt variabilele și constantele de bază pe care le vom folosi, citiți comentariile din cod pentru a afla mai multe despre ele.

 local BRICK_W = 41 - lățimea brickului local BRICK_H = 21 - înălțimea locală OFFSET = 23 - un decalaj folosit pentru a centra cărămizile locale W_LEN = 8 - lungimea nivelelor, numai 8 cărămizi orizontale ar trebui create pe scenă local SCORE_CONST = 100 - suma care trebuie adăugată la scor atunci când o cărămidă este lovită scor local = 0 - stochează scorul actual caramizi locale = display.newGroup () - se păstrează toate nivelurile de cărămidă locale xSpeed ​​= 5 local ySpeed ​​= -5 local xDir = 1 - x direcție locală yDir = 1 joc localEvent = "- stochează evenimente de joc (câștiga, pierde, terminat) local currentLevel = 1

Pasul 10: ecranul meniului

Acesta este ecranul aplicației principale, va fi prima vizualizare interactivă care va apărea în jocul nostru. Aceste variabile stochează fundalul și componentele ecranului de meniu.

 fundal local = display.newImage ('bg.png') meniu localScreen local mScreen local startB localB

Acordați o atenție deosebită liniei cu display.newImage ( 'bg.png'). Acesta este responsabil pentru afișarea imaginii de fundal inițiale pe ecran.


Pasul 11: Despre ecran

Ecranul va afișa creditele, anul și drepturile de autor ale jocului. Această variabilă va fi utilizată pentru a stoca o referință la vizualizare:

 local despreScreen

Pasul 12: Ecranul jocului

Acesta este ecranul de joc, acesta va fi creat atunci când start butonul este apăsat.

Variabilele pentru stocarea ecranului de joc:

 o minge locală locală de zăpadă din cărămidă locală

Pasul 13: Text scor și nivel

Variabile locale care stochează scorurile / nivelurile câmpurilor de text și valorile numerice scor / nivel:

 scor localTotal scor localNum nivel localText nivel localNume

Pasul 14: Ecran de avertizare

Acest ecran va apărea când jocul a fost decis. Mesajul îi va spune jucatorului pe care îl câștigă sau îl pierde.

Ecranul Alert este stocat de următoarele variabile:

 alertă localăAlertă locală pe ecranBg casetă locală localăTTF local msgTF

Pasul 15: nivelurile

Toate nivelurile noastre vor fi stocate în tabele (versiunea Lua a unei matrice).

Acesta este în esență un tabel care conține un tabel. Ați putea declara acest lucru într-o singură linie, dar, cu formatul potrivit, spațierea vă permite să vedeți tipul de nivel pe care îl vor lua nivelurile:

 nivele locale =  nivele [1] = 0,0,0,0,0,0,0,0, 0,0,0,0,0,0,0,0, 0, 0,0,1,1,0,0,0, 0,0,0,1,1,0,0,0, 0,1,1,1,1,1,1,0 , 0,1,1,1,1,1,1,0, 0,0,0,1,1,0,0,0, 0,0,0,1,1,0, 0,0, 0,0,0,0,0,0,0,0, nivele [2] = 0,0,0,0,0,0,0,0, 0 , 0,0,1,1,0,0,0, 0,0,1,0,0,1,0,0, 0,0,0,0,0,1,0,0 , 0,0,0,0,1,0,0,0, 0,0,0,1,0,0,0,0, 0,0,1,0,0,0 , 0,0, 0,0,1,1,1,1,0,0, nivelele [3] = 0,0,0,0,0,0,0,0,  0,0,0,0,0,0,0,0, 0,0,0,1,1,0,0,0, 0,1,0,0,0,0,1, 0, 0,1,1,1,1,1,1,0, 0,1,0,1,1,0,1,0, 0,0,0,0,0, 0,0,0, 0,0,0,1,1,0,0,0, 0,0,0,0,0,0,0,0, nivelurile [4] =  0,0,0,0,0,0,0,0, 0,0,0,0,0,0,0,0, 1,1,1,1,1,1,1 , 1, 1,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,1, 1,0,0,0,0 , 0,0,1, 1,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,1, 1,1,1, , 1,1,1,1,1

În tabelele multidimensionale de mai sus, 1 lui reprezintă spațiul din stadiul în care va fi amplasată o cărămidă și 0 lui sunt doar spațiu gol. Ulterior, numerele vor fi citite de o funcție care va plasa o cărămidă în vizualizarea jocului. Am adăugat patru de mai sus, dar puteți adăuga câte doriți!


Data viitoare?

Ați văzut acum interfața și setarea de bază a jocului nostru. Rămâi acordat pentru partea a doua a acestei serii, unde vom adăuga interactivitate la interfața și detectarea coliziunilor între grafica noastră de joc.

Cod