[LEZIONE 2] Le coordinate cartesiane, hello world animato

« Older   Newer »
 
  Share  
.
  1. KiNgOfUnIvErS
        Like  
     
    .

    User deleted




    In questo piccolo programmino in LUA dopo averlo lanciato con l'apposito player si presenterà un "hello world" direte voi:

    ""che differenza c'è tra quello di prima e questo?""

    bene in questo nuovo codice avremo un "hello world" in movimento che si sposta da destra a sinistra.

    Su PSP la velocità di aggiornamento verticale è 60 hertz,significa che il testo ha bisogno di 6 secondi per cominciare a spostarsi dalla stessa posizione.

    Da non dimenticare che in questo nuovo "programmino" avremo anche la modalità USB



    il posizionamento di un qualsiasi oggetto all'intenro di un piano bidimensionale (come il nostro schermo per esempio) avviene tramite coordinate cartesiane X e Y.

    X e Y individuano rispettivamente la posizione orizzontale e verticale dell'oggetto.conoscendo queste due posizioni si può definire la posizione nel piano.



    l'andamento di tali variabili è visibile in questo disegno:







    notare come i limiti siano definiti dalle dimensioni dello schermo.infatti ogni coordinata corrisponde a uno dei 480x270 pixels che compongono lo schermo.

    muover eun oggetto al di fuori di tale dominio vuol dire semplicemente farlo "uscire" dai margini dello schermo

    pertanto i limiti dove potremo vedere ogni oggetto,scritta,sprite,saranno da X,Y = 0,0 a x,y = 480,270



    -----------------------------



    <p>-- script per la modalità usb



    System.usbDiskModeActivate()



    -- inizializzo le variabili



    green = Color.new(0, 255, 0)

    time = 0

    pi = math.atan(1) * 4



    -- ciclo principale

    while true do

    screen:clear()

    x = math.sin(pi * 2 / 360 * time) * 150 + 192.5

    screen:print(x, 100, "Hello World!", green)

    time = time + 1



    if time >= 360 then

    time = 0

    end



    screen.waitVblankStart()

    screen.flip()

    End





    --------------------------------------



    il movimento del testo (che segue un andamento ondulatorio da destra a sinistra e viceversa) è ottenuto con l'utilizzo della funzione



    screen:print(x, 100, "Hello World!", green)





    che stampa la scritta "Hello World!" nella posizione X,Y,dove x è una variabile mentre y è fissa a 100.



    questo significa che nel ciclo principale

    avvene l'alterazione della coordinata orizzontale a seconda di quanto tempo è passato.







    while true do

    ...



    x = math.sin(pi * 2 / 360 * time) * 150 + 192.5

    time=time+1



    End







    la funzione math.sin restituisce il seno del numero compreso tra parentesi.

    tralasciando i parametri (che in questo caso governano il moto e i limiti di esso)

    si puo dire che la funzione math.sin varia nel tempo.



    Questo è molto importante perchè praticamente ogni programma scritto in LUA presenta un ciclo principale in cui ad ogni iterazione si assegnano dei valori a delle variabili,basati a volte sul tempo.

    in questo modo è possbile animare oggetti,aggiornare scritte e catturare gli imput del controller.





    Ora analizziamo una variante dello script precedente:

    ----------------------------







    -- inizializzo le variabili



    green = Color.new(0, 255, 0)

    white = Color.new(255,255,255)

    time = 0

    pi = math.atan(1) * 4



    -- ciclo principale

    while true do

    screen:clear()



    x = math.cos(pi * 2 / 360 * time) * 150 + 192.5

    y = math.sin(pi * 2 / 360 * time) * 150 + 192.5



    screen:print(x,0,"[X]", white)

    screen:print(0,y,"[Y]", white)

    screen:print(x, y,".", green)

    time = time + 1



    if time >= 360 then

    time = 0

    end



    screen.waitVblankStart()

    screen.flip()

    end



    ----------------------------



    In questa variante la novità principale è che viene assegnata la variabile y.

    in questo modo è possibile muovere la scritta anche verticalmente.

    in questo esempio attraverso la funzione math.cos è possibile usare il coseno del valore assegnato tra parentesi.

    Sebbene si presume che tutti sappiano il significato di seno e coseno (due funzioni matematiche basilari)lo spieghiamo meglio qui.

    il seno e il coseno sono due funzioni complementari che variano da 0 a 1.

    quando il seno è 0 il coseno è 1 e viceversa.

    entrambi possono essere a 0.5,ma la loro somma è sempre 1.

    data questa proprietà è possibile utilizzare seno e coseno all'intenro delle coordinate cartesiane (X e Y) per fare descrivere un cerchio alla nostra scritta.





    x = math.cos(pi * 2 / 360 * time) * 150 + 192.5

    y = math.sin(pi * 2 / 360 * time) * 150 + 192.5





    in questo modo assegnamo a X il coseno e Y il seno del valore passato in funzione del tmepo trascorso(cio che è tra parentesi).

    a questo aggiungiamo 192 a ciascuno per definire attorno a quale centro girerà la scritta.(x=192.5,y=192.5)

    In questo caso il cerchio sarà per metà fuori dallo schermo perchè la psp ha formato 16:9 ma poco importa ai fini didattici dell'esercizio.



    ed ecco la serie di funzioni che da senso al tutto.







    screen:print(x,0,"[X]", white)

    screen:print(0,y,"[Y]", white)

    screen:print(x, y,".", green)







    Le prime due servono a stampare un indice che seguirà la scritta che gira attraverso la funzione cos o seno.

    La prima funzione scrive una "[X]" che si sposta in alto da sinistra a destra seguendo la posizione X -orizzontale della scritta che gira.la sua posizione sarà sempre x,0 dove x è la stessa x della scritta centrale.

    Lo 0 serve a posizionarla in alto.



    La seconda stampa a schermo una Y in posizione 0,y dove y è la stessa y della scritta centrale.Lo 0 assegnato alla coordinata orizzontale tiene la scritta ancorata al lato sinistro dello schermo.



    Infine,l'ultima funzione stampa un puntino (".") alle coordinate x,y ,usando colore verde (green=0,255,0 assegnato in testa al programma).dato che le funzioni x e y seguono andamenti oscillatori complementari,il risultato sarà che tale scritta seguirà una rotazione attorno al punto x=192.5,y=192.5



    Se volessimo invertire il senso di rotazione?

    Semplicemente basterebbe invertire le funzioni seno e coseno.Assegnado alla X il seno e alla y il coseno nelle funzioni relative:





    x = math.sin(pi * 2 / 360 * time) * 150 + 192.5

    y = math.cos(pi * 2 / 360 * time) * 150 + 192.5









    Ora analizziamo la seguente variante:



    -------------------------





    -- inizializzo le variabili



    green = Color.new(0, 255, 0)

    white = Color.new(255,255,255)

    xspeed = 1

    yspeed = 1

    x=0

    y=0



    -- ciclo principale





    while true do

    screen:clear()



    if x==0 then

    xspeed=1

    end



    if x==470 then

    xspeed=-1

    end



    if y==0 then

    yspeed=1

    end



    if y==260 then

    yspeed=-1

    end



    x=x+xspeed

    y=y+yspeed



    screen:print(x,0,"[X]", white)

    screen:print(0,y,"[Y]", white)

    screen:print(x, y,".", green)



    screen.waitVblankStart()

    screen.flip()



    end



    -------------------------



    In questo script lua abbiamo introdotto un semplice motore fisico.

    il puntino che si muove,ora rimbalza letteralmente sui bordi dello schermo.



    come sappiamo,nella realtà , i corpi in movimento hanno una propria velocità e direzione di moto.

    sappiamo che nel piano cartesiano (X,Y) ogni movimento è scomponibile in due direzioni X e Y (l'abbiamo visto sopra con l'esempio della circonferenza).

    ora,se vogliamo che il nostro puntino rimbalzi sui lati dello schermo,dobbiamo monitorare le coordinate orizzontali e verticali x e y per determinare se è il momento di rimbalzare o di proseguire dritto.

    in primo luogo definiamo che il puntino/pallina alla partenza dovrà essere in x=0,y=0 e con velocità orizzontale=1 e verticale=1





    xspeed = 1

    yspeed = 1

    x=0

    y=0





    definire che xspeed e yspeed (le nostre due componenti del moto) hanno velocità uguale significa che ci stiamo muovendo in diagonale da destra a sinistra e dall'alto verso il basso.





    --1

    if x==0 then

    xspeed=1

    end

    --2

    if x==470 then

    xspeed=-1

    end



    --3

    if y==0 then

    yspeed=1

    end



    --4

    if y==260 then

    yspeed=-1

    end







    in questo pezzo,infatti diciamo che:

    in 1 se la posizione x è uguale a 0 (margine sinistro,allora la velocità x deve essere 1 (ovvero movimento a destra)



    in 2 chiediamo che se orizzontalmente il puntino tocca la posizione 470 (che è vicino al margine del nostro schermo di 480*270 pixels) xspeed (la velocità x / orizzontale)deve prendere valore -1, ovvero tornare a sinistra del piano.





    stessa cosa,ma riferita alla posizione verticale,avviene nei punti 3 e 4:

    nel punto 3 diciamo che se la posizione è 0 (in alto),allora la velocità sarà a valore positivo, ovvero dovrà spingere la variabile y ad aumentare nel suo valore,e quindi a scendere nel piano cartesiano.



    nel punto 4 infine diciamo che se il puntino tocca con la variabile y il valore y=260 (che è vicino al limite dell'altezza dello schermo di 480x270 pixels)yspeed dovrà prendere valore negativo yspeed=-1,e "tornare sù¹".



    In questi quattro punti come si può notare abbiamo semplicemente definito i margini del nostro schermo



    1=limite sinistro

    2=limite destro

    3=limite alto

    4=limite basso



    in questo modo,abbiamo definito le situazioni limite in cui è necessario intervenire per variare l'andamento,ovvero per "rimbalzare".



    volendo possiamo aggiungere altri paramtrei come l'inerzia,la massa o altre variabili fisiche,ed ottenere un'ottima base per un gioco con biglie o oggetti in movimento con poca profusione di codice.





    Tutorial originale : http://psp-ita.com/





     
    .
0 replies since 8/1/2008, 17:10   1030 views
  Share  
.