Błyski w sieci

Flash stał się standardem w tworzeniu animacji 2D na WWW. Małe rozmiary plików, ogromne możliwości i efektowny wygląd projektowanych scen przekonały rzesze projektantów do tej technologii. Wciąż jednak pokutuje niesłuszne przekonanie, iż tworzenie flashowych animacji jest zadaniem trudnym i czasochłonnym. Aby obalić ten mit, prezentujmy krótki przegląd możliwości flagowego edytora Macromedii, wzbogacony w proste (lecz pouczające) przykłady jego zastosowania.

Flash stał się standardem w tworzeniu animacji 2D na WWW. Małe rozmiary plików, ogromne możliwości i efektowny wygląd projektowanych scen przekonały rzesze projektantów do tej technologii. Wciąż jednak pokutuje niesłuszne przekonanie, iż tworzenie flashowych animacji jest zadaniem trudnym i czasochłonnym. Aby obalić ten mit, prezentujmy krótki przegląd możliwości flagowego edytora Macromedii, wzbogacony w proste (lecz pouczające) przykłady jego zastosowania.

Firma Macromedia nie ma w zwyczaju rozczarowywać swych klientów i z reguły każdy nowy produkt opatrzony jej logo w pełni zasługuje na zainteresowanie odbiorców. Nie inaczej jest z piątą wersją Flash. Program doczekał się licznych zmian zarówno w zakresie interfejsu użytkownika, jak i możliwości edycyjnych i programistycznych.

Zobacz również:

Interfejs użytkownika

Do najważniejszych innowacji należy z pewnością możliwość przedefiniowania skrótów klawiszowych (znawcy tematu twierdzą, że efektywne korzystanie z klawiatury jest podstawowym warunkiem skutecznej i wygodnej pracy z programem). Aby umożliwić kontrolę nad dziesiątkami opcji, podstawowe funkcje edycyjne zostały zebrane w kilkanaście "pływających" palet. Takie rozwiązanie pozwala na utrzymanie porządku w obrębie obszaru edycyjnego programu z zachowaniem łatwego dostępu do najczęściej wykorzystywanych poleceń. Równie przydatny jest Movie Explorer - okno prezentujące hierarchiczny dostęp do wszystkich elementów składowych tworzonego przez nas projektu. Jest to szczególnie pomocne, jeśli projekt zawiera duża liczbę zagnieżdżonych symboli lub liczne sekcje kodu ActionScript. Dzięki Movie Explorerowi potrzebny fragment zawsze znajduje się w zasięgu myszki. Nieco bardziej zaawansowani twórcy powinni docenić możliwość ręcznego wprowadzania kodu ActionScript (do tej pory było możliwe wyłącznie konstruowanie poleceń przy użyciu kreatora). Kto raz przyswoi składnię tego potężnego języka, szybko przekona się jak przydatna jest to opcja.

Edycja grafiki

