Simplificació del codi: funcions i arrays.  
 
 
 

Amb tot que heu fet a la pràctica 2 es poden fer moltes aplicacions. El missatge que dóna la informació, no ha de ser necessàriament una imatge com ara, por ser un só, un text, etc.
Ara bé, si tenim una aplicació amb programació a diferents fotogrames i volem fer canvis, hem de fer aquest canvis a tots ells.
Si fem una anàlisi del codi a la capa accions de cada un dels fotogrames i del que hi ha cadascun dels botons, veurem que hi esrructures que es repeteixen. Si aprenem a utilitzar funcions, petites o grans subrutines, la feina se 'ns simplifica molt, ja que només modificant la funció automàticament s' executa a totes aquelles instàncies on es crida.
En la nostra aplicació tenim quatre funcions a definir:

  • Una que ens posi les dades a cada fotograma, amb cada paraula
  • Una associada a cadascun dels botons, ajut, corregir i continuar.


 
     
 Desenvolupament de la pràctica    
   
   
  Obriu l'arxiu m5_p2.fla anterior i i deseu-lo com a m5_p3.fla.
A la capa accions del primer fotograma poseu-hi aquest codi.
 
     
 

ajut_acumulat = 0;
errors = 0;
/* iniciem els comptadors a 0 */
p_silabes = ["to-", "mà-", "quet"];
paraula = "tomàquet";
ajut = 0;
pagina = 1;
iparaula = "";
silabes = "";
ex = "<B><I>Exercici </I></B>"+pagina;
stop();
/*fins aquí el codi és el mateix, després el posarem en una altra funció*/
function ajuda() {
if (ajut<p_silabes.length) {
ajut++;
ajut_acumulat++;
silabes = silabes+p_silabes[ajut-1];
}
}
function corregir() {
if (iparaula == paraula) {
_root.clip_resultat.gotoAndStop(2);
pas = "Si";
} else {
_root.clip_resultat.gotoAndStop(3);
pas = "No";
errors++;
}
}
function continuar_acabar(){
if (pas == "Si") {
gotoAndStop(pagina+1);
}
}

 
     
 

Les tres funciones recullen la programació que abans teníeu a cadascun dels botons.
Per a definir una funció la sintaxi és sempre la mateixa:

 
     
 

function nom_funcio(){
codi de les accions a fer quan es cridi a la funció
}

Una funció pot dependre de més d'un o més paràmetre, en aquests cas s'han d' introduir els noms d'aquest paràmetres entre els parèntesi. Per exemple en el càlcul de l'impost de la renda és té en compte el total d'ingressos, nombre de fills, persosnes grans o amb minuvalues al teu càrrec etc.

function nom_funcio(param1,param2,param3){
codi de les accions a fer quan es crida a la fucnció
}

Per a llençar l' execució d'una funció només cal escriure el seu nom:

nom_funcio() o nom_funcio(valor1,valor2,valor3) segons si depenen o no de paràmetres.

 
     
  Al botó ajut del primer fotograma en lloc del codi que hi teníeu poseu el següent:  
     
 

on (press) {
ajuda()
}

 
 

Si mireu, la mateixa instrucció apareix als botons fins al fotograma 5, l' anterior al fotograma 6 on hi heu inserit un fotograma clau.
Poseu el mateix codi al botó ajut del fotograma 6. D'aquesta manera en clicar el botó, s' executa la funció ajuda().

 
     
 

Repetiu la mateixa operació en els botons corregir , continuar i acabar les crides a les funcions corresponents:

on (press) {
corregir()
}

on (press) {
continuar_acabar()
}

Comproveu que l' aplicació funciona exactament com a la pràctica 2.

Treballar amb funcions ens permet estructurar la programació i fer-la més intuïtiva i àgil. Ho practicàrem amb un exemple:
Si recordeu el clip_resposta tenia cinc fotogrames.

 

 
   
     
 

En la programació emprada fins ara jugàvem només amb els tres primers fotogrames. Si volem canviar les sortides del clip_resposta en fer la correcció només ens cal canviar la programació:

Segons la resposta fos o no correcta enviàvem el clip_resposta als fotogrames 2 o 3.

 
     
  Modificació de la funció corregir canviant els fotogrames del clip_respesta que es veuen al executar-la.  
     
     
     
 
function corregir() {
if (iparaula == paraula) {
_root.clip_resultat.gotoAndStop(2);
pas = "Si";
} else {
_root.clip_resultat.gotoAndStop(3);
pas = "No";
errors++;
}
}
 
 

 

Canvieu la programació per la següent:

 

 
  function corregir() {
if (iparaula == paraula) {
_root.clip_resultat.gotoAndStop(
4);
pas = "Si";
} else {
_root.clip_resultat.gotoAndStop(5);
pas = "No";
errors++;
}
}
 
 
     
 

Comproveu el resultat.

Amb aquest petit exemple es posa de manifest una de les utilitats de les funcions. Canviant només el codi de la funció aquesat actua sempre que es crida i no cal fer cap més modificació en la programació.
Això ens permet fer canvis d'una manera molt àgil:
Imagineu que tenim una aplicació amb molts fotogrames i que volem introduir canvis en la programació. Hem d' anar fent els canvis botó a botó, fotograma a fotograma i la tasca és molt feixuga i avorrida. Mentre que si aquesta en defineix en funcions al primer fotograma, fer-hi canvis és molt senzill.

 
     
 

Un cop arreglada la programació dels botons anem ara a modificar la posada de dades de cadascuna de les fruites. A la capa accions de cadascun dels fotogrames hi ha una part de codi repetida, anem a modificar-ho amb una nova funció.

A la capa accions del primer fotograma modifiqueu l' inici de l' aplicació, definint la funció inicia():

 
 

ajut_acumulat = 0;
errors = 0;
p_silabes = ["to-", "mà-", "quet"];
paraula = "tomàquet";
pagina = 1;
/* posem un una funció la part de codi que repetim a cada fotograma i llencem la funció perquè ens posi ens posi les dades del primer fotograma */
function inicia(){
/*declarem les variables com abans */
ajut = 0;
iparaula = "";
silabes = "";
_root.clip_resultat.gotoAndStop(1);
ex = "<B><I>Exercici </I></B>"+pagina;
stop();}
inicia();

 

 
     
  A les accions del segon fotograma modifiqueu-ne el codi  
     
 

p_silabes= ["ta-", "ron-", "ja"];
paraula="taronja";
pagina=2;
/* Només queda fora de la funció la part que varia, la resta
ja queda inclosa en aquesta. El codi queda més reduït.
En aquest cas l'estalvi és poc, però ens podem trobar amb aplicacions on la millora sigui molt més significativa */

inicia();



 
     
  A continuació modifiqueu el codi dels altres fotogrames:
 
     
  Al 3r:  
  p_silabes = ["ra-","ïm"];
paraula="raïm";
pagina=3;
inicia();

 
     
  Al 4rt;  
  p_silabes =["po-","ma"];
paraula="poma";
pagina=4;
inicia();
 
     
  Al 5è:  
  p_silabes=["plà-","tan"];
paraula = "plàtan";
pagina=5;
inicia();
 
     
  Al 6è:  
  p_silabes=["pe-","ra"];
paraula = "pera";
pagina=6;
inicia();
 
     
  Deseu els resultats com m5_p3.fla. publique-la i comproveu el funcionament de l' aplicació.
Com era d' esperar el funcionament és idèntic. La única cosa que hem fet ha estat simplificar-ne el codi.