Col·lisions múltiples i detecció del sentit de moviments d'objectes | ||
|
||
A la pràctica anterior, es tractava la detecció d'una col·lisió d'un clip de pel·lícula en moviment amb un clip de pel·lícula estàtic. Ara es complica una mica l'exercici fent que el clip de pel·lícula que està dotat de moviment col·lisioni amb altres que poden estar estàtics o que també poden tenir moviment. Ens basarem en el clàssic joc Arkanoid, on s'intenta eliminar rajoles situades a la part superior de l'escenari, i amb una barra mòbil a la part inferior que fa que hi hagi un rebot del clip de pel·lícula que es mou per la pantalla (una pilota). Comenceu dissenyant la interfície, encara que l'exercici no estigui perfeccionat, ja que es proposarà una variant en l'elaboració de la pràctica, i l'adaptació adient al tipus d'alumnes que es vulgui oferir. |
||
Desenvolupament de la pràctica | ||
» Per començar la pràctica, obriu l'arxiu ark0.zip per recuperar l'arxiu FLA on hi ha només la interfície del programa que posteriorment podreu modificar i adaptar segons les vostres preferències. | ||
» Anomeneu la capa 1 com a barra. » Feu doble clic sobre el fotograma clau d'aquesta capa per inserir les accions d'inicialització del joc. » Inicialitzeu la variable d perquè tingui el valor de l'1 al 4 i que correspondrà a la direcció de desplaçament del clip de pel·lícula pilota que està situat al centre de l'escenari. El valor 1 correspondrà a la direcció dreta/amunt, el valor 2 esquerra/a baix, el valor 3 esquerra/amunt, i el valor 4 dreta/a baix. |
||
» Inicialitzeu la variable punts amb el valor 0 per anar incrementant-la segons el nombre de rajoles que vagin desapareixent (10 punts per a cada rajola). | ||
» Inicialitzeu la variable a amb el valor 0 per incrementar el nombre d'encerts, que, en el vostre cas, tindrà un màxim de 8. | ||
» I per finalitzar la iniciació del programa, establiu la propietat visible del clip de pel·lícula, que té com a nom d'instància fi en false. | ||
El codi seria: | ||
|
||
» Ara feu que la barra es desplaci cap a la dreta i a l'esquerra. | ||
» Seleccioneu la barra situada a la part inferior i assigneu-li les accions següents: | ||
|
||
Comença el codi detectant si es pren una tecla onClipEvent (keyDown). La tecla amb el codi 37 correspon a la fletxa de l'esquerra i el codi 39 correspon amb la fletxa de la dreta, i aquests dos nombres són els moviments que voleu que tingui la barra, per això, el codi contempla la condició de, si s'ha pressionat la tecla 37 (esquerra), la barra modificarà la seva coordenada X en 10 píxels menys, i, si s'ha pressionat la tecla 39 (dreta), augmentarà la seva coordenada X en 10 píxels. Ja que la barra té una amplada de 100 píxels i el seu punt de registre està situat al centre, tindreu un marge de 50 píxels per a cada costat de la barra i que aquesta no surti de l'escenari, i és per això que es posa la condició després de l'increment o disminució de la seva coordenada X perquè resti parada quan estigui situada en qualsevol extrem de l'escenari si premeu les fletxes corresponents (dreta, esquerra). |
||
L'última part del bloc de codi (onClipEvent (enterFrame)) fa que cada vegada que entri el fotograma detecti si hi ha hagut col·lisió amb el clip de pel·lícula bola, i en cas favorable, es canviïn les direccions i els sentits del moviment del clip de pel·lícula bola per mitjà de la variable d (canvia 2 per 3 i el 4 per 1). | ||
Ara programeu el moviment del clip de pel·lícula bola que tindrà per l'escenari, i feu la protecció perquè no sobrepassi les dimensions d'aquest escenari. | ||
» Feu clic sobre el clip de pel·lícula bola i obriu el tauler d'accions per inserir el codi següent: | ||
onClipEvent (enterFrame) {
} |
||
El codi està dividit en dos blocs: un és per dotar de moviment el clip de pel·lícula utilitzant la variable d i modificant les coordenades X i Y del clip (seria un bon exercici esbrinar el codi per comprovar els diferents moviments que tindrà). | ||
La segona part del codi correspon a les proteccions perquè el clip no surti de l'escenari, però heu de tenir en compte que el clip de pel·lícula té una amplada i una alçada de 20 píxels, i si voleu que reboti perfectament a les parets de l'escenari i, d'aquesta manera, a les dimensions de l'escenari, restareu 10 píxels. | ||
Esbrineu que l'últim bloc de codi correspon a la protecció de la part inferior de l'escenari i que, en cas de superar la coordenada Y els 370 píxels, indicarà que ha sobrepassat la barra mòbil i ha perdut la jugada. Aleshores, se situa el clip de pel·lícula al centre de l'escenari i li doneu un altre moviment a l'aztar utilitzant la variable d (aquí es podria completar el joc amb un missatge d'errades o comptador de vegades que pot fallar...). | ||
» Ara programeu l'acció del botó Iniciar joc perquè, cada vegada que es faci clic, el joc comenci sempre amb les mateixes condicions inicials. Al codi següent, veureu que se situa el clip de pel·lícula bola, es dóna la direcció/sentit del moviment a l'atzar, es visualitzen els rectangles de color, es posa la puntuació a 0 i es fa invisible el missatge fi. | ||
|
||
» Per finalitzar, a cada clip de pel·lícula que corresponen els rectangles, inseriu el codi següent canviant el nom del clip: l1,l2,l3... | ||
onClipEvent (enterFrame) {
} |
||
En aquest codi, es detecta si hi ha una col·lisió del clip amb el clip de pel·lícula bola cada vegada que es carrega un fotograma. | ||
Encara que un clip de pel·lícula tingui la seva propietat _visible en l'estat false, aquest romandrà actiu a l'escenari, i cada vegada que detectés la col·lisió seguiria augmentat les variables i fent les mateixes accions. Per evitar-ho, esbrineu que el codi contempla que només farà les accions si està visible, i això només pot passar en la primera col·lisió. | ||
Si observeu el codi, veureu que, en cas de col·lisió i que estigui visible el clip del rectangle, s'augmenta en 10 la variable punts, es posa aquest valor en el quadre de text dinàmic t1, es fa invisible el clip, augmenta la variable a, que actua com a comptador d'encerts, i es comprova que, si els encerts han estat de vuit, finalitza el joc amb el missatge fi. | ||
Com a programadors, podeu observar que, encara que faci col·lisió en el clip de pel·lícula, el clip de pel·lícula bola continua per rebotar a la part superior de l'escenari. Es deixa com a exercici possible de final de mòdul el fet de corregir aquest codi fent que, en el moment de la col·lisió, canviï de sentit i direcció perquè no superi el clip. També, fer una funció amb paràmetres per no repetir el codi en tots els clips i així poder augmentar el nombre de rectangles; assignar a cada clip l'acció startDrag() per poder-los moure a la posició desitjada de l'escenari i completar l'acció del botó Finalitzar... |
||
Podríeu, també, situar als límits laterals de l'escenari un clip de pel·lícula en forma de línia i desplaçar-la perquè, situant-les convenientment, canviïn les dimensions de l'escenari de joc i evitar treballar amb les propietats _x, _y, i poder aprofitar al màxim la potència de les col·lisions que us ofereix el Flash. | ||