Dla tych, którzy sądzili, że już nic nie można ani ulepszyć, ani dodać do istniejącego zestawu narzędzi graficznych Flash, mamy niespodziankę. Jak przystało na profesjonalny program graficzny, edytor ten zyskał funkcje edycji krzywych Beziera. W ten sposób zachowano znaną ze swej prostoty metodę edycji kształtów, zaś graficy bardziej wymagający (przyzwyczajeni do innych programów graficznych) mogą z dużą precyzją operować kształtami za pomocą punktów kontrolnych i wyginaczy. Uproszczono też obsługę linii prowadzących (Guides). Teraz wystarczy przeciągnąć myszką z linijki zlokalizowanej na lewej i górnej krawędzi sceny (można je aktywizować skrótem {Ctrl+Alt+Shift+R} w wybrane miejsce, by pojawiła się pionowa lub pozioma linia prowadząca.

Poważnych zmian doczekały się funkcje drukowania prezentacji Flash. Oprócz standardowej metody uzyskania wydruku (polecenie File/Print... z poziomu edytora lub kontekstowego menu) istnieje możliwość sterowania wydrukiem z poziomu prezentacji. Służą do tego polecenia ActionScript (print() i printAsBitmap()). Ten sposób pozwala na precyzyjne określenie zarówno parametrów, jak i obszaru wydruku. Klasycznym przykładem zastosowania tej funkcji jest uzyskanie pełnoekranowego wydruku (zawierającego np. dokumentację techniczną czy pełnowymiarowe zdjęcie produktu) z banera reklamowego, umieszczonego na stronie WWW.

Programowanie interakcji

Najwięcej zmian i rozszerzeń dotyczy języka ActionScript. W piątej wersji znacznie upodobnił się on do JavaScript, przejmując od niego większość składni i część modelu obiektowego. Zaimplementowane mechanizmy pozwalają na stosowanie większości sztuczek powszechnych w dokumentach HTML i DHTML: dynamiczne tablice, tworzenie metod i funkcji, rozbudowana obsługa zdarzeń czy nawet dziedziczenie i prototypowanie klas! Trudno przecenić rolę tego języka w procesie tworzenia skomplikowanych, interaktywnych aplikacji (obecnie słowo to zdecydowanie lepiej pasuje do dokumentów Flasha niż używane dotychczas "prezentacje" czy "filmy"). Obowiązującym językiem wymiany informacji w sieci stał się XML, dlatego nowa wersja formatu SWF korzysta z danych przechowywanych w tej postaci. (Aby w pełni wykorzystać możliwości wbudowanego parsera XML, aplikacje Flasha powinny być uruchamiane w środowisku Internet Explorer 5.5.) To otwiera nowe możliwości w zakresie komunikacji Flasha z innymi aplikacjami i mediami zlokalizowanymi zarówno na tej samej maszynie (np. pliki z danymi), jak i w dowolnym miejscu w Internecie (np. serwer HTTP czy serwer danych typu RDBMS). Dzięki temu zaprojektowanie i wykonanie flashowych wersji programu do pogaduszek czy sieciowej wyszukiwarki jest możliwe bez uciekania się do karkołomnych i mało skutecznych rozwiązań.

Nawigacja we Flashu - krok po kroku

Najczęstszym zastosowaniem interaktywnych prezentacji Flasha jest realizacja systemu nawigacji na stronie WWW, dlatego prezentowany przykład również dotyczy tego zagadnienia. Z pewnością nie wyczerpuje on możliwości (graficznych i funkcjonalnych) oferowanych przez Flasha, lecz może stanowić początek samodzielnych prób tworzenia odpowiedniej aplikacji.

Ustawienia

Kliknij, aby powiększyć

1. Po otwarciu nowego pliku ustaw podstawowe parametry twojego filmu. W tym celu kliknij dwukrotnie pole z napisem "12.0 fps" pod linią czasu i wprowadź następujące parametry: Frame Rate=50, Width=150, Height=300. Kolor tła aplikacji wybierz z palety (jasnoniebieski).

2. Wybierz polecenie Modify/Scene... i dodaj (przyciskiem ze znakiem "+") nową scenę. Zmień nazwy obu scen (kliknij dwukrotnie nazwę i wprowadź nową) na "intro" i "menu". Następnie przejdź do pierwszej sceny, klikając przycisk z filmowym klapsem w prawym górnym rogu, i wybierz "intro".

Intro

Kliknij, aby powiększyć

3. Dodaj 2 nowe warstwy (za pomocą przycisku ze znakiem plus z lewej strony pod nazwami istniejących warstw) i nazwij kolejno wszystkie trzy: "witaj", "wybierz" i "sekcje".

Kliknij, aby powiększyć

4. Wybierz warstwę "witaj" i wstaw tu 50 klatek (zaznacz klatki od 1 do 50 i naciśnij {F5}), a następnie stwórz na niej pole tekstowe, zawierające napis "witaj..." utworzony z białych liter kroju Times New Roman i stopniu pisma 40 (właściwości tekstu możesz zmienić w palecie "Character").