Share
In questo suggerimento rapido imparerai come creare un semplice sistema di punti che può essere esteso ai tuoi giochi. Questo tutorial è per principianti e in esso imparerai come creare un set di pulsanti che il giocatore può fare clic per aggiungere o sottrarre punti al loro punteggio. Semplice!
Anche se questo tutorial è per principianti nella programmazione Flash, è necessario conoscere un po 'sull'utilizzo degli strumenti di disegno in Flash Professional. Se hai bisogno di imparare come usare gli strumenti di disegno, leggi questo articolo.
Diamo un'occhiata al risultato finale su cui lavoreremo:
Apri Flash e crea un nuovo documento Flash. Impostare Dimensioni documento su 550x400px, FPS (frame per secondo) su 24 e impostare la classe del documento su Principale.
Per creare la grafica, utilizzare lo strumento Ovale per creare quattro cerchi con un contorno # 000000 (nero) e una dimensione di tratto di 12.50.
Ogni cerchio dovrebbe avere un colore di riempimento diverso. I colori di riempimento sono i seguenti:
Dopo aver creato le monete, usa le caselle di testo statiche per scrivere i rispettivi valori come indicato nell'immagine sopra. Il font che userò in questo tutorial è Futura LT Heavy, con una dimensione di 50, ma sentiti libero di usare il tuo font e la dimensione del font. Dopo aver completato l'istruzione dovresti avere una moneta da 10, 50 monete, 100 monete e una moneta da -30.
Ora convertiamo ogni moneta in un Movie Clip. Seleziona la moneta da 10 e premi F8. Dovresti vedere una finestra di dialogo come questa:
Ripeti questo passaggio per 50 monete, 100 monete e 30 monete e inserisci quanto segue sotto le caselle Nome e Classe per ogni moneta:
Dopo aver creato MovieClip da tutte le monete, selezionale tutte e cancellale dal palco. Le aggiungeremo nuovamente in seguito, utilizzando il codice.
Per finire questo passaggio crea una casella di testo statica con il testo "SCORE:" e posizionala con un valore X di 135 e un valore Y di 327.
In questo passaggio installeremo il nostro pacchetto e la Main Class.
Crea una nuova classe ActionScript e sotto il tipo Nome classe Principale. Una volta creata la classe, salvala nella stessa cartella del file Flash e assicurati che sia salvata come Main.as.
Inserisci il codice qui sotto nel tuo file Main.as, quindi salvalo.
Accentsconagua
package // importa le classi necessarie import flash.display.MovieClip import flash.events.MouseEvent; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFieldType; import flash.events.Event; public class Main estende MovieClip var tenCoin: TenCoin = new TenCoin (); // Crea una nuova istanza della Dieci monete var fiftyCoin: FiftyCoin = new FiftyCoin (); // Crea una nuova istanza della Fifty Coin var hundredCoin: HundredCoin = new HundredCoin (); // Crea una nuova istanza della Hundred Coin var badCoin: BadCoin = new BadCoin (); // Crea una nuova istanza del punteggio -30 Coin var: Number = 0; // Imposta il punteggio su zero var scoreText: TextField = new TextField (); // Crea un campo di testo per visualizzare il punteggio var scoreTextFormat: TextFormat = new TextFormat ("Futura LT Heavy", 50, 0x000000); // Crea un nuovo formato per il campo di testo Score, sostituisci "Futura LT Heavy" con il font che stai usando public function Main () displayObjects (); // La funzione che useremo per visualizzare tutto il grafico sullo stage setUpEventListeners (); // La funzione che useremo per aggiungere i nostri ascoltatori di eventi Per prima cosa importiamo le classi di cui abbiamo bisogno e quindi impostiamo la nostra classe di documenti. Estendiamo quindi la Main Class da MovieClip; potremmo usare Sprite, ma non importa. Dopo di ciò, dichiariamo le variabili che stiamo usando e aggiungiamo il codice al nostro Principale() funzione (la nostra "funzione costruttore").
Il Principale() la funzione mostrerà tutte le monete che abbiamo creato sul palco e aggiungerà anche gli ascoltatori di eventi che dobbiamo usare.
Nota: Dovrai incorporare il carattere nel tuo FLA per farlo visualizzare in campi di testo dinamici se il tuo utente non ha il font installato. Non l'ho fatto qui, per mantenere le cose semplici.
DisplayObjects () FunzioneIl DisplayObjects () La funzione è chiamata dal Principale() funzione. Lo scopo di questa funzione è di aggiungere le monete e la casella di testo del punteggio allo stage e posizionarle nella posizione corretta.
function displayObjects () // Imposta la posizione del Ten Coin dieciCoin.x = 72; dieciCoin.y = 200; // Imposta la posizione della Fifty Coin fiftyCoin.x = 207; cinqutyCoin.y = 200; // Imposta la posizione della Hundred Coin hundredCoin.x = 342; centoCoin.y = 200; // Imposta la posizione di -Thirty Coin badCoin.x = 477; badCoin.y = 200; // Posiziona la casella di testo del punteggio e imposta il tipo su dinamico in modo che possa essere modificato tramite il codice scoreText.type = TextFieldType.DYNAMIC; scoreText.x = 305; scoreText.y = 327; scoreText.width = 300; // Imposta il formato del punteggio della casella di testo del punteggioText.defaultTextFormat = scoreTextFormat; // aggiunge tutto allo stage addChild (dieciCoin); addChild (fiftyCoin); addChild (hundredCoin); addChild (badCoin); addChild (scoreText);
setUpEventListeners () Funzione e gestori di eventiOra che abbiamo aggiunto oggetti allo stage, dobbiamo creare le funzioni del gestore di eventi che vengono attivate quando fai clic sulle monete. Avremo anche bisogno di un updateScore () funzione da utilizzare in modo che il punteggio venga aggiornato e non rimanga invariato.
function setUpEventListeners () // Cambia tutti i nostri MovieClip in Button tenCoin.buttonMode = true; fiftyCoin.buttonMode = true; centoCoin.buttonMode = true; badCoin.buttonMode = true; // Aggiunge i listener di eventi per aggiungere punti al punteggio tenCoin.addEventListener (MouseEvent.CLICK, addTenPoints); fiftyCoin.addEventListener (MouseEvent.CLICK, addFiftyPoints); hundredCoin.addEventListener (MouseEvent.CLICK, addHundredPoints); badCoin.addEventListener (MouseEvent.CLICK, removeThirtyPoints); // Aggiunge la funzione di aggiornamento per aggiornare il punteggio stage.addEventListener (Event.ENTER_FRAME, updateScore);
Ora dobbiamo codificare le funzioni che cambiano e aggiornano il punteggio.
function addTenPoints (evt: MouseEvent) punteggio + = 10; // Aggiunge 10 punti alla partitura function addFiftyPoints (evt: MouseEvent) score + = 50; // Aggiunge 50 punti alla partitura function addHundredPoints (evt: MouseEvent) score + = 100; // Aggiunge 100 punti alla partitura function removeThirtyPoints (evt: MouseEvent) score - = 30; // Sottrae 30 punti dal punteggio // Questa dichiarazione if non consente al punteggio di scendere sotto zero se (punteggio < 10) score -= score; function updateScore(evt:Event) scoreText.text = String(score); //This converts the score variable from a number to a string, because our score textbox can only display strings //Closes the class //Closes the package
Il tuo codice è ora pronto per essere testato. Premi CTRL + Invio (CMD + Invio su un Mac) e guarda il tuo sistema di punti prendere vita!
Ora potresti pensare: "Ho perso tempo, tutto questo tutorial mi ha insegnato a creare alcuni pulsanti che ti danno punti quando li fai clic", ma hai imparato più di questo.
Considerare questo come base per un sistema di punti più avanzato. Hai imparato come usare + = e - = per aggiungere o sottrarre un numero, hai imparato come usare i listener di eventi, hai imparato come creare una funzione per aggiornare gli oggetti mentre il SWF è in esecuzione e hai imparato come modificare un numero a una stringa e visualizzarla in una casella di testo dinamica creata interamente tramite codice!
Questo sistema di punti può essere facilmente esteso ai tuoi giochi. Per quelli di voi che sono più esperti in Flash, provare a creare un gioco che utilizza una funzione hitTestObject e aggiunge punti quando si colpisce un oggetto.
Spero che tu abbia imparato qualcosa di nuovo oggi. Grazie per aver letto!
