Fotograma clau i la incidència enterFrame de l'objecte movieClip  
 
 
 

Un altre lloc on es poden inserir accions és al fotograma clau i a altres incidències de l'objecte movieClip.

Amb aquesta pràctica, aprendreu a utilitzar la incidència enterFrame per crear animacions controlades pel llenguatge ActionScript. També incorporareu interactivitat a les animacions.

Per aconseguir aquest objectiu, començareu a crear una petita aplicació dirigida a nens i nenes d'educació preescolar en què s'intentarà aconseguir que l'usuari/ària (nen/a) pugui anar adquirint amb el joc una certa habilitat i motricitat fina amb l'ús del ratolí.

L'event fotograma clau

El fotograma clau permet executar codi de programació cada vegada que el capçal de la línia del temps passa per aquest. D'aquesta manera, funciona com una incidència.

El codi del fotograma clau de la pel·lícula principal té el mateix funcionament que la incidència Load d'un clip de pel·lícula. Per tant, és un lloc idoni per crear variables, assignar valors, i també per crear funcions i objectes. A partir de la versió 6 de Flash MX, en el fotograma clau de la pel·lícula principal també es poden crear incidències que facin referència a altres clips de pel·lícula.

 
      
Desenvolupament de la pràctica  
    

» Creeu un arxiu nou i anomeneu la capa amb el nom Accions.

» Inseriu al fotograma 1 el codi per crear una variable i, al mateix temps, assignar-li un valor: frames=1;

Aquesta variable creada té dues característiques: és una variable global i es troba a la línia de temps principal, a l'arrel. Com que ja es troba a la pel·lícula principal, no és necessari escriure _root.frames=1;. Però si la utilitzeu dins un clip de pel·lícula, heu d'escriure davant la paraula _root.

» Substituïu la instrucció anterior per aquesta: frames++;

Aquesta instrucció, com sabeu, actua com un comptador. Ara es tracta de veure quantes vegades s'incrementa el valor de la variable.

» Executeu la pel·lícula i aneu al menú Depurar / Mostrar variables.

Podeu comprovar que la variable frames té assignat el valor 1. Això vol dir que solament s'ha incrementat en 1. Això us indica que el codi només s'ha executat una sola vegada.

» Arrossegueu el fotograma a la casella 2 de la línia del temps.

» Afegiu l'acció: gotoAndPlay(1);

» Torneu a executar i comprovar la pel·lícula amb el depurador i comproveu el valor de la variable frames.

Ara, el valor de la variable s'ha incrementat un número de vegades depenent de la velocitat dels fotogrames. Per defecte, la pel·lícula es reprodueix a dotze fotogrames per segon. El valor de la variable dependrà del temps que heu trigat abans d'executar el depurador.

L'acció gotoAndPlay(1) crea un bucle infinit entre el fotograma 1 i el 2.

» Inseriu una capa nova amb el nom Text.

 

 
 
 
      
 
Imatge núm. 1
 
      
 

» Inseriu un text dinàmic a l'escenari a la capa text i amb la variable frames;

» Executeu la pel·lícula i comproveu l'increment de la variable a l'escenari.

Per saber la velocitat de reproducció de la pel·lícula, afegiu dins el fotograma 2 una altra variable anomenada segons:

 

 
 

frames++;

segons=Math.round(frames/12);

gotoAndPlay(1);

 
 


Observeu que la funció round() de l'objecte Math arrodoneix el nombre decimal.

» Afegiu un quadre de text dinàmic a l'escenari amb la variable segons.

» Observeu l'increment de la variable.

 

 
    La incidència enterFrame  
 
 

Aquesta incidència es produeix cada vegada que la reproducció passa sobre un fotograma que conté el clip de pel·lícula. Sempre està associat a un clip de pel·lícula.

Aquesta incidència s'utilitza, normalment, per crear un bucle d'un únic fotograma. A diferència del fotograma clau de la pel·lícula principal, aquesta incidència no necessita l'acció gotoAndPlay().

 
                       
 

» Creeu un arxiu nou amb el nom de rellotge.fla.

» Creeu una línia a l'escenari i convertiu-la en un símbol movieClip. Anomeneu la instància agulla1.

» Ara inseriu una incidència enterFrame amb aquest codi: this._rotation++;

» Executeu la pel·lícula i comproveu que la línia fa una rotació cíclica prenent com a punt central el punt del registre del movie clip agulla1.

» Arrossegueu aquesta línia perquè el punt de registre quedi a l'extrem inferior, d'aquesta manera, podrà fer la rotació com l'agulla d'un rellotge analògic.

La paraula clau this és un àlies que es refereix al mateix movie clip.

» Creeu una altra línia a l'escenari i convertiu-la en un símbol movieClip. Anomeneu la instància agulla2.

» Arrossegueu aquesta línia perquè el punt de registre quedi a l'extrem inferior.

» Ara inseriu aquest codi a la incidència enterFrame del movie clip agulla2:

this._rotation=_root.agulla1._rotation*2;

» Comproveu que la rotació de l'agulla2 és el doble que la de l'agulla1.

Observeu que, quan feu referència a un clip de pel·lícula des de fora d'aquest, heu d'escriure el camí o destí; en aquest cas, el clip agulla1 es troba a la pel·lícula principal, i per aquesta raó, escriureu la paraula _root.

En aquest exemple, heu vist com es poden relacionar dos clips de pel·lícula per crear animacions.

Deseu aquesta pel·lícula amb el nom rellotge.fla. Aquesta activitat serà el punt inicial per fer l'exercici d'aquest mòdul.