Moure un element

Veurem quines opcions tenim per moure un element per la pantalla com a pas previ per fer un joc.

Més concretament es pretén donar resposta a les preguntes següents:

• Com podem moure un element per la pantalla?

• Com podem programar la interacció amb un element en moviment?
• Què és una variable i com la podem utilitzar?

Per poder actuar sobre un element que tenim a la pantalla, aquest element ha d'estar sobre un llenç
(Canvas) , que és l'element amb el que podem interactuar quan

l'app s'està executant des del dispositiu mòbil. Així doncs, creem aquest
element a la nostra app. Les mides del Canvas les hem de modificar de
manera que el llenç ocupi tota la pantalla. Canviem les propietats Alto i
Ancho i triem l'opció Ajustar al contenedor

A continuació necessitem l'element que es mourà per la pantalla. Aquest element serà el component

ImageSprite que també trobarem a la categoria . Aquest

element ha de tenir una imatge. Podem mirar a internet la imatge que més ens agradi, tenint en
compte que ha de ser petita com una icona. Aquesta imatge la posem a la propietat Foto de
l'element ImageSprite. En aquest exemple hem posat una fletxa:

Recordem que l'ImageSprite l'hem de col·locar sobre el llenç, en la posició que vulguem.

Movem la fletxa
Per moure la fletxa tenim diferents opcions. La primera és anar a la propietat Velocidad del
component ImageSprite i posar el valor que vulguem, per exemple 5. L'altra és fer que, en
inicialitzar-se l'Screen1; és a dir, quan iniciem l'execució de l'app, assignem el valor 5 a la velocitat
mitjançant aquestes instruccions:
Ara la fletxa ja es mou, però quan toca amb el límit del Canvas s'atura i ja no fa res més.
Podem fer que reboti quan arribi al límit:

S’ha de clicar en per poder utilitzar el procediment

Força avorrit… Una nova cosa que podríem afegir a la fletxa és que no sempre comencés el
moviment cap al mateix lloc, sinó que comenci en una direcció a l'atzar:

Com que la fletxa està al Canvas podem interaccionar amb ella. Anem a fer que puguem modificar
la direcció de la fletxa amb el dit en la direcció que vulguem:

Canvi de velocitat
Finalment anem a fer que la fletxa vagi cada cop més ràpid. Per fer-ho introduirem el concepte de
variable.
Podem imaginar una variable com una capseta on guardem un valor (qualsevol valor). Sovint, en
els programes que farem ens caldrà guardar valors i anar-los canviant a mida que el programa
s'executa. El lloc on guardem aquests valors és una variable. En el nostre cas, tenim una capseta
anomenada velocitat on guardarem un número que indicarà la velocitat amb la que es mourà la
pilota.

Així doncs, el primer que cal fer és declarar la variable, és a dir, comunicar a l'App Inventor la
seva existència. Això ho farem amb la instrucció Initialize global de la categoria Variables, tot
assignant-li un valor:

Ara hem de modificar el programa que teníem abans per assignar la variable "velocitat" com a
velocitat de la fletxa:
Per utilitzar el procediment hem de posar-mos damunt de la

variable en el procediment i arrossegar-lo

Per acabar hem de decidir en quin moment es fa el canvi de velocitat. En el nostre exemple farem
aquest canvi cada cop que modifiquem la direcció de la fletxa amb el dit:

Veiem que per canviar la velocitat agafem el valor anterior (tomar), li sumem 1 i el resultat
l'assignem (poner) al nou valor de la velocitat.
Guarda el projecte amb el nom moure_nomteu.aia

Podem ampliar el programa fent que es produeixi un so quan l’objecte toca un costat i amb l’eina
textoavoz ens informe amb quin angle l’hem projectat.