Preloader jest elementem bardzo często wykorzystywanym przy tworzeniu stron internetowych we Flashu. Zależnie od stopnia zaawansowania może on informować nas m.in. o całkowitym rozmiarze wczytywanej animacji, ilości danych już wczytanych, prędkości wczytywania pliku oraz czasie pozostałym do wczytania całości.
W tym tutorialu zajmiemy się stworzeniem preloadera pokazującego nam pierwsze trzy z wymienionych informacji. Preloader utworzony zostanie we flashu mx2004 i wszystkie polecenia z menu i skróty klawiszowe będą dotyczyły tej właśnie wersji (ewentualnie w nawiasie podana będzie informacja dla wersji poprzedniej). We flashu mx raczej nie ma wielkich różnic w tym przypadku, jednak takowe mogą czasem wystąpić. Utworzony preloader będzie działał również w wersji mx.
Na początku, po utworzeniu we Flashu nowego dokumentu wybieramy z menu Window->Design Panels->Scene [Shift+F2] (Window->Scene w mx) i w panelu Scene klikając „+” dodajemy nową scenę. W pierwszej scenie umieścimy nasz preloader, w drugiej główną zawartość strony. Będąc cały czas w pierwszej scenie tworzymy trzy dynamiczne pola tekstowe i w panelu Properties, w polu Var: deklarujemy dla nich nazwy zmiennych. Będą to odpowiednio: procent, załadowane, rozmiar. Teraz zaznaczamy nasze pola i wciskając [F8] konwertujemy je do MovieClip-a. Następnie przechodząc z powrotem do sceny głównej (Preloader), zaznaczamy utworzony mc i dopisujemy do niego akcje:
onClipEvent (enterFrame) { procent = Math.round (_root.getBytesLoaded() *100/_root.getBytesTotal())+"%"; zaladowane = "Ilość wczytanych danych:" + Math.round(_root.getBytesLoaded()/1000)+"kb"; rozmiar="Całkowita ilość danych do wczytania:" + Math.round(_root.getBytesTotal()/1000)+"kb";}
Powodują one wyświetlenie odpowiednich informacji w polach: procent, zaladowane i rozmiar. W kolejnym kroku tworzymy nowy MovieClip [Ctrl+F8] i umieszczamy w nim animację paska postępu. Wykorzystujemy w tym celu animację Shape Tween. W tym przypadku, dla uproszczenia, będzie ona składać się ze 100 klatek. Następnie powracamy do głównej sceny i z biblioteki przeciągamy utworzony pasek postępu na obszar roboczy oraz dodajemy do niego akcje:
onClipEvent (enterFrame) { this.gotoAndStop (Math.round(_root.getBytesLoaded() *100/_root.getBytesTotal()));}
Mamy już utworzony preloader, teraz żeby sprawdzić jego działanie musimy przejść do drugiej utworzonej sceny i umieścić tam dowolny plik, który będzie zajmował wystarczająco miejsca aby uruchomić preloader. Animację testujemy wciskając na klawiaturze [Ctrl+Enter] dwa razy. Pliki źródłowe do powyższego tutoriala (zapisane w wersji dla FlashMX znajdują się . W razie wątpliwości lub problemów zapraszam na .
