Unitat06_Les possibilitats de micro:bit II
P00_Les funcions
Excepcionalment, en aquest tema crearé un P00 per a explicar les funcions, per tal que proveu l'exemple de makecode. La raó és que les funcions, més que ser un programa en sí, es poden utilitzar en tots els altres, per poc que els vulguem ampliar.
La idea és fer una pràctica per a explicar la utilitat de les funcions en programació. També es coneixen amb el nom de subrutines.
Si pensem en un programa que calculi les àrees de determinades figures geomètriques, podem fer-lo de dues maneres:
- Posem TOT el programa en un mateix bloc. El programa serà més llarg, i per tant més difícil d'entendre, de seguir i de corregir.
- Fem un programa principal i anem cridant quan ens convingui a un programa que ens calculi la superfície de la figura escollida. Cada programa cridat rep el nom de subrutina o funció. Guanyem amb claredat.
L'exemple que us proposo i explico és el de fer un blink (parpelleig) d'un led usant una funció. Veureu que, si el programa s'ha de repetir per a varis valors de temps diferents, la funció ens ve com l'anell al dit.
Per crear una funció heu de seguir la ruta Avanzado-Funciones. Un cop ja hem posat nom a la funció blink, fem el programa, i després el cridem les vegades que ens convé. Per tant, evitem duplicar codi.
En aquest cas, si polsem A, establim un temps de 200 ms, cridem a la funció i el led parpelleja cada 200 ms.
Si polsem el botó B, usant la funció Blink, no cal que dupliquem el codi en el programa principal, ans cridem a la funció i li enviem un temps d'un segon. Hem enviat el contingut de la variable time a la funció, i ella repeteix el codi amb un temps diferent.
P01_Com moure un sprite.
Aquesta pràctica permet treballar la llibreria Juego. Aneu a Avanzado-Juego.
Fixeu-vos que micro:bit només té dos polsadors integrats, però A+B també es pot usar com si fos un polsador C, i a la llibreria Entrada, la instrucció Si (agitado) té vàries opcions que poden ser usades com a interruptor.
La llibreria Juego està basada en Sprites. Un sprite és un objecte que es pot definir com una variable i que està associat a un dels leds de la matriu. El creem amb la instrucció create sprite. Aquesta associació a un led ens estalvia feina.
En aquesta pràctica us he posat petits programes. Comencem sacsejant la micro:bit. Fem el següent:
- Creem un sprite i el led (4,4) s'il·lumina. Inicialment, l'angle del sprite és de zero graus (apunta cap a la dreta).
- Gira 135º, apunta al centre i s'hi desplaça. Es mostra durant t=2s i l'esborrem amb un delete point.
Analitzem ara què lassa si pressionem el botó B:
- Un cop creat l'sprite al centre de la pantalla de leds, el mostrem durant 2s, li diem que canviï l'orientació i que apunti 45º cap a la dreta. El desplacem 2 posicions. Ja tenim l'sprite a la posició (4,4), amb una orientació de 45º.
- Si el volem fer tornar enrere, l'hem de fer girar 180º, tant a l'esquerra com a la dreta, i el desplacem cap al centre, el mostrem durant 2s i l'esborrem.
El codi dels botons A i A+B són semblants, però ens basem amb instruccions de repetició - quelcom que els ordinadors saben fer millor que nosaltres - per moure l'sprite per la pantalla. La pausa d'1 ms no és un caprici, vaig triar aquesta perquè el led del centre no s'il·luminés gens. També podeu provar d'esborrar la pantalla d'inici.
P02_Moviment lineal
En aquesta pràctica ens basem amb un bucle For(para). Recordeu que si la condició s'acompleix, s'executen les instruccions interiors del bucle.
Aquest programa us servirà de base, per tal de demanar a l'alumnat que hi jugui, i faci desplaçaments dreta-esquerra, amunt-avall, i fins i tot, com hem vist en la pràctica anterior, fer desplaçaments amb una certa inclinació.
"No hase falta desir nada más".
Jugueu!!
P03_Moviment circular
Creem l'sprite a la posició (0,0).
Desplaçar i girar.
Aturar i continuar.
Canvieu la pausa-delay per veure millor com funciona.
No es tracta d'un moviment estrictament circular, però almenys sí que ens en dibuixa la trajectòria. Per tal de tenir millor semblança hem de pensar amb una pantalla de leds per a microbit. Aneu al google i poseu "pantalla de leds para microbit" i trieu.
No us puc aconsellar de moment. No les he provat, però és una opció a tenir present, el cost no és prohibitiu.
P04_El pong
L'objectiu d'aquest programa és familiaritzar-nos amb makecode, particularment amb les llibreries Juego i Funciones.
En aquest cas, la funció no caldria crear-la, ja que si la cridem sempre, posem tot el codi dins del para siempre i en paus. La idea de fer servir funcions serveix perquè, si més endavant volem continuar treballant amb el codi, ja en tenim una part de separat del programa principal, que es troba al para siempre.
Els bucles al presionar el botón A i al presionar el botón B són events; o sia, quelcom que el programa ha de fer si hom polsa A o B.
Es poden assimilar també a funcions. Si mireu la barra superior blava de makecode, al centre, podem veure el codi clicant a JavaScript. Són com subrutines-funcions, amb el codi separat del programa principal.
Us lliuro l'enllaç d'on he tret el programa. S'hi inclouen molts vídeos i molts arxius pdf, entre ells el d'aquest programa. La web té continguts relacionats amb scratch, i micro:bit té fàcil interconnectivitat amb scratch, com ja veurem a la Unitat 09.
És cert que el programa és millorable. Jugueu-hi i de seguida veureu que segons on deixeu la raqueta la pilota sempre hi toca, i el joc no s'acaba mai. Per a millorar-lo, es pot usar un sol led enlloc de 2 per a la raqueta, augmentar la velocitat, obligar a que la raqueta toqui als extrem/s sí o sí, etc. Per això us he parlat abans de la pantalla. Amb una pantalla amb més leds i una mica de velocitat el joc engrescaria més. Una altra opció és fer el programa amb Scratch, i controlar les raquetes amb micro:bit.
P05_Escurabutxaques
Aquest joc és del mateix autor que l'anterior. Gràcies!!!
Expliquem-ho:
- Bloc al iniciar. Mostrar cadena A ens diu que si polsem A s'inicia el joc. Definim 3 imates: costumeA(la que dóna premi), costumeB i costumeC(que no tenen premi).
- Bloc al presionar A. Si polsem A, sona una melodia que mira d'imitar la de les màquines escurabutxaques. Repetir 4 veces mira d'imitar el moviment de les imatges.
- Definim la variable winner. Serà un nombre aleatori entre 0 i 2. Si winner = 0, guanyem. Associem winner a costume A. Sona música de guanyador i es mostra la icona del guanyador. Si winner val 1 o 2, perdem. La música i la icona ho indiquen.
- Després d'una espera de t=3s, tornem a mostrar la lletra A per pantalla, ja podem tornar a polsar.
P06_Car racing game
Aquest joc l'he extret de la pàgina web:
https://www.101comEl puting.net/microbit-car-racing-game/
Hi podeu trobar uns quants projectes per a vosaltres. Moltes gràcies!!!
Sobretot amb programes més llargs, recordeu que polsant el botó de la dreta sobre cada bloc de la llibreria podeu obtenir ajuda sobre ell, amb exemples de codi aclaridors.
Player car és el cotxe que condueix el jugador. Els altres baixen en direcció contrària. Es tracta de no xocar.
Programa per a cada cotxe que hem d'esquivar. Analitzem el codi de car0.
Mentre no s'acabi el joc, anem creant els cotxes que baixen. La pausa la posem perquè no baixin al mateix temps.
Mentre estem jugant, quan el cotxe arriba a la darrera fila (y=4), si car0 xoca amb playerCar (que és el cotxe que controlem nosaltres), s'acaba de fer el recompte de la puntuació i s'acaba el joc (mireu el darrer para siempre).
Si el joc continua, sumem un punt cada vegada que car0 arriba a la fila y=4, i el tornem a posar a la fila y=0, i el tornem a llançar avall prèvia pausa aleatòria. Per anar de dalt a baix incrementem y en 1 cada 500 ms.
Botó B. Moviment cap a la dreta
Botó A. Moviment cap a l'esquerra
Observacions:
- L'autor proposa que la els cotxes vagin més ràpids cada a mesura que la puntuació va augmentant
- L'autor també proposa que canviem aquest joc en un joc del tipus "captura la fruita", on enlloc d'evitar els sprites que cauen, el jugador hauria d'intentar agafar-los i sumar puntuació cada vegada que ho faci
- A programar bé ajuda molt mirar de millorar el codi. Proveu de fer-ho en aquest cas
- Mireu d'utilitzar funcions per a fer el programa enlloc d'usar tants para siempre
- Hem usat algunes instruccions de la llibreria Juego que ens han simplificat el programa
En el petit programa de l'esquerra veiem com fer baixar el cotxe, sense utilitzar la llibreria Juego. Usant aquesta llibreria, ja associem la variable a un led directament, però a més ja no cal que li diguem al led que es mostri -ja ho fa quan el creem-, i tampoc no cal que li diguem que s'oculti quan avança.
La pausa regula el temps de baixada. Proveu 1000 ms per veure la diferència sense haver d'esperar tant.
La variable y es va incrementant, el led tira avall i quan arriba a la quarta fila (recordeu que comencem a comptar a partir del zero), tornem a posar el led-cotxe a la fila zero.
P07_Imatges. Visualització
El programa pretén treballar la llibreria Imágenes.
Visualitzem fletxa amunt o fletxa avall segons polsem A o B.
L'offset és un desplaçament. Proveu de posar un offset de 1 a una imatge i un offset de -1 a l'altra.
Per esborrar la pantalla, pressionem el pin 0. Poseu un cable directament entre P0 i GND (la massa o punt de referència de voltatge de la micro:bit). Mireu de no tocar el cable amb els dits. Connecteu només el cable entre P0 i GND. Si us hi connecteu vosaltres, la resistència serà més gran i P0 s'activarà "més menys que més".
La instrucció mostrar leds de la llibreria Básico té els mateixos efectes a la pantalla que show image, en aquest cas. Noteu que el codi JavaScript és diferent. La imatge a mostrar és més genèrica i té altres instruccions, en canvi mostrar leds serveix específicament per això.
P08_Posicionament d'imatges
Polsant A, es mostres les 5 primeres columnes de la imatge arrows. Polsant B, es mostres les columnes de la 6 a la 10. Es visualitzarà la fletxa amunt.
L'offset de 5 desplaça la imatge 5 columnes a l'esquerra. Es visualitzarà la fletxa avall.
Polsant A i B alhora, esborrem la pantalla.
P09_Desplaçament d'una imatge
La instrucció scroll permet desplaçar la imatge cap a la dreta o cap a l'esquerra, segons tinguem un scroll positiu o un scroll negatiu. Aquest scroll es duu a terme cada 800 ms, en aquest cas. Podem posar una variable i anar-la variant per regular el temps.
Una vegada més. per entendre-ho millor, poseu un offset = 1 i un offset = -1. En el primer cas, el desplaçament és cap a la dreta; en el segon, cal a l'esquerra.
P10_Arrows images
Botó A On.
Anem mostrant les fletxes seguint la orientació que ja té preestablerta la instrucció show image: són els paràmetres de la instrucció.
P0 On. Fletxa apuntant a l'oest (esquerra)
P1 On. Fletxa apuntant a l'est (dreta)
Si no voleu muntar els polsadors, agafeu un cable i curtcircuiteu P0 i GND, i després P1 i GND.
P11_Icones
La pràctica pretén ensenyar com mostrar icones per la pantalla, de la col·lecció que us ofereix makecode. Hem vist en anteriors pràctiques com crear-les. Remarcar que no només les podem activar amb polsadors, sinó amb altres elements de la llibreria Entrada.
Hem associat cada icona a una variable i mostrant aquesta variable hem mostrat la imatge, mitjançant la instrucció show image, de la llibreria Imagenes.
P12_Arrow number
Al bloc Al iniciar, inicialitzem la variable i a Norte. Associem una variable (a,b,....h), a una imatge(fletxa).
Numeració: Norte és la núm. 0 i Noroeste la núm. 7
Quan premem A, si la variable i és més petita o igual que el número associat a la fletxa Noroeste, que és la darrera i correspon a la lletra h, anem incrementant i mostrant per pantalla el seu número associat.
- És important que la darrera instrucció del botó A sigui un set(establecer), no un change(cambiar). Proveu de polsar A i B alternativament i noteu la diferència amb set i amb change. Expliqueu-la.
Quan premem B, mostrem la imatge associada a la variable en qüestió, seguint l'ordre de la seqüència.
P13_Llibreria text
AVÍS PER A NAVEGANTS. Utilitzeu la llibreria text en anglès, no en castellà. Aquesta llibreria no va estar completament traduïda al castellà fins al mes d'octubre de 2019 aproximadament. Encara ara els programes que us ofereixo no funcionen en castellà. Tingueu-ho en compte. Recordeu un cop més que, com que es tracta d'una llibreria que encara no havíem estudiat, feu botó de la dreta a un bloc/instrucció i llegiu-ne la funció que té cada bloc/instrucció. Normalment les explicacions venen acompanyades d'un petit programa explicatiu. Proveu!!!
En el bloc on start definim dues variables string (seqüència de caràcters).
Si polse P0, ens mostrarà el número 0, que ocupa el lloc 23 de la cadena/string, i només llegim un valor de la cadena (lenght=1). Amb la instrucció parse number comptem partint del número 1, i si li demanem que ens mostri el número associat a un caràcter ASCII diferent d'un número (una lletra, caràcter espai, etc.), ens mostra l'expressió NaN (not a numner).
Polsant B, les comparem d'acord amb el seu ordre en la taula de caràcters ASCII (a cada caràcter se li assigna un número).
Per exemple, la cadena Antoni serà menor que la cadena Josep, ja que la A és anterior a la J a l'alfabet.
- Proveu de fer un petit programa que us mostri la longitud de petites cadenes (el nom d'uns quants companys, per exemple).
I polsant A:
- mostrem la cadena char i la seva longitud
- mostrem la primera lletra de la cadena H (el primer caràcter)
- Ajunta els strings Hello i
- mostra la subcadena(part d'una cadena) a partir del número 5, i amb una longitud de 6
Noteu que comencem a comptar a partir del zero, i que els espais també els comptem. Una vegada més, per a analitzar els programes, agafeu part del codi i proveu-la amb el polsador A+B. Divide y vencerás.
Us poso, per a acabar de treballar la llibreria text, un programa que cerca un nom dins d'una llista. Per provar el programa, escriviu el nom de l'ocell que voleu saber si és a la llista dins del bucle For, al primer set.
Inicialitzem la llista (array) dins d'un set.
Comparem el nom de l'ocell que volem cercar (crow) amb els que hi ha a la llista. No cal que la definim, el programa ja identifica el contingut de la variable bird com a strings.
Si el resultat de la cerca ha estat infructuós, la variable no=1 (certament, no hem trobat la paraula).
Si hi ha la paraula a la llista, la variable booleana Yes ha de valer 1. i la variable no=0. Imprimim que hem trobat la paraula (string Yes).
Per provar, doneu-li al reset o proveu al simulador. Inicialitzeu-lo cada vegada que poseu una nova paraula al primer/únic set del for.
P14_Neopixel
Pel que fa a aquests tipus d'anells lluminosos, la varietat recomana mirar els data sheet. Assegureu-vos que funcionen amb la micro:bit abans de comprar-los. Si teniu Arduinos, cap problema. Molts d'aquests anells o tires lluminoses han estat dissenyats per Arduino.
Els anells tenen 3 cables: positiu, negatiu i el cable que va al pin.
Hem usat la referència WS2812B.
Cal usar la llibreria Neopixel, compatible amb Makecode.
Si no us funciona, proveu-ho amb Arduino. No ho alimenteu externament, si veieu pel data sheet que Arduino us ho pot alimentar.
El que hem definit és de 24 leds. Seleccionem colors i mostrem. Simuleu el programa.
P15_Neopixel. Control via acceleròmetre
Al iniciar, definim l'anell, de 24 leds.
Aquest programa controla el color del primer led.
Són programes que podeu trobar a l'ajuda de la mateixa llibreria.
En aquest programa, un cop hem definit el color segons el moviment de la targeta, i anem desplaçant aquest led per l'anell Neopixel. Si no movem la targeta, els leds no s'il·luminen.
P16_Neopixel. Seqüència amb leds
Ara configurem 8 leds.
Fem una seqüència en què activem un led durant una pausa i el desactivem. Després fem el mateix amb l'altre led i així fins el vuitè. El resultat el podeu veure a la simulació.
Si poseu el repeat al iniciar, la seqüència només s'executarà una vegada. Si el poseu en un forever, s'executarà sempre.
P17_Neopixel. Arc de Sant Martí
La base d'aquest exercici és la instrucció show rainbow, inclosa a la llibreria Neopixel.
Per entendre el funcionament del programa, és interessant que l'alumnat tregui i afegeixi instruccions als blocs del programa, així entendrà què fa cada instrucció i aconseguirà efectes lluminosos diversos. Així, amb el bloc Al iniciar aconseguim l'efecte, i amb el bloc forever/para siempre la rotació. Proveu!!
P18_Neopíxel.Semàfor
Aprofitem l'anell que tenim i el configurem per a fer un semàfor. Amb 7 leds en podem fer dos i deixar un led usat a l'exemple del polsador A.
Si posem 3 leds a al iniciar, en tenim prou.
P19_Neopixel. Canvi de sentit i de colors
Proveu ara el següent exemple. Canvieu-ne els paràmetres.
Pràctiques proposades
P20_ Cerca un número en un array
N'hem fet un de similar en aquesta unitat. Es tracta de comparar l'element que volem cercar amb els de cada element de la llista.
P21_ Sumem cadenes
Feu un programa que sumi vàries cadenes en una de sola. Mostreu per pantalla el resultat.
P22_ Funcions
Creeu una funció amb el nom de blink. Invoqueu-la des del bloc forever. Testegem A i B de manera que:
- Si polsem A, activem un led de la matriu durant un temps t1
- Si polsem B, activem un altre led de la matriu durant un temps t2
P23_ Neopixel
Feu una pràctica programant la llibreria Neopixel. Configureu el bloc Al iniciar com a la pràctica 15. Feu la seqüència:
- Posar tots els leds en un color. Esperar un segon
- Repetiu-la un determinat nombre de vegades