Share
În acest sfat rapid veți învăța cum să faceți un sistem simplu de puncte care poate fi extins în propriile dvs. jocuri. Acest tutorial este pentru incepatori totali, iar in acesta veti invata cum sa creati un set de butoane pe care jucatorul poate face clic pentru a adauga sau a scadea puncte in sau din scorul lor. Simplu!
Deși acest tutorial este pentru începători pentru programarea Flash, va trebui să știți puțin despre utilizarea instrumentelor de desen în Flash Professional. Dacă trebuie să învățați cum să utilizați instrumentele de desen, citiți acest articol.
Să aruncăm o privire la rezultatul final la care vom lucra:
Deschideți Flash și creați un nou document Flash. Setați dimensiunea documentului la 550x400px, FPS (Frames per Second) la 24 și setați clasa de documente la Principal.
Pentru a crea grafica, utilizați instrumentul Oval pentru a crea patru cercuri cu conturul 0000 (Negru) și o mărimea cursei de 12.50.
Fiecare cerc ar trebui să aibă o altă culoare de umplere. Culorile de umplere sunt după cum urmează:
După ce ați creat monedele, utilizați casetele de text statice pentru a scrie valorile lor respective așa cum sunt indicate în imaginea de mai sus. Fontul pe care îl voi folosi în acest tutorial este Futura LT Heavy, cu o dimensiune de 50, dar nu ezitați să utilizați propriul font și dimensiunea fontului. După finalizarea instrucțiunii, trebuie să aveți o monedă de 10 monede, 50 de monede, 100 de monede și o monedă de -30.
Acum vom converti fiecare monedă într-un filmClip. Selectați moneda 10 și apăsați F8. Ar trebui să vedeți un dialog ca acesta:
Repetați acest pas pentru cele 50 de monede, 100 de monede și moneda -30 și introduceți următoarele sub casetele Name and Class pentru fiecare monedă:
Odată ce ați creat MovieClips din toate monedele, selectați-le pe toate și ștergeți-le din scenă. Vom adăuga-le din nou mai târziu, folosind codul.
Pentru a termina acest pas, creați o casetă de text statică cu textul "SCORE:" și poziționați-o cu o valoare X de 135 și o valoare Y de 327.
În acest pas vom stabili pachetul nostru și clasa principală.
Creați o nouă clasă ActionScript și sub categoria Nume de clasă Principal. După ce ați creat clasa, salvați-o în același director ca fișierul dvs. Flash și asigurați-vă că este salvat ca Main.as.
Introduceți codul de mai jos în fișierul Main.as, apoi salvați-l.
Accentsconagua
pachet // importă clasele necesare import flash.display.MovieClip import flash.events.MouseEvent; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFieldType; importul flash.events.Event; public class Main Extinde MovieClip var tenCoin: TenCoin = nou TenCoin (); // Creează o nouă instanță a celor zece monede var fiftyCoin: FiftyCoin = nou FiftyCoin (); // Creează o nouă instanță a celor Cincizeci de coin var hundredCoin: HundredCoin = nouă HundredCoin (); // Creează o nouă instanță a celor șapte coin var badCoin: BadCoin = noul BadCoin (); // Creează o nouă instanță a scorului -30 Coin var: Number = 0; // Setează scorul la zero var scoreText: TextField = TextField nou (); // Crează un câmp de text pentru a afișa scorul var scoreTextFormat: TextFormat = TextFormat nou ("Futura LT Heavy", 50, 0x000000); // Creează un nou format pentru câmpul Text scor, înlocuiți "Futura LT Heavy" cu fontul pe care îl utilizați funcția publică Main () displayObjects (); // Funcția pe care o vom folosi pentru a afișa tot graficul pe scena setUpEventListeners (); // Funcția pe care o vom folosi pentru a adăuga ascultătorii de evenimente Mai întâi vom importa clasele de care avem nevoie și apoi ne vom configura clasa de documente. Apoi extindem clasa principală din MovieClip; am putea folosi Sprite, dar nu contează. După aceea, declarăm variabilele pe care le folosim și adăugăm codul nostru Principal() (funcția noastră "constructor").
Principal() funcția va afișa toate monedele pe care le-am creat pe scenă și va adăuga, de asemenea, Event Listeners pe care trebuie să le folosim.
Notă: Va trebui să încorporați fontul în FLA pentru a fi afișat în câmpurile de text dinamice dacă utilizatorul dvs. nu are fontul instalat. Nu am făcut-o aici, ca să păstrez lucrurile simple.
displayObjects () Funcţie displayObjects () Funcția este apelată de la Principal() funcţie. Scopul acestei funcții este de a adăuga monedele și caseta de text a scorului în scenă și pentru a le poziționa în poziția corectă.
function displayObjects () // Seteaza pozitia Ten Coin tenCoin.x = 72; tenCoin.y = 200; // Setează poziția celor 50 de monede fiftyCoin.x = 207; fiftyCoin.y = 200; // Setează poziția celor 100 de coini hundredCoin.x = 342; hundredCoin.y = 200; // Setează poziția de -Thirty Coin badCoin.x = 477; badCoin.y = 200; // Poziționează caseta de text a scorului și îșitează tipul la dinamic, astfel încât să poată fi schimbat prin codul scoreText.type = TextFieldType.DYNAMIC; scoreText.x = 305; scoreText.y = 327; scoreText.width = 300; // Setează formatul textboxului ScoreText.defaultTextFormat = scoreTextFormat; // adaugă totul pe scena addChild (tenCoin); addChild (fiftyCoin); addChild (hundredCoin); addChild (badCoin); addChild (scoreText);
setUpEventListeners () Funcționarea și gestionarea evenimentelorAcum, când am adăugat obiecte la scenă, trebuie să creăm funcții de manipulare a evenimentului care sunt declanșate când faceți clic pe monede. Vom avea nevoie de asemenea updateScore () funcția de a utiliza astfel încât scorul devine actualizat și nu rămâne același.
setUpEventListeners () // Modifică toate filmările noastre în butoane tenCoin.buttonMode = true; fiftyCoin.buttonMode = adevărat; hundredCoin.buttonMode = adevărat; badCoin.buttonMode = adevărat; // adaugă ascultătorilor evenimentului pentru a adăuga puncte la scorul tenCoin.addEventListener (MouseEvent.CLICK, addTenPoints); fiftyCoin.addEventListener (MouseEvent.CLICK, addFiftyPoints); hundredCoin.addEventListener (MouseEvent.CLICK, addHundredPoints); badCoin.addEventListener (MouseEvent.CLICK, removeThirtyPoints); // Adaugă funcția de actualizare pentru a actualiza scorul stage.addEventListener (Event.ENTER_FRAME, updateScore);
Acum trebuie să codificăm funcțiile care schimbă și actualizează scorul.
funcția addTenPoints (evt: MouseEvent) scor + = 10; // adaugă 10 puncte la scor funcția addFiftyPoints (evt: MouseEvent) scor + = 50; // adauga 50 de puncte la scorul function addHundredPoints (evt: MouseEvent) scor + = 100; // adaugă 100 de puncte la scor removeThirtyPoints (evt: MouseEvent) scor - = 30; // Scăde 30 de puncte din scor // Această instrucțiune if nu permite ca scorul să scadă sub zero dacă (scor < 10) score -= score; function updateScore(evt:Event) scoreText.text = String(score); //This converts the score variable from a number to a string, because our score textbox can only display strings //Closes the class //Closes the package
Codul dvs. este acum gata pentru testare. Apăsați CTRL + Enter (CMD + Enter pe un Mac) și urmăriți-vă sistemul de puncte să vină la viață!
Acum s-ar putea să vă gândiți: "Mi-am pierdut timpul, tot ceea ce mi-a învățat tutorialul a fost să creez niște butoane care să-ți dea puncte când le dai clic" - dar ai învățat mai mult decât asta.
Priviți acest lucru ca fundație pentru un sistem de puncte mai avansat. Ați învățat cum să utilizați + = și - = pentru a adăuga sau a scădea de la un număr, ați învățat cum să utilizați ascultătorii de evenimente, ați învățat cum să creați o funcție de actualizare a obiectelor în timp ce SWF rulează și ați învățat cum să schimbați un număr la un String și afișați-l într-o casetă de text dinamică pe care ați creat-o în întregime prin cod!
Acest sistem de puncte poate fi extins cu ușurință în propriile dvs. jocuri. Pentru cei mai experimentați la Flash, încercați să creați un joc care utilizează o funcție hitTestObject și adaugă puncte atunci când atingeți un obiect.
Sper că ați învățat ceva nou astăzi. Vă mulțumim pentru lectură!
