Col·lisions de clips duplicats amb objectius múltiples | ||
|
||
En la pràctica 1, heu treballat amb col·lisions senzilles, a la segona, amb col·lissions múltiples, i en aquesta tercera pràctica, treballareu la detecció de col·lisions amb objectius múltiples i aprofitareu, també, perquè els clips que han de fer les col·lisions es formin a partir d'un clip principal (duplicacions). |
||
Es destaca la importància d'aquesta pràctica, que servirà a tots el programadors del Flash com a model per desenvolupar múltiples aplicacions educatives i, en especial, per als programadors que desenvolupen eines informàtiques per a nens i nenes d'educació especial. | ||
Com és habitual en moltes pràctiques, es dóna una interfície confeccionada per estalviar temps en el curs, però que sigui fàcilment modificable i adaptable de forma adient a l'objectiu que es vulgui aconseguir per part del programador. | ||
En aquesta pràctica, treballareu la duplicació de clips i es processaran com a categories per reconèixer el clip o clips corresponents que col·lisionaran. Per a millor comprensió d'aquest apartat, penseu en dos clips de pel·lícula que, respectivament, podrien ser un ocell i un falcó. Si doteu a l'ocell d'una possibilitat de detectar quan un altre clip de pel·lícula cau a sobre i podeu extreure la primera o primeres lletres del seu nom, tindreu que l'ocell detecta una categoria determinada de clips que, quan facin col·lisió, podrà fer una acció o altra segons convingui en les accions que hagi de portar a terme el programa (l'ocell ha estat caçat, ha trobat un amic, ha trobat parella i faran el niu, etc.). |
||
S'ha optat per fer una aplicació petita que simula un joc de construcció on, partint d'un dibuix format per clips de pel·lícula buits, s'hauran d'omplir amb altres clips de pel·lícula que prèviament han fet la duplicació corresponent al nombre de clips per omplir. Per poder encaixar aquests clips de forma correcta, hi ha un botó que fa la rotació del clip de pel·lícula escollit. Podeu veure l'objectiu que s'ha d'aconseguir observant l'aplicació formes3.swf.
|
||
Desenvolupament de la pràctica | ||
formes3.swf
|
||
Feu
clic per executar l'aplicació
|
||
» Recupereu l'arxiu fomes0.zip. |
||
» Canvieu el nom de la capa 2 pel de fons, on teniu distribuït l'escenari en dues àrees: una verda per als clips de pel·lícula i una de color salmó on s'ubiquen els botons i els clips que s'han d'arrossegar. | ||
. |
||
» Canvieu el nom de la capa 1 pel de construcció. Aquesta capa conté els clips de pel·lícula estàtics que, en termes de programació de Flash, s'anomenen objectius. | ||
» Canvieu, per últim, el nom de la capa 3 pel nom eines. En aquesta àrea, estan disposats els botons i els clips objectes d'arrossegament. | ||
» Doteu d'accions el fotograma clau de la capa construcció amb el codi següent: | ||
|
||
En primer lloc, es creen a partir de la instància del clip de pel·lícula q (quadrat) les duplicacions corresponents al nombre de quadrats que hi ha en el dibuix de la construcció feta, i que, en el vostre cas, corespon a 3. Heu de tenir en compte que les matrius de clips de pel·lícula duplicats comencen per l'índex 0 i, en el vostre cas, tindreu, després de la duplicació, les instàncies de clip de pel·lícula q, q0, i q1 |
||
Com podeu esbrinar, en el codi es fa el mateix amb les instàncies rect (rectangle) i trip (triangle petit) per la quantitat d'objectius que cal cobrir, però no es duplica el triangle gran amb nom g1, perquè només s'ha de cobrir un objectiu amb aquest clip. Com a final del codi, es crea la variable rectangle per contenir una cadena literal buida per a la seva utilització posterior. |
||
» Tot seguit, escriviu el codi que s'ha d'executar per a cada instància de clip de pel·lícula, que haurà de fer en la seva condició de botó i en la seva condició de clip de pel·lícula. (Observeu que s'ha convertit el clip de pel·lícula q en un botó. Ho podeu comprovar fent un clic o doble clic sobre el quadrat.) » Heu de fer clic dues vegades per obrir l'acció que posareu al botó corresponent, i que consistirà a detectar quan es pressiona el botó fent-hi clic a sobre, on (press), i quan el botó, deixant-lo de pressionar, on (release, releaseOutside), que detecta quan s'allibera el ratolí fora del botó. En fer clic sobre el botó, es fa la comprovació que, si està actiu, estigui en condicions de poder-se arrossegar per l'escenari mentre no el deixeu anar startDrag(""). En la segona acció d'alliberar el ratolí del botó, s'ha d'utilitzar la variable rectangle perquè prengui el nom d'aquesta instància _root.rectangle=this._name. Observeu que la variable rectangle prendrà el valor que hi ha dins d'aquesta instància (this) i que està desada, per defecte, en la seva propietat _name. Amb la mateixa acció, fareu que la instància deixi d'executar l'arrossegament per l'escenari amb l'acció stopDrag(). El codi per a cada una de les instàncies que corresponen al quadrat, rectangle, triangle petit i triangle gran.
|
||
|
||
El pas següent serà dotar d'accions la instància de cada clip de pel·lícula de les accions per fer quan allibereu el ratolí (onClipEvent (mouseUp)). Aquí utilitzeu la propietat _droptarget, que, com s'ha apuntat al començament de la pràctica, serà la propietat interessant capaç de fer les accions que s'han comentat sobre l'exemple de l'ocell i el falcó. Aquesta propietat pertany al clip de pel·lícula que s'arrossega per l'escenari i conté el nom del clip de pel·lícula objectiu, és a dir, s'emmagatzemarà dins una variable interna del clip de pel·lícula que arrossega el nom del clip de pel·lícula que ha col·lisionat amb ell. Aquest nom que s'emmagatzema variarà cada vegada que es deixi de prémer el ratolí sobre un altre clip de pel·lícula objectiu. |
||
Doteu el clip de pel·lícula (no el botó, que ja ho heu fet) del codi següent: | ||
|
||
onClipEvent (mouseUp) { if (this._x<426) {
} } |
||
Recordeu aplicar aquest codi a la resta de figures tenint en compte que el nom d'instància és diferent. | ||
Observeu que, quan s'allibera el ratolí, necessàriament esteu a sobre de la instància que està efectuant l'acció startDrag(), que heu assignat al botó que conté la mateixa instància; i si està a sobre d'un clip de pel·lícula objectiu de l'escenari, posarà en la variable interna mitjançant la propietat _droptarget el primer caràcter del nom de la instància objectiu i, en cas de correspondre a q, que seria de la mateixa categoria (quadrat) i en la mateixa condició, comprova si tenen la mateixa rotació (si compleix les dues condicions seria al mateix tipus de figura i estarien en el mateix grau de rotació). Tot això suposant que l'arrossegament del clip estigui fora de la zona de color salmó per evitar la col·lisió amb un altre del mateix tipus i que està en la zona d'aquest color. Per aquesta raó, s'ha posat la condició corresponent. En cas positiu, el que fa és posar les mateixes coordenades del clip de pel·lícula que s'està arrossegant (this), de les quals avalua la propietat _droptarget del clip de pel·lícula objectiu que hi ha a sota i li canvia el nom d'instància pel d'inactiu, amb la finalitat que ja no es pugui activar i, en conseqüència, no es pugui tornar a arrossegar quedant immobilitzada la instància en el seu lloc definitiu. Aquest codi solament és necessari posar-lo en els clips de pel·lícula originals, és a dir, en els pares, ja que les duplicacions d'aquests clips de pel·lícula hereten el codi. Per finalitzar, introduïu el codi (al botó de gir), que permet girar 45 graus les figures: | ||
| ||
|