Creare un menu elastico

Questo esercizio tratta la creazione di un menu elastico, animato, il tutto si divide in molti passi, seguiteli alla perfezione, il risultato sarà perfetto! Questo esercizio utilizza diversi comandi di ActionScript, ma la lezione non sarà mirata a capire la sintassi esatta di ogi azione ma capire come realizzare e soprattutto modificare l'esempio. Buon lavoro!


.:Passo 01:.
Una volta impostata la grandezza del movie, cliccate sul menu "inserisci/nuovo simbolo" e create un simbolo movieclip. Chiamatelo "menuprops".





.:Passo 02:.
Adesso siete all'interno del movieclip, create una scritta "Menu", convertitela come simbolo Pulsante, editatelo e assegnate gli stati che volete.

.:Passo 03:.
Una volta creato il simbolo pulsante tornate al movieclip "menuprops", create un rettangolo, poi selezionate lo strumento testo ed inserite un campo di "testo dinamico", come nella figura, ed impostate la variabile del testo come "titolo".

.:Passo 04:.
A questo punto inserite un nuovo simbolo pulsante, aggiungete al pulsante solo lo stato "Hit", area calda.

.:Passo 05:.
Posizionate il simbolo pulsante con solo lo stato "Hit", che appare a video con un colore verdino, sopra l'ultimo oggetto che avete creato, poi selezionate il tutto e convertite come simbolo "MovieClip".

.:Passo 06:.
Copiate il MovieClip per quante volte volete, ad esempio se vi servono quattro sezioni; Contatti, Lavori, Links e News, copiatelo come la figura sopra.


Ora passiamo alle Azioni:
La prima parte del lavoro è fatta! Adesso avete creato tutti gli elementi necessari per l'animazione, adesso dobbiamo passare all'azione con le azioni, :-) In questa fase verranno spiegate le azioni in maniera generica senza spiegare ogni singola riga e la loro sintassi, ma sarete in grado di capire il loro funzionamento e quindi modificare i parametri principali. Di nuovo Buon Lavoro!

.:Passo 07:.
Tornate sulla "scena1" vedrete un movieclip come nella figura, adesso come consiglio di solito per aggiungere uno script che funziona su tutta il movie, consiglio di aggiungere un livello e aggiungere uno script sul primo frame. Dobbiamo settare una "variabile" che viene richiamata poi da altre azioni all'interno del movie; aprite la finestra azioni, cliccate sul " + " sciegliete "action/setvariable", bene adesso aggiungete il nome alla variabile "propsvar" e come valore "0" , selezionate la casella "Espressione".

.:Passo 08:.
Selezionate il movieclip e assegnate queste azioni, le scritte rosse vi danno il riferimento delle voci che dovete cercare cliccando sul " + " nella finestra action. Scrivete tutto con attenzione. Queste azioni settano la posizione del movieclip.

.:Passo 09:.
Fate attenzione a quando far scaturire l'evento, tenete sempre d'occhio le immagini dell'esempio.

.:Passo 10:.
Ora editate il movieclip, selezionate il simbolo pulsante "Menu" , assegnate le seguenti azioni. Queste azioni legate al pulsante richiamano la variabile inizializzata in precedenza.

.:Passo 11:.
Selezionate adesso il movieclip ed assegnate le azioni, ma fate attenzione alla variabile "titolo", vi ricordate il campo testo che avete inserito all'inizio e la variabile associata al campo testo dinamico? Quella variabile titolo risulta molto importante per il nome che volete visualizzare sul tasto, cambiatelo per ogni movieclip che avete duplicato.

.:Passo 12:.
Siamo alla fine. Editate il simbolo pulsante con la sola area calda "Hit", assegnate le seguenti azioni.
Tornate sulla scena principale testate il movie.

.:Fine:.

Download: .swf
Download: .fla

Ti potrebbe interessare anche

commenta la notizia

C'è 1 commento
Marcello
Ti è piaciuto l'articolo?