Sintesi

In questo tutorial vi spiegherà come creare un riflesso acqua da applicare su un movieclip in movimento.

Ecco il risultato finale:


Requisiti

Flash 8, Flash CS3 o Flash CS4.

Nota: Le schermate contenute in questo tutorial sono realizzati in Flash CS3. Funziona esattamente la stessa cosa in Flash 8. Questo tutorial è ActionScript 2 (anche se non ActionScript è richiesto).

Step 1 - Installare il componente effetto

Scarica il Effect Water Reflection qui. Si prega di seguire le istruzioni di installazione e trascinare il componente dal pannello componente nella libreria del file. Fla.

Trascinare il componente nella libreria

Passaggio 2 - Creare Movieclip anatra

Importare l'immagine anatra premere [Ctrl-R] o "File" -> "Importa" -> "Importa on Stage ...". Assicurarsi che l'immagine di anatra è un PNG. Con sfondo trasparente.

Importazione di immagini

Selezionare questa immagine e convertirla in un movieclip [premere F8] o tasto destro del mouse sul MovieClip -> "Converti in simbolo ...". MovieClip dare il nome di "anatra".

Crea Movieclip duck

Passaggio 3 - Creazione Animazione Movieclip

Creare una new MovieClip con [premere Ctrl-F8] o Inserisci -> "Nuovo simbolo ...". Nome Movieclip questa "animazione".

Create new MovieClip

Create new MovieClip

Trascinare il clip filmato anatra dalla libreria al primo fotogramma sulla timeline. Ora cliccate su frame 60 e creare un nuovo fotogramma chiave [premere F6] o tasto destro del mouse e "Inserisci fotogramma chiave".

Crea nuovo fotogramma chiave

Fare clic sul fotogramma chiave appena creata e selezionare il clip filmato anatra sulla tela. Ora spostare questa MovieClip con il tasto cursore a destra (diciamo 100px). È possibile controllare la nuova posizione nel pannello info.

Sposta Movieclip

Tornare al primo fotogramma chiave della linea temporale. Sul pannello di proprietà Select Tween: "Motion". Se si fa clic su qualche punto della timeline ora, si vede che l'anatra Movieclip si muove da sinistra a destra.

Tween set di movimento

Fase 4 - Movieclip animazione Put sulla timeline principale

Ora cliccate su "Scena 1" per tornare alla linea temporale principale. Se l'anatra MovieClip è ancora lì, rimuoverlo.

Torna alla linea temporale principale

Spostare il clip filmato animazione dalla libreria al primo fotogramma della linea temporale.

Metti Movieclip su timeline

Impostare il nome di istanza del MovieClip per "animation_mc" (si può scegliere un nome diverso se si desidera. Assicurarsi che il nome di istanza è unica). Senza un nome di istanza, il componente è in grado di rilevare il MovieClip.

Impostare il nome istanza

Fase 5 - componente Applica effetto

Creare un nuovo livello, selezionare il primo fotogramma e trascinare il componente effetto dalla libreria sul Movieclip animazione. Il componente verrà automaticamente snap.

Trascinare componente su Movieclip

Impostare il parametro del componente all'interno del pannello di ispezione dei componenti, come nello screenshot. Movieclips con tutti i nomi di istanza in questa cornice sono elencati nella sezione "Target Movieclip" nell'elenco di selezione. Dal momento che si dispone di un solo MovieClip, il componente assume, a cui si desidera applicare l'effetto sul MovieClip "animation_mc".

Set di parametri

Nota: Queste impostazioni vengono applicate solo a questa istanza uno dei componenti effetto. Se si disegna il componente su un altro MovieClip (da qualche altra parte all'interno del fla. O in un nuovo progetto) è necessario impostare le impostazioni di nuovo.

Ora (export Ctrl premere [-ENTER] o ...). Vedrete che la testa del papero è in qualche modo tagliati. Thats perché il componente ha esattamente le dimensioni del Movieclip anatra. Ma dal momento che l'onda di riflessione che aumentare le dimensioni non si adattano più.

La riflessione è tagliata

Fase 6 - Regolare Movieclip animazione

Per risolvere questo problema, si inserisce una forma invisibile in background di anatra MovieClip, che taglia la Movieclip un po '.

Tornare al Movieclip anatra con un doppio clic su di esso nella vostra libreria.

Duck Modifica Movieclip

Creare un nuovo livello al di sotto del livello di interpolazione.

Crea nuovo livello

Selezionare lo strumento Rettangolo e disegnare una forma con la larghezza di anatra. L'altezza dovrebbe essere una qualche pixel più elevato poi l'anatra (circa 10 pixel). Potrebbe aiutare a impostare l'icona muta nella timeline, a vedere solo le dimensioni dell'immagine anatra.

Pareggio forma rettangolo

Con la forma selezionata aprire il pannello dei colori e impostare l'alpha a 0.

Alpha di forma

Quando si prova il filmato adesso, vedrai che la riflessione è applicato l'anatra buco.

Nessun taglio più

Fase 6 - aggiungere un'immagine di sfondo

Creare un nuovo livello al di sotto del livello con animazione e componente. Importare un'immagine che corrispondono. Ora è possibile cambiare la posizione della MovieClip animazione per renderlo in sintonia con la base.

Risultato finale

Scaricare

Clicca qui per scaricare il FLA di questo tutorial. Nota: La fla. Comprende la versione di prova del componente effetto, che può funzionare solo in IDE Flash (Flash 8, Flash CS3 o Flash CS4), ma non all'interno del browser.

È inoltre possibile scaricare l'effetto acqua riflessione qui.

  • Share / Bookmark