Ei bine, ne apropiem de sfârșitul anului 2009 și, ca întotdeauna, aceste zile finale în decembrie sunt un moment de reflecție, amintiri și nostalgii. La Activetuts + ne străduim să gândim înainte, să ne mișcăm cu timpul și să adoptăm tehnologia. Spunând acest lucru, este de asemenea important să apelăm la aceasta toate cititorii noștri, deci pentru cei dintre voi care nu au făcut încă saltul, să terminăm anul cu un pic de ActionScript 2.0!
În acest tutorial, veți crea un simplu joc de șarpe AS2.
Porniți Flash și faceți clic pe Creați nou: fișier Flash (Actionscript 2.0). Aveți posibilitatea să setați mărimea scenei oricui vă plac - am setat a mea la 500 x 350. Vă sfătuiesc să setați framerate la 30fps.
Acum, puteți fie să decideți să urmați acest pas și să trageți pe cont propriu monitoarele necesare, fie să puteți săriți și să le folosiți pe cele pe care le-am creat. Dacă doriți să folosiți cele create, le puteți găsi în fișierul sursă. Doar adăugați-le la bibliotecă și trageți-le pe scenă. Dacă aveți de gând să trageți propria dvs.: nu trebuie să trageți literalmente la fel ca mine, dar asigurați-vă că vă rămân la dimensiunile.
Primul lucru pe care îl vom crea este groapa pentru ca șarpele să se plimbe. Creați un dreptunghi de 400 x 250 și convertiți-l într-un pixel. Asigurați-vă că acordați atenție punctului de înregistrare; faceți-o în partea de sus-stânga.
Asigurați-vă că dați șarpelui numele instanței snakepit și aliniați-o ușor deasupra centrului scenei (astfel încât să putem adăuga textul mai jos, fără a afecta estetica).
Desenați un pătrat (probabil cu colțuri rotunjite) fără o margine (dimensiunea 25 x 25) și copiați-l astfel încât să aveți 2 exact același lucru. Conversați unul dintre ele într-un film. Din nou, acordați atenție înregistrării din stânga sus.
Asigurați-vă că îi dați numele instanței bodypart0 și verificați dublu că dimensiunea sa este de 25 x 25.
Introduceți movieclipul "cap". Odată ce ați intrat, adăugați această linie de cod la primul și singurul cadru:
Stop();
Acum, trageți un chip mic pe capul șarpelui, astfel încât să-l puteți spune în afară de alte organe.
Adăugați un al doilea cadru la movieclip "cap", iar pe acest cadru trageți o față tristă sau mortă.
Amintiți-vă pătratul duplicat pe care l-ați creat în pasul 3? O vom transforma acum într-un movieclip. Atenție la punctul de înregistrare din nou.
Asigurați-vă că îi dați numele instanței parte a corpului.
Creați un câmp de text dinamic sub colțul din dreapta al găurii de șarpe. Asigurați-vă că ați setat variabila la scor. De asemenea, asigurați-vă că câmpul este suficient de larg pentru mai multe caractere și aliniat la dreapta. Restul setărilor pot fi setate în funcție de propriul dvs. stil - am folosit Tahoma 24 Bold.
Deoarece este un câmp de text dinamic, va trebui să încorporăm fontul. Faceți clic pe butonul de încorporare din panoul proprietăților (unde ați definit stilul variabil și text).
Veți vedea pop-ul afișat mai jos. Asigurați-vă că selectați Numerale [0 ... 9].
Desenați un cerc albastru fără limită, dimensiune 25 x 25, apoi ștergeți centrul utilizând instrumentul de ștergere. Acum, selectați cercul care rămâne și convertiți-l într-un movieclip. Alternativ, puteți crea o bucată de mâncare pentru dvs., atâta timp cât rămâne 25 x 25.
Dați hrana un nume de exemplu surprinzător alimente. Verificați dublu că dimensiunea sa este de 25 x 25.
Stânga sub groapa de șarpe părea un loc bun pentru a pune niște indicii. Pur și simplu tastați textul static "Utilizați tastele săgeată pentru a muta" aici. Stiu ca tastele sageti nu functioneaza inca, dar vom ajunge la asta in scurt timp. iți promit!
Desenați un pătrat alb (undeva în afara scenei, deocamdată) și adăugați textul "Ai murit!" la el. Acesta este pop-ul pe care îl afișăm după ce cineva a pierdut un joc.
Convertiți-l într-un movieclip și dați-i numele instanței Pop-up de asemenea. În scopul alinierii, am setat punctul de înregistrare la centru.
Faceți dublu clic pe pop-ul pe care tocmai l-ați creat pentru ao introduce. Odată ce ați intrat, creați un câmp de text dinamic (variabilă = scor) și un buton care citește textul Joaca din nou.
Butonul trebuie să aibă numele instanței againbutton.
În interiorul butonului, puteți crea o stare "Peste" și chiar mai întunecată "Jos" mai puțin întunecată.
Felicitări, ați creat toate obiectele vizuale necesare pentru jocul de șarpe. Acum, până la cod!
Înainte să arunc o bucată de cod la tine, îți voi spune ce să faci cu asta. Tot codul din acest tutorial merge pe primul și singurul cadru al filmului tău. Nu este nevoie să atașați butoanele sau orice altceva. Acum, aruncați o privire asupra acestei acțiuni ActionScript.
Nota editorului: Îmi pare rău despre acești oameni, indicatorul de sintaxă de cod nu dorește să afișeze această bucată specială de ActionScript în FireFox. Uitați-vă la cod aici.
Pe scurt, acest cod de cod face următoarele. În primul rând, partea de corp originală este invizibilă - în curând vom folosi duplicate. Unele valori implicite sunt (re) setate, toate duplicatele rămase din jocul anterior sunt șterse. În bucla while (), alimente și bodypart0 (capul) sunt date coordonate x și y. În cazul în care se potrivesc (astfel încât aceștia se află exact în același loc), li se dă o nouă coordonată, până când nu mai avem un meci. Apoi, sunt configurate matricele în care vom conține coordonatele x și y ale corpurilor.
În acest bit de cod, vom crea un obiect keylistener, pe care îl atașăm la Key, care reprezintă tastatura. Ori de câte ori este apăsată o tastă, funcția onKeyDown este declanșată. Din funcția getCode (), vom determina ce tastă a fost apăsată și apoi vom defini direcția în funcție de aceasta. Vom păstra acest lucru în direcţie variabilă pentru utilizare ulterioară. Amintiți-vă: tot codul acestui tutorial merge pe primul și singurul cadru al filmului dvs..
keyListener = Obiect nou (); KeyListener.onKeyDown = functie () keycode = Key.getCode () daca (keycode == 37) direction = 'left' altceva daca (keycode == 38) direction = 'up' 39) direction = 'right' altfel dacă (keycode == 40) direction = 'down'; Key.addListener (keyListener);
Funcția aici este una mare. Este executat pe fiecare cadru, dar face doar ceva la fiecare 5 cadre. Verifică dacă șarpele nu se mișcă în afara cutiei și apoi mișcă toate componentele corpului de-a lungul noii poziții. Apoi verifică dacă hrana este acolo și apoi o mănâncă folosind funcția eat () pe care o vom discuta mai târziu. Apoi, verifică dacă șarpele se sparge într-un zid și în cele din urmă verifică dacă șarpele se mușcă în coadă. Toate aceste funcții vor fi adăugate în curând (insideSnake (), dead (), etcetera). Amintiți-vă: tot codul acestui tutorial merge pe primul și singurul cadru al filmului dvs..
this.onEnterFrame = funcția () if (jocul) if (framecount / 5 == Math.ceil (framecount / 5)) if (! <= snakepit._y && direction == 'up') && !(bodypart0._y+bodypart0._height >= snakepit._y + snakepit._height-2 && directia == 'jos') &&! (bodypart0._x + bodypart0._width> = snakepit._x + snakepit._width - 2 & direction == 'dreapta') &&! bodypart0._x <= snakepit._x && direction == 'left')) bodypartsy[0] = bodypart0._y; bodypartsx[0] = bodypart0._x; for (i=bodypartsy.length-1;i > 0; i =) eval ('bodypart' + i) ._ y = bodypartsy [(i-1)] eval 'bodypart' + i) ._ y corppartsx [i] = eval ('bodypart' + i) ._ x dacă food._x == bodypart0._x && food._y == bodypart0._y) dacă (direcția) if (direcția == 'sus') if (bodypart0.y <= snakepit._y) dead() else bodypart0._y-= bodypart0._width else if (direction == 'down') if (bodypart0._y+bodypart0._height >= snakepit._y + snakepit._height-2) dead () altceva bodypart0._y + = bodypart0._width altceva dacă (direcția == 'dreapta') if (bodypart0._x + bodypart0._width> = snakepit ._x + snakepit._width - 2) dead () altceva bodypart0._x + = bodypart0._width altfel dacă (direcția == 'stânga') if (bodypart0._x <= snakepit._x) dead() else bodypart0._x-= bodypart0._width if (game) if (insideSnake(bodypart0._x,bodypart0._y,true)) dead() framecount++
Acesta este frumos și ușor. Efectuează acțiunile care trebuie luate atunci când șarpele moare: scorul trebuie să fie definit în fereastra pop-up, pop-ul afișat, fața mortală a șarpelui afișată și variabila jocului setată la false (așa cum sa încheiat jocul).
funcția mort () popup.score = 'scor:' + (bodypartsx.length-1) popup.swapDepths (this.getNextHighestDepth ()) popup._visible = true bodypart0.gotoAndStop (2) game = false;
Funcția de mai jos este declanșată în funcția onEnterFrame discutată mai devreme, când mâncarea este preluată. Mai întâi duplică o parte din corpul șarpelui, apoi îl poziționează în locul ultimului corp (astfel încât să se alăture liniei de pe următorul cadru). Coordonatele sale sunt adăugate la coordonatele care conțin matrice, iar mâncarea este repoziționată (undeva nu în interiorul șarpelui!). De asemenea, scorul este actualizat.
()) (=) (=) () () () () '+ (bodypartsy.length-1)) ._ y eval (' bodypart '+ bodypartsx.length) ._ x = eval (' bodypart '+ (bodypartsy.length-1) + bodypartsy.length) ._ y) bodypartsx.push (eval ('bodypart' + bodypartsx.length) ._ x) do food._x = snakepit._x + Math.floor (((snakepit._width-food._width) / alimente.width) * Math.random ()) * food._width food._y = snakepit._y + Math.floor (((snakepit._height-food._height) /food._height) * Math.random () food._height în timp ce (în interiorulSnake (food._x, food.y)); scor = bodypartsx.length-1
Această funcție doar verifică dacă coordonatele introduse se potrivesc cu oricare dintre coordonatele corpurilor de șarpe. Dacă skiphead-ul este setat la true, este permis să se potrivească cu coordonatele capului (atunci când se verifică dacă capul muște coada, acest lucru vine la îndemână).
funcția insideSnake (xneedle, yneedle, skiphead) if (skiphead) startat = 1; altceva startat = 0; pentru (q = startat; qPasul 20: Butonul Popup
Ca un ultim cod de cod; tot trebuie să adăugăm o funcție de lansare pe butonul din interiorul ferestrei pop-up! Aceasta va declanșa funcția newgame () pe care am discutat-o mai devreme când a fost făcută clic pe ea. Amintiți-vă: tot codul din acest tutorial merge pe primul și singurul cadru al filmului dvs. - inclusiv acest bit despre buton!
popup.againbutton.onRelease = funcție () newgame ()Pasul 21: Înfășurați totul
Sunt sigur că ați făcut acest lucru înainte, dar acum este momentul: apăsați Ctrl + Enter (sau Cmd + Enter pe un Mac) pentru a compila fișierul swf și a vă testa jocul. Ar trebui să fie pe deplin funcțională. se bucura!
Concluzie
Dacă ai reușit totul aici; Felicitări! Ai creat un joc destul de captivant, în AS2! Desigur, un joc nu este niciodată terminat. Există întotdeauna loc pentru îmbunătățiri creative.
Dacă aveți întrebări sau sugestii, nu ezitați să comentați mai jos. De asemenea, sunt foarte curios să văd fișierele produse ca urmare a acestui tutorial - mi-ar plăcea să văd un link în comentarii!
Vă mulțumim că ați citit tutorialul meu. Sper că ți-a plăcut la fel de mult ca și mine.