Tutoriál: Vytvorenie vody odraz efekt s animáciou
Napíšte komentár 18.listopadu 2008
Prehľad
V tomto tutoriále sa naučíte, ako vytvoriť vodné reflexie použiť na pohybujúce sa MovieClip.
Tu konečný výsledok:
Požiadavky
Flash 8, Flash CS3 alebo Flash CS4.
Poznámka: screenshoty v tomto tutoriále sú vyrábané v CS3 Flash. Funguje to presne rovnaké vo Flash 8. Tento tutoriál je ActionScript 2 (síce nie ActionScript je požadované).
Krok 1 - Inštalácia účinok zložky
Stiahnite Vodné Reflection Effect tu . Riaďte sa pokynmi pre inštaláciu a pretiahnuť zložku z jednotlivých zložiek panel do knižnice svojho. fla súbor.
Krok 2 - Vytvorenie kačice MovieClip
Import kačica obrázku [stlačiť Ctrl-R] alebo "Súbor" -> "Import" -> "Import na etapy ...". Uistite sa, že obraz je kačica. PNG s priehľadným pozadím.
Vybrať tento obraz a premieňajú ho na MovieClip stlačte] [F8, alebo kliknite pravým tlačidlom myši na MovieClip -> "Konvertovať do Symbol ...". Dajte MovieClip názov "kačica".
Krok 3 - Vytvorenie animácie MovieClip
Vytvoriť nový MovieClip s [stlačiť Ctrl-F8], alebo Insert -> "New Symbol ...". Názov tejto MovieClip "animácie".
Presuňte kačica MovieClip z knižnice na prvú snímku na časovej osi. Teraz kliknite na ráme 60 a vytvoriť nový kľúčový snímku [Tlačová F6] alebo kliknite pravým tlačidlom myši a "Vložiť Kľúčové políčko".
Kliknite na novovytvorený kľúčový snímku a vyberte kačica MovieClip na plátne. Teraz presuňte tento MovieClip s kurzorom tlačidlo vpravo (povedzme 100px). Môžete skontrolovať novú pozíciu v info paneli.
Vráťte sa do prvej kľúčový snímku časovej osi. O majetku paneli vyberte Tween: "Motion". Ak kliknete Ak niekde na časovej osi teraz, zistíte, že kačica MovieClip sa pohybuje zľava doprava.
Krok 4 - Daj animácie MovieClip na hlavnú časovej osi
Teraz kliknite na "Scene 1" sa dostať späť na hlavnú časovej osi. Ak je kačica MovieClip je stále tu, vyberte ju.
Presun animácie MovieClip z knižnice na prvú snímku časovej osi.
Nastavenie inštancie názov MovieClip na "animation_mc" (môžete si zvoliť iný názov, ak chcete. Uistite sa, že názov inštancie je jedinečný). Bez inštancie meno, súčasť je schopný detekovať MovieClip.
Krok 5 - Aplikujte efekt zložky
Vytvorte novú vrstvu, vyberte prvú snímku a pretiahnite efekt komponentov z knižnice na animáciu MovieClip. Časť bude automaticky lapať.
Nastavte parameter zložky vnútri zložky inšpektor panel ako na screenshote. Všetky Movieclips s názvami inštanciou v tomto ráme sú uvedené v časti "Cieľ MovieClip" select zoznam. Pretože máte len jeden MovieClip, komponenty predpokladá, že chcete použiť efekt na MovieClip "animation_mc".
Poznámka: Tieto nastavenia sa vzťahujú len na tento jeden príklad z vplyvu zložky. Ak máte čerpať komponent na inom MovieClip (niekde inde vo vnútri. Fla alebo v novom projekte), musíte nastavenie znova.
Teraz export ([stlačiť Ctrl-ENTER], alebo ...). Uvidíte, že v čele kačica je nejako znížiť. To je preto, že je súčasť presne veľkosti kačice MovieClip. Ale pretože odraz vĺn sa zvýši veľkosť to nezapadá do žiadnej väčšej.
Krok 6 - Nastavenie animácie MovieClip
Ak chcete opraviť, budete vložiť neviditeľný tvar v pozadí kačice MovieClip, ktorý veľkosť až MovieClip málo.
Vráťte sa na kačice MovieClip do double-kliknutím vo vašej knižnici.
Vytvorte novú vrstvu pod vrstvou Tween.
Vyberte obdĺžnik nástroj a nakresliť tvar sa šírkou kačicu. Výška by mala byť niekoľko pixel väčšia ako kačica (asi 10 pixel). To by mohlo pomôcť nastaviť obrys ikonu v časovej osi, vidieť iba rozmery kačice image.
S tvarom vybraných otvorených farba panelu a nastavte alfa na 0.
Keď test váš film teraz, uvidíte, že odraz je použitá na dieru kačicu.
Krok 6 - Pridať Obrázok na pozadí
Vytvorte novú vrstvu pod vrstvu s animáciou a komponentov. Import obraz, ktorý zápas. Teraz môžete zmeniť polohu animácie MovieClip, aby sa to zapadať do pozadia.
Stiahnuť
Kliknite tu pre stiahnutie fla tohto tutoriálu. Pozn:. Fla obsahuje skúšobnú verziu účinku zložka, ktorá bude fungovať len v Flash IDE (Flash 8, Flash CS3 alebo Flash CS4), ale nie vo vnútri prehliadača.
Môžete si tiež stiahnuť Voda Reflection Effect tu .






















Napísať komentár