Benvenuti nel vostro AOZ Studio Lesson 6 – di Neil Ives (Questa lezione espande la lezione 3)
Nota di RayShell: Solo il testo nelle caselle di codice nere di queste lezioni è codice AOZ; fate clic nell’angolo in alto a destra su copia per copiare il codice negli appunti. Andate nell’editor di AOZ Studio™ e incollate il codice nel vostro programma. Il testo //verde è un commento da digitare o incollare riga per riga nella finestra dell’editor. Il testo verde dopo il simbolo // è solo per informazione e per capire il funzionamento e la logica del codice AOZ scritto. È sempre una buona idea e molto importante commentare il codice mentre lo si crea per avere una visione d’insieme dell’intero progetto, in modo da poter leggere il proprio codice con estrema facilità anche a distanza di anni.
La cosa più importante è sentirsi liberi di giocare e provare i comandi di base appresi nei propri progetti di prova. Cambiate i valori, inserite le vostre parole e idee all’interno del programma. Se sbagliate qualcosa e premete il pulsante Esegui, il comando Esegui si fermerà e mostrerà il punto in cui si trova l’errore con un numero di riga nella finestra dei messaggi. Può anche accadere che il comando di esecuzione avvii l’applicazione, ma non si veda nulla o non si veda ciò che ci si aspettava di vedere. A questo punto è necessario modificare il codice in modo che la sintassi e l’ordine siano corretti per lavorare con AOZ e produrre l’output desiderato.
Nell’editor, clicca sul simbolo della carta in alto a sinistra per creare un nuovo progetto. Selezionare Others nel menu di sinistra e scegliere Progetto personalizzabile., cancellate la voce “My Application” e date al nuovo progetto il nome Lesson 6.
Troverai quindi il tuo programma nella cartella Documents/My AOZ Applications/Lezione 6. Lì troverai anche la sottocartella ‘resources’ dove sono memorizzate anche immagini e suoni.
Dopo aver creato il nuovo progetto, anche le cartelle per le immagini e i suoni sono state create nella cartella del progetto. Per usare immagini o campioni nel vostro programma, dovete renderli disponibili ad AOZ Studio nella cartella del vostro progetto. Per questa lezione copieremo le immagini e gli esempi dalla cartella AOZ Studio Tutorials e li incolleremo nel vostro progetto Lesson 6. Usando Windows Explorer, aprite la cartella C:/AOZ_Studio/app/AOZ Store/ Tutorials/1. Start/Lessons to start with – ENGLISH/AOZ Studio Lesson 6 e aprite la sottocartella resources come mostrato nell’immagine e copiate la cartella samples.
Poi vai alla tua nuova cartella di progetto nella cartella Documents/My AOZ Application e incolla lì la cartella samples copiata.
Le immagini sono memorizzate nella cartella images. Usando Windows Explorer, apri la directory C:/AOZ_Studio/app/AOZ Store/ Tutorials/1. Start/Lessons to start with – ENGLISH/AOZ Studio Lesson 6 e lì la sottocartella resources come mostrato nell’immagine e apri la cartella images. Selezionate tutte le immagini e copiatele.
Poi vai al tuo nuovo progetto sotto Documents/My AOZ Applications/Lezione 6 /resources e apri la sottocartella 1.images. Ora incollate lì tutte le immagini copiate. Fatto!
Tutti i preparativi sono fatti, ora potete iniziare a programmare il vostro primo gioco.
Buon divertimento 🙂
Allora siamo pronti, cominciamo!
/////////////////////////////////////////////////////////////
// Questa lezione si basa su ciò che è stato imparato nelle lezioni precedenti //
/////////////////////////////////////////////////////////////
Qui spiegheremo e useremo quanto segue:
Combinazione di procedure
Aggiungere segmenti di stringa, (append)
Sprites
Testo grafico
While/Wend Rettifica
Inkey$
Variabile booleana
Ripetizioni a If/Else/Endif
Registrazioni sonore (samples)
////////////////////////////
// Impostazioni del programma//
////////////////////////////
#splashScreen:False //Impostatelo su "True" per vedere l'effetto
#fullScreen:true
#googleFont:"acme" //Imposta il carattere grafico, vedi nota più avanti.
Curs Off //Il cursore dello schermo non è necessario.
////////////////////////////////
//Impostare i segmenti di stringa //
////////////////////////////////
ST9$="Cosa dovrebbe spostare? "
ST10$="(U)omo "
ST11$="(V)olpe "
ST12$="(P)ollo "
ST13$="(S)acco di corn"
All$=ST9$+ST10$+ST11$+ST12$+ST13$
//Nota come le stringhe sono unite insieme, (aggiunte).
Quando All$ viene speso questo è sullo schermo: “Cosa dovrebbe muovere? (U)omo (V)olpe (P)ollo (S)acco di mais”. Durante il gioco, diverse stringhe individuali si sommano per mostrare le scelte al giocatore. Nota: non dimenticare di aggiungere uno spazio alla fine di un singolo segmento di stringa per visualizzare correttamente la stringa totale.
////////////
// Global //
////////////
Come discusso in precedenza, il comando “Global” rende le variabili specificate con disponibili a tutto il programma:
Global All$,ST9$,ST10$,ST11$,ST12$,ST13$,STOPME
//////////////////////
// Variabile booleana //
//////////////////////
STOPME viene utilizzata come variabile booleana. I valori booleani sono come un interruttore della luce, possono essere solo in uno dei due stati, ad esempio ‘Vero/Falso’, o ‘0/1’, o ‘On/Off’.
Abbiamo utilizzato il metodo booleano per arrestare il programma.
Si veda la nota che segue STOPME nel ciclo principale del programma.
////////////////////////
// Caratteri grafici di testo //
////////////////////////
Qui presentiamo i caratteri grafici di testo:
Nelle lezioni precedenti abbiamo usato i font di testo predefiniti per stampare sullo schermo.
In questo gioco vengono nuovamente utilizzati per mostrare i messaggi nella parte superiore dello schermo.
Tuttavia, questa volta, per la schermata introduttiva e per i testi di feedback degli utenti abbiamo utilizzato il font grafico di Google più interessante, chiamato “Acme”.
I font grafici possono essere posizionati in qualsiasi punto dello schermo utilizzando le coordinate grafiche piuttosto che le colonne e le linee di testo, ad esempio, Testo 40,170
Il colore di un carattere grafico è impostato da ‘Ink’; ad esempio, Ink 1
Imposta carattere indica al programma quale carattere utilizzare e di quale dimensione, ad esempio Imposta carattere “acme”,55
Al posto delle virgolette vere e proprie si possono usare delle stringhe, ad esempio Testo 40,170,ST9$.
Poiché il messaggio del titolo viene utilizzato solo all’inizio del programma, abbiamo usato il
il testo effettivo contenuto tra virgolette, ad esempio,Testo 40,170, “Un uomo deve far attraversare un fiume a se stesso e a tre cose”.
CLS 11 //Cancellare lo schermo con il colore 11, (Verde)
//Set font colour, name and size
Ink 1,11: Set Font "acme",55 //Ink=Colore del testo, colore dello sfondo: scegliete un carattere e la dimensione
Notate come il testo viene emesso con le coordinate grafiche.
Text 320,170,"Un uomo deve attraversare il fiume e portare con sé tre cose"
Text 400,300,"Una volpe, un pollo e un sacco di mais"
Text 450,400,"Può prendere solo una cosa alla volta"
Notate il cambiamento del colore e della dimensione del carattere
Ink 1:Set Font "acme",40 //piccolo
Text 750,550,"Impostare il tono"
Ink 5 //Cambiare il colore del carattere
Text 600,630,"Premere un pulsante per continuare"
Cambiare la dimensione
Ink 5:Set Font "acme",20 //piccolo
Text 700,690,"AOZ Studio - Lesson 6 - Neil Ives - Feb 2020"
Wait Key //Necessario!
////////////////////////////
// Impostazione della schermata di gioco //
////////////////////////////
CLS 11 //Schermo chiaro con verde
Ink 20:Bar 500,0 To 800,1080 //Disegna un fiume con il colore blu e il comando BAR x1,y1 a x2,y2
Ink 10: Bar 0,0 to 1300,90 //Creare un messaggio a tutta larghezza nella parte superiore dello schermo
Locate ,1:Paper 10:Pen 1:Centre All$ //Qui si usano caratteri di testo semplici, vedi sopra come All$ è stato fatto da molte piccole stringhe.
Vedi sopra come All$ era composto da stringhe corte
/////////////
// Sprites //
/////////////
Gli sprites sono oggetti grafici che possono essere spostati sullo schermo e possono cambiare l’immagine; per esempio, in questo gioco le immagini della volpe, del pollo e della barca sono ruotate quando si trovano dall’altra parte del fiume.
Attenti anche ad altri cambiamenti di immagine nel gioco!
Posiziona gli sprites nelle posizioni di partenza usando le coordinate grafiche.
Il primo sprite è un’immagine di una piccola barca
Sprite 1,330,560,6
I numeri dopo la parola Sprite significano:
Sprite (numero),(posizione orizzontale),(posizione verticale),(numero immagine).
In questo gioco, le immagini sono in formato .png, numerate da 1 a 16.
Ora il resto degli sprites…
Sprite 2,0,365,10 //Uomo
Sprite 3,400,490,5 //Sacco di mais
Sprite 4,170,430,4 //Volpe
Sprite 5,290,470,2 //Pollo
////////////////////
// La logica del gioco //
////////////////////
Nelle versioni precedenti di questo gioco abbiamo usato le posizioni orizzontali delle stringhe in uscita per decidere se c’era una mossa sbagliata o se il giocatore ha perso.
Questo programma usa le posizioni orizzontali degli sprites per ottenere la stessa cosa.
////////////////
// While Wend //
////////////////
Questo programma ha un ciclo While/Wend nel ciclo principale Do/Loop.
While Selezione$=””
Selezione$=Inkey$
Wend
Il ciclo di cui sopra significa: While Selezione$=”” (=”” significa una stringa vuota), quindi finché nessun input è stato fatto torna indietro nel ciclo a While End, (abbreviato in Wend)
////////////
// Inkey$ //
////////////
Inkey$ legge l’input dalla tastiera.
Quando Inkey$ riceve un input dalla tastiera questo input viene memorizzato nella variabile stringa Choice$, Choice$ ora ha un valore e termina il ciclo While/Wend.
the focus moves out of the While/Wend loop.
A differenza di ‘Input’, la combinazione While/Wend e Inkey$ non richiede che il tasto Invio sia premuto dopo la selezione, in modo che il giocatore possa reagire più rapidamente.
////////////////////////
// Programma principale di macinazione //
////////////////////////
Choice$=""
Do
If STOPME=TRUE then Goto MARK //Questo è necessario per poter ripetere il gioco
While Choice$="" //Questa è un'altra forma di ciclo, aspetta un input.
Choice$=Inkey$
Wend
//Invia il valore dell'input dell'utente alla procedura POSTO_SPRITE
POSTO_SPRITE[Choice$]
Choice$="" //Svuota il Varibale Choice$ in modo che possa essere usato per il prossimo ciclo While/Wend.
MARK:
loop
/////////////////////
// Riassumere le procedure //
/////////////////////
In una lezione precedente avete visto come le procedure possono essere usate come blocchi di costruzione, ognuno con il proprio codice di programma.
In questo gioco usiamo tre procedure: POSTO_SPRITE, CONTROLLO_ES and FINE_MESSAGGI.
Ecco una descrizione di ogni procedura:
/////////////////////////////
// Procedura POSTO_SPRITE //
/////////////////////////////
Prende l’input dell’utente (da Inkey$ nei cicli principali), lo converte in maiuscolo, perché non possiamo sapere se l’utente ha inserito
maiuscole o minuscole.
La procedura utilizza una struttura “If/Else/End If” per verificare innanzitutto se lo sprite 2 (quello con l’immagine dell’uomo) si trova sul lato sinistro (posizione 0).
sinistra (posizione 0). Quindi sposta uno degli elementi selezionati dalle lettere ‘M’, ‘F’, ‘C’, ‘S’ attraverso il fiume.
Se l’uomo non è a sinistra, deve trovarsi sul lato destro del fiume, quindi l’istruzione ‘Else’ cattura la posizione alternativa.
(Lo Sprite con l’immagine della barca si muove sempre con l’uomo).
Le posizioni del testo in ogni sezione sono memorizzate in TX, in modo che il feedback venga mostrato al giocatore quando seleziona una lettera, “C”, “F”, ecc.
Prima di visualizzare il testo di feedback, l’area dello schermo viene cancellata utilizzando un’area definita di CLS con il colore di sfondo.
Infine, viene richiamata la procedura CHECK_IT.
////////////////////////
// Procedura CONTROLLO_ES //
////////////////////////
Questa procedura fa due cose: cambia la selezione dei testi nella parte superiore dello schermo, (vedi anche le note precedenti sulla modifica e l’aggiunta di stringhe di testo).
Questo significa che il giocatore vede solo ciò che può selezionare. Se la volpe non è dalla stessa parte dell’uomo, non può selezionarlo.
Successivamente, CONTROLLO_ES controlla se la fine del gioco è stata raggiunta.
Potrebbe significare che il giocatore ha portato tutti gli oggetti attraverso il fiume e ha vinto, o potrebbe significare che la volpe ha mangiato il pollo, ecc.
Alla fine, un valore numerico viene passato alla procedura FINE_MESSAGGI.
////////////////////////////
// Procedura FINE_MESSAGGI //
////////////////////////////
Questa procedura seleziona e formatta uno dei sei possibili messaggi che vengono visualizzati alla fine del gioco.
Questa procedura aggiunge anche un po’ di tensione attraverso suoni e cambiamenti d’immagine.
//////////////
// Sam Play //
//////////////
Sam Play è usato nella procedura FINE_MESSAGGI. Sam Play riproduce semplicemente un campione di suono.
I campioni usati in questo gioco sono file .wav chiamati ‘1.wav’, ‘2.wav’ e ‘3.wav’.
La cartella del suono si chiama Samples e si trova nella cartella My Applcations nella sottocartella ‘resources’ del rispettivo progetto.
Controlla i messaggi finali per esplorare come i campioni di suono e i tempi di attesa possono essere usati per effetti eccitanti.
Procedure POSTO_SPRITE[C$]
Posiziona lo sprite nella posizione definita a partire dall’input del giocatore.
Solo le lettere (U, V, P, S) reagiscono.
C$ = Upper$(C$) //Convertire l'input in maiuscolo, uomo in posizione sinistra
If X Sprite (2)=0 //Sprite 2 è l'uomo
If C$="U"
Sprite 1,770,560,7 //Barca, (va sempre con l'uomo)
Sprite 2,1110,365,10 //Uomo
End if
If C$="V"
Sprite 1,770,560,7 //Barca
Sprite 2,1110,365,10 //Uomo
Sprite 4,990,430,1 //Volpe
End if
If C$="P"
Sprite 1,770,560,7 //Barca
Sprite 2,1110,365,10 //Uomo
Sprite 5,900,470,3 //Pollo
End If
If C$="S"
Sprite 1,770,560,7 //Barca
Sprite 2,1110,365,10 //Uomo
Sprite 3,800,490,5 //Sacco di mais
End If
TX=900 //Posizione del testo del messaggio, (vedere più avanti)
Else //L'uomo non è rimasto, quindi Else è usato
If C$="U"
Sprite 1,330,560,6 //Barca
Sprite 2,0,365,10 //Uomo
End if
If C$="V"
Sprite 1,330,560,6 //Barca
Sprite 2,0,365,10 //Uomo
Sprite 4,170,430,4 //Volpe
End If
If C$="P"
Sprite 1,330,560,6 //Barca
Sprite 2,0,365,10 //Uomo
Sprite 5,290,470,2 //Pollo
End If
If C$="S"
Sprite 1,330,560,6 //Barca
Sprite 2,0,365,10 //Uomo
Sprite 3,400,490,5 //Sacco di mais
End If
TX=220 //Posizione del testo del messaggio
End If //Emettere il messaggio nella posizione definita in TX
Ink 10: Bar 0,0 to 1980,90 //Cancellare il testo nella barra dei messaggi
Ink 1:Set Font "acme",40
If C$="P" then Text TX,150,"Pollo"
If C$="V" then Text TX,150,"Volpe"
If C$="S" then Text TX,150,"Sacco di mais"
If C$="U" then Text TX,150,"Uomo"
CONTROLLO_ES //Vai alla procedura che controlla le decisioni sbagliate
End proc
Procedure CONTROLLO_ES
//————- Regolare la selezione superiore————-
Ink 10: Bar 0,0 to 1980,90 // Cancellare il messaggio precedente
Locate 0,1:Paper 10:Pen 1 //Impostare il colore di stampa per il testo
Usa le posizioni orizzontali degli sprite, a partire da X Sprite() per aggiungere le molle necessarie, ST10$+ST11$+ST12$+ST13$ ecc.
Queste sono tutte scelte che non innescano un messaggio di ‘game over’.
//Tutti a sinistra
If X Sprite(2) = 0 and X Sprite(3) = 400 and X Sprite(4) = 170 and X Sprite(5) = 290 Then Centre ST10$+ST11$+ST12$+ST13$
//Uomo, volpe, mais sul lato sinistro
If X Sprite(2) = 0 and X Sprite(3) = 400 and X Sprite(4) = 170 and X Sprite(5) = 900 then Centre ST10$+ST11$+ST13$
//Uomo, volpe, pollo sul lato sinistro
If X Sprite(2) = 0 and X Sprite(3) = 800 and X Sprite(4) = 170 and X Sprite(5) = 290 then Centre ST10$+ST11$+ST12$
//Uomo, pollo, mais sul lato sinistro
If X Sprite(2) = 0 and X Sprite(3) = 400 and X Sprite(4) = 990 and X Sprite(5) = 290 then Centre ST10$+ST12$+ST13$
//Uomo e pollo a sinistra
If X Sprite(2) = 0 and X Sprite(3) = 800 and X Sprite(4) = 990 and X Sprite(5) = 290 Then Centre ST10$+ST12$
//Uomo, volpe, mais sul lato destro
If X Sprite(2) = 1110 and X Sprite(3) = 800 and X Sprite(4) = 990 and X Sprite(5) = 290 then Centre ST10$+ST11$+ST13$
//Uomo, volpe, pollo sul lato destro
If X Sprite(2) = 1110 and X Sprite(3) = 400 and X Sprite(4) = 990 and X Sprite(5) = 900 then Centre ST10$+ST11$+ST12$
//Uomo, pollo, mais sul lato destro
If X Sprite(2) = 1110 and X Sprite(3) = 800 and X Sprite(4) = 170 and X Sprite(5) = 990 Then Centre ST10$+ST12$+ST13$
//Uomo e pollo sulla destra
If X Sprite(2) = 1110 and X Sprite(3) = 400 and X Sprite(4) = 170 and X Sprite(5) = 900 Then Centre ST10$+ST12$
// Controlla le posizioni orizzontali degli sprite per una “fine del gioco” partendo da X Sprite()
Invia un numero di messaggio alla procedura FINE_MESSAGGI
//Volpe, pollo e mais sono da soli sul lato sinistro
If X Sprite(4) = 170 and X Sprite(5) = 290 and X Sprite(3) = 400 and x Sprite(2) = 1110 Then FINE_MESSAGGI[1]
//La volpe e la gallina sono soli sul lato sinistro
If X Sprite(4) = 170 and X Sprite(5) = 290 and X Sprite(2) = 1110 then FINE_MESSAGGI[2]
//Il pollo e il mais sono da soli sul lato sinistro
If X Sprite(5) = 290 and X Sprite(3) = 400 and X Sprite(2) = 1110 Then FINE_MESSAGGI[3]
//La volpe e la gallina sono soli sul lato destro
If X Sprite(4) = 990 and X Sprite(5) = 900 and X Sprite(2) = 0 then FINE_MESSAGGI[4]
//Il pollo e il mais sono da soli sul lato destro
If X Sprite(5)=900 and X Sprite(3) = 800 and X Sprite(2) = 0 Then: FINE_MESSAGGI[5]
//Volpe, pollo, mais e uomo sono tutti dalla parte giusta
If X Sprite(4) = 990 and X Sprite(5) = 900 and X Sprite(3) = 800 and X Sprite(2)= 1110 Then FINE_MESSAGGI[6]
End Proc
Procedure FINE_MESSAGGI[MESSAGGI]
//Mostra il messaggio di 'Fine del gioco' risultan
If MESSAGGI = 1
Ink 10: Bar 0,0 to 1980,90
Sam Play 2 //Riproduci il campione sonoro del pollo
Locate ,1:Paper 10:Pen 1:Centre "Il Pollo ha mangiato il mais…"
Wait 0.5 //Pausa di mezzo secondo per la tensione!
//Sprite Off 3 //Rimuovi mais (Sprite off non funziona nella versione beta di AOZ)
Sprite 3,-100,490,5 //Rimuovi il mais dallo schermo
Sprite 5,,,13 //Immagine cambiata in pollo grasso
Wait 2 //Pausa per un effetto drammatico!
//Sprite Off 5 //Rimuovi mais (Sprite off non funziona nella versione beta di AOZ)
Sprite 5,-100,470,2 //Rimuovere il pollo dallo schermo visiblem
Sprite 4,,,16 //Immagine cambiata in Volpe grassa
Wait 0.5 //Pausa di nuovo
Sam Play 3 //Riproduci un campione sonoro di rutto
Bar 0,0 to 1980,90:Locate ,1:Centre "...poi la volpe ha mangiato il pollo!":Wait 3
End if
If MESSAGGI = 2 Then Sam Play 3: Sprite 5,-100,470,2:Sprite 4,,,16:Ink 10: Bar 0,0 to 1980,90:Locate ,1:Paper 10:Pen 1:Centre "La volpe ha mangiato il pollo!":Wait 2
If MESSAGGI = 3 Then Sam Play 2: Sprite 3,-100,490,5:Sprite 5,,,13:Ink 10: Bar 0,0 to 1980,90:Locate ,1:Paper 10:Pen 1:Centre "Il pollo ha mangiato il mais!":Sam Play 2: Wait 2
If MESSAGGI = 4 Then Sam Play 3: Sprite 5,-100,470,2:Sprite 4,,,15:Ink 10: Bar 0,0 to 1980,90:Locate ,1:Paper 10:Pen 1:Centre "La volpe ha mangiato il pollo!":Wait 2
If MESSAGGI = 5 Then Sam Play 2: Sprite 3,-100,490,5:Sprite 5,,,14:Ink 10: Bar 0,0 to 1980,90:Locate ,1:Paper 10:Pen 1:Centre "Il pollo ha mangiato il mais!":Sam Play 2: Wait 2
CLS 0
If MESSAGGI = 6 then Sam Play 1:Ink 10: Bar 0,0 to 1980,90:Locate ,1:Paper 10:Pen 1:Centre "Congratulazioni, ce l'hai fatta!": Wait 1 //Il campione 1 è il tifo della folla
Wait 0.5
Locate ,18:Paper 0:Pen 1: Centre "Riavviare il programma per riprodurre di nuovo (Ricarica la pagina)"
Wait 1
STOPME=True //Flag logico usato per fermare il programma nel Do/loop principale
End proc
**Clicca sul pulsante “Run in Browser” o F1 per avviare il programma nel browser o su “Run in AOZ Viewer” (F2) per avviarlo nell’editor.
Congratulazioni! Hai davvero imparato molto finora, continua a fare pratica con i comandi e prova i tuoi progetti di programmi semplici.
Provate a codificare le vostre cose con tutti i comandi che avete imparato qui, modificate i valori e giocate con essi.
Facendo clic sul simbolo ? nell’angolo superiore destro dell’editor si apre il manuale integrato di AOZ Studio. Qui troverete ulteriori informazioni, nonché un manuale d’uso in inglese e francese e una panoramica dei comandi di AOZ Studio in inglese. Qui i comandi sono descritti con tutte le opzioni possibili.
Grazie per aver programmato con RayShell.de e parlane con i tuoi amici.
Aggiornato il 23.07.2023
Testato con AOZ Studio™ Versione 1.0 Aggiornamento 44 il 23.07.2023