Efekt maski z gradientem we Flashu 8
Wstęp
Jak wspomniałem w tutorialu "Efekt maski z gradientem we Flashu < ver. 8", w najnowszej wersji Flashplayera 8 i Flasha 8 pojawiła się możliwość używania MovieClipa zawierającego elementy przeźroczyste jako maski z przeźroczystością - to na co wszyscy czekali :) W poniższym tutorialu dowiecie się jak taki efekt wykonać.
Jedna uwaga: efekt jest możliwy do osiągnięcia, tylko na masce ustalonej przez ActionScript, nie jest możliwy na maskach zdefiniowanych w trybie layers.
Przykład:
Przykłady pokazują zastosowanie masek z kanałem alpha. Przy czym w drugiej animacji zmodyfikowałem nieznacznie kod html który osadza ją na www, aby pokazać że maski z przeźroczystością doskonale współgrają z przeźroczystym tłem w animacjach flash.
Sposób wykonania:
Maskę z przeźroczystością wykonujemy następująco:
- Rysujemy gradient, może być np typu radial, od jakiegoś koloru do przezroczystości i zapisujemy jako MovieClip (jego instancję nazywamy "maska")
- Wrzucamy to co ma być maskowane (zapisujemy np jako mc "bg")
- Tworzymy nową warstwę na którą wpisujemy następujący poniższy kod AS:
Kod ActionScript:
/* gradient masking */
/* ActionScipt by Devoth */
/* www.devoth.pl */
/*
poniższe dwie linijki nie są konieczne
ale sprawiają że łatwiej się potem pisze kod
(flash pokazuje poprawnie code hints)
*/
var bg:MovieClip;
var maska:MovieClip;
/* ustalamy że mc 'maska' maskuje mc 'bg' */
bg.setMask(maska);
/* ważne! ustawiamy cache'owanie obu mc jako bitmapy */
bg.cacheAsBitmap = true;
maska.cacheAsBitmap = true;
/* żeby było bardziej widowiskowo, podpinamy maskę pod kursor myszy */
maska.startDrag(true);
I wszystko powinno działać. Pozostaje przetestować animację za pomocą <Ctrl>+<Enter>.
Wnioski
Nowe możliwości jakie dał Flash 8 w zakresie operacji na maskach, pozwalają zaoszczędzić mnóstwo czasu i stresu, rozszerzając przy okazji wachlarz efektów które mogą uzyskać projektanci Flash, do granic możliwości. Jak widać na drugim z pokazanych przykladów, maski z przeźroczystością działają również na transparentnym tle animacji. Pozostaje tylko pogratulować ludziom z Macromedii wypełnienia tak ważnej luki, no i korzystać :)
Masz jakieś pytania lub sugestie, może zauważyłeś błąd w powyższym artykule? Napisz do mnie.
Pliki
.fla i .swf skompresowane w archiwum .zip: