Els sprites són elements gràfics que podem fer aparèixer a qualsevol posició de la pantalla. Podem tenir diverses vistes per a un mateix sprite i en cada moment podrem triar quin volem que es mostri, d'aquesta manera podrem fer que vagi canviant durant el joc o, per exemple, que sembli que gira.
Les imatges que farem servir per al fons i per als sprites estaran en un fitxer gràfic de tipus banc. Aquests fitxers sempre tenen 16 píxels d'amplada i 256 píxels d'alçada amb una paleta de 16 colors. Dins el fitxer hi ha representades 16 imatges de 16 ⨯ 16 píxels, que usarem per al fons (la primera) i per als sprites. Cal tenir en compte que el color magenta (100 % de vermell, 0 % de verd i 100 % de blau) es comporta com a transparent; això vol dir que en aquells llocs on hi hagi píxels magenta es veurà, de fet, el que hi ha a les capes de sota.
Per fer aquest exemple emprarem els dibuixos del fitxer bloc.bmp (el podem descarregar picant amb el botó dret sobre l'enllaç) que conté les imatges que es mostren a continuació:
De fet, la imatge és molt petita i el que observem aquí és una versió ampliada. En aquesta imatge hi ha cinc elements de 16 ⨯ 16 píxels cada un, les altres onze posicions estan buides. En els sprites el color magenta es veurà com a transparent i, per tant, deixarà veure el que hi ha sota. En la següent imatge mostrem les línies de separació i la quadrícula que ens ajuden a visualitzar-ho.
Podem fer servir algun programa (per exemple, IrfanView) per crear la imatge i guardar-la en format BMP de 16 colors.
Així, doncs, el primer element (índex 0) serà el fons, del segon (1) al cinquè (4) seran els sprites que farem servir i del sisè (5) fins al final (15) han d'estar al fitxer gràfic però, en el nostre cas, no els emprarem al programa.
El següent programa mostra un sprite que es va movent en diagonal (45°) per la pantalla. Quan arriba a un dels costats fa un efecte rebot. Mentre es mou, la imatge de l'sprite va mostrant, successivament, les quatre formes disponibles. Es tracta d'un programa i uns gràfics molt senzills, amb l'únic objectiu de mostrar com es podria fer qualsevol programa similar. Després de mostrar el programa comentarem el que fan les principals línies.
import ugame import stage
banc = stage.Bank.from_bmp16("bloc.bmp")
fons = stage.Grid(banc, 10, 8) # 16 * 10 = 160
# 16 * 8 = 128
bloc = stage.Sprite(banc, 1, 5, 5) # Inici a (5, 5)
joc = stage.Stage(ugame.display, 12)
joc.layers = [bloc, fons]
joc.render_block()
incx = 2 incy = 2
while True:
bloc.update()
pnt = bloc.frame
pnt = pnt + 1
if pnt > 4:
pnt = 1
bloc.set_frame(pnt)
bloc.move(bloc.x + incx, bloc.y + incy)
if not 0 < bloc.x < 144: # 160 - 16 = 144
incx = -incx
if not 0 < bloc.y < 112: # 128 - 16 = 112
incy = -incy
joc.render_sprites([bloc])
joc.tick()
Abans de res, hem de carregar el fitxer gràfic que conté el fons i els sprites i guardar-lo com a banc.
banc = stage.Bank.from_bmp16("bloc.bmp")
Tot seguit definim el fons. Li diem que agafi la imatge del banc que hem creat i que la repeteixi deu cops en horitzontal i 8 en vertical; així omplim tota la pantalla. Si poséssim uns altres valors també funcionaria però probablement no veuríem el que desitgem.
fons = stage.Grid(banc, 10, 8) # 16 * 10 = 160
# 16 * 8 = 128
Ara definim l'sprite que es mourà per la pantalla. Li diem que agafi la segona imatge (posició 1 del fitxer gràfic) i que la posi, per exemple, en la posició (5, 5).
bloc = stage.Sprite(banc, 1, 5, 5) # Inici a (5, 5)
Ara anem a fer que tot plegat es mostri a la pantalla. La primera de les tres línies crea l'objecte corresponent al joc. El 12 és un paràmetre que indica la velocitat, més ràpid com més gros. La següent línia indica les capes que tindrem, de més amunt a més avall; en el nostre cas, l'sprite ha d'anar damunt del fons. La darrera de les tres línies és la que efectivament mostra els elements a la pantalla.
joc = stage.Stage(ugame.display, 12) joc.layers = [bloc, fons] joc.render_block()
Un cop creats i situats els elements, el bucle de programa s'encarrega de moure el bloc per la pantalla i d'alternar les imatges de l'sprite. Les línies que fan el moviment són les següents:
bloc.move(bloc.x + incx, bloc.y + incy)
if not 0 < bloc.x < 144: # 160 - 16 = 144
incx = -incx
if not 0 < bloc.y < 112: # 128 - 16 = 112
incy = -incy
I aquestes altres són les que fan la seqüència d'imatges:
bloc.update()
pnt = bloc.frame
pnt = pnt + 1
if pnt > 4:
pnt = 1
bloc.set_frame(pnt)
Hi ha una manera més compacta d'escriure aquest tros de programa:
bloc.update()
bloc.set_frame(bloc.frame % 4 + 1)
Les dues darreres línies fan que l'sprite s'actualitzi a la pantalla i que s'esperi el temps corresponent al valor (12) indicat a la funció Stage.
joc.render_sprites([bloc])
joc.tick()
Esta obra de Oriol Boix está licenciada bajo una licencia no importada Creative Commons Reconocimiento-NoComercial-SinObraDerivada 3.0.