SlideShare a Scribd company logo
1 of 20
Download to read offline
IDZ DO
         PRZYK£ADOWY ROZDZIA£

                           SPIS TRE CI   Macromedia Flash MX 2004.
                                         Oficjalny podrêcznik
           KATALOG KSI¥¯EK               Autor: Jen Dehaan
                                         T³umaczenie: Rafa³ Joñca (rozdz. 1 – 7, 13, dod. A – C),
                      KATALOG ONLINE     Konrad Mantorski (rozdz. 8 – 12)
                                         ISBN: 83-7361-534-2
       ZAMÓW DRUKOWANY KATALOG           Tytu³ orygina³u: Macromedia Flash MX 2004:
                                         Training from the Source
                                         Format: B5, stron: 416
              TWÓJ KOSZYK
                    DODAJ DO KOSZYKA     Macromedia Flash MX 2004 i Macromedia Flash MX 2004 Professional to aplikacje
                                         s³u¿¹ce do tworzenia publikacji multimedialnych opartych na grafice wektorowej.
                                         Mnogo æ narzêdzi graficznych, mo¿liwo ci tworzenia animacji, stosowania plików
         CENNIK I INFORMACJE             graficznych i d wiêkowych w ró¿nych formatach oraz rozbudowany obiektowy jêzyk
                                         programowania ActionScript daj¹ projektantom nieograniczon¹ swobodê twórcz¹.
                   ZAMÓW INFORMACJE      Za pomoc¹ Flasha mo¿na stworzyæ zarówno proste przyciski nawigacyjne, jak
                     O NOWO CIACH        i interaktywn¹ witrynê WWW korzystaj¹c¹ z baz danych i jêzyka XML.
                                         „Macromedia Flash MX 2004. Oficjalny podrêcznik” to zbiór æwiczeñ i przyk³adów
                       ZAMÓW CENNIK      przygotowanych przy wspó³pracy z firm¹ Macromedia — producentem Flasha.
                                         Dziêki przyk³adom przedstawianym w kolejnych lekcjach poznasz poszczególne funkcje
                                         i narzêdzia aplikacji Flash MX 2004. Dowiesz siê miêdzy innymi, jak tworzyæ przyciski
                 CZYTELNIA               i ³¹cza, rysowaæ i animowaæ, formatowaæ tekst, wczytywaæ zewnêtrzne dane
                                         do aplikacji i pisaæ skrypty ActionScript.
          FRAGMENTY KSI¥¯EK ONLINE          • Podstawy korzystania z Flasha
                                            • Narzêdzia graficzne
                                            • Wprowadzanie i formatowanie tekstu
                                            • Tworzenie i edycja symboli
                                            • Animacja automatyczna i poklatkowa
                                            • Elementy interaktywne
                                            • Korzystanie z plików d wiêkowych i cyfrowego wideo
                                            • Stosowanie komponentów do tworzenia interaktywnych formularzy
                                            • Wczytywanie danych z plików
                                            • Podstawy jêzyka ActionScript
                                            • Publikowanie gotowej prezentacji
Wydawnictwo Helion                                        Poznaj mo¿liwo ci Flasha MX 2004 w praktyce,
ul. Chopina 6
44-100 Gliwice                                      wykorzystuj¹c podrêcznik polecany przez firmê Macromedia.
tel. (32)230-98-63
e-mail: helion@helion.pl
Spis treści
O Autorce ................................................................................................................................................................................................. 9

Wprowadzenie ..................................................................................................................................................................................... 11

Lekcja 1. Podstawy programu...................................................................................................................................................... 17
       Wprowadzenie do programu Macromedia Flash MX 2004................................................................................. 18
       Przestrzeń robocza Flasha .........................................................................................................................................20
       Tworzenie pierwszego dokumentu ..........................................................................................................................22
       Korzystanie z paneli................................................................................................................................................... 26
       Listwa czasowa i klatki............................................................................................................................................... 30
       Warstwy ....................................................................................................................................................................... 34
       Modyfikacja ustawień programu ............................................................................................................................. 38
       Testowanie pliku FLA................................................................................................................................................ 41
       Szukanie pomocy ....................................................................................................................................................... 43
       Projekt.......................................................................................................................................................................... 45

Lekcja 2. Tworzenie grafiki............................................................................................................................................................ 47
       Przybornik...................................................................................................................................................................49
       Tworzenie grafiki przy użyciu narzędzi rysowania ............................................................................................... 53
       Korzystanie z prowadnic, siatek, współrzędnych i przyciągania......................................................................... 56
       Tworzenie nowej grafiki ............................................................................................................................................ 57
       Tworzenie i korzystanie z masek.............................................................................................................................. 62
       Dodawanie pociągnięć pędzla (konturów) ............................................................................................................. 63
       Biblioteka .................................................................................................................................................................... 64
       Import i optymalizacja grafiki ................................................................................................................................. 67
       Import grafiki wektorowej ........................................................................................................................................70
       Wypełnienia i gradienty ............................................................................................................................................ 73
       Modyfikacja grafiki....................................................................................................................................................77

Lekcja 3. Korzystanie z tekstu ..................................................................................................................................................... 81
       Narzędzie Text ............................................................................................................................................................82
       Dodawanie tekstu do dokumentu ...........................................................................................................................84
       Korzystanie z osadzonych czcionek ........................................................................................................................90
Właściwości czcionek................................................................................................................................................. 91
          Dodawanie efektów listwy czasowej do pola tekstowego...................................................................................... 96
          Sprawdzanie pisowni dokumentu ...........................................................................................................................98
          Korzystanie z komponentów tekstowych ...............................................................................................................99
          Istota działania dynamicznych pól tekstowych ................................................................................................... 100

    Lekcja 4. Tworzenie i edycja symboli...................................................................................................................................101
          Omówienie symboli................................................................................................................................................. 102
          Symbole graficzne .................................................................................................................................................... 106
          Tworzenie przycisków ............................................................................................................................................. 107
          Rozmieszczanie przycisków na scenie....................................................................................................................110
          Tworzenie przycisków tekstowych..........................................................................................................................112
          Tworzenie niewidzialnego przycisku .....................................................................................................................113
          Tworzenie klipów filmowych i korzystanie z nich ...............................................................................................117
          Tworzenie menu....................................................................................................................................................... 120
          Tworzenie przycisków klipów filmowych ............................................................................................................ 123
          Duplikowanie symboli i dodawanie ich do sceny ............................................................................................... 126

    Lekcja 5. Tworzenie animacji ....................................................................................................................................................129
          Rodzaje animacji .......................................................................................................................................................131
          Tworzenie automatycznej animacji ruchu ............................................................................................................131
          Dodawanie automatycznej animacji ruchu.......................................................................................................... 135
          Animacja poziomów przezroczystości i wielkości .............................................................................................. 138
          Animacja przycisku klipu filmowego ................................................................................................................... 140
          Tworzenie automatycznej animacji kształtu .........................................................................................................141
          Tworzenie animacji „klatka po klatce” ................................................................................................................. 143
          Animacja wzdłuż ścieżki ......................................................................................................................................... 147
          Efekty listwy czasowej w animacji .......................................................................................................................... 153

    Lekcja 6. Dodawanie prostej interaktywności..................................................................................................................157
          Dodawanie interaktywności do dokumentów Flasha.............................................................................................. 159
          Wprowadzenie do behawiorów .............................................................................................................................. 159
          Wykorzystywanie behawiora do wczytania obrazu JPEG .................................................................................. 160
          Wykorzystywanie behawiora do otwarcia strony WWW ........................................................................................ 163
          Przeglądanie kodu behawiorów ............................................................................................................................. 165
          Implementacja prostej interakcji z serwerem przy użyciu komponentu ......................................................... 166
          Wprowadzenie do języka ActionScript ................................................................................................................. 169
          Korzystanie z akcji sterujących odtwarzaniem listwy czasowej ......................................................................... 175
          Tworzenie przycisku powrotu do klatki home .................................................................................................... 176



6     MACROMEDIA FLASH MX 2004
      Oficjalny podręcznik
Usuwanie kursora ręki............................................................................................................................................. 178
      Kończenie przycisku klipu filmowego.................................................................................................................. 179
      Korzystanie z nawigatora skryptów i pinesek .......................................................................................................181

Lekcja 7. Dźwięk i wideo .............................................................................................................................................................185
      Korzystanie z dźwięku i filmów wideo.................................................................................................................. 187
      Dostarczanie mediów w Internecie........................................................................................................................ 189
      Dodanie dźwięku do przycisku.............................................................................................................................. 189
      Import dźwięku do dokumentu............................................................................................................................. 192
      Dostosowanie dźwięku do własnych potrzeb....................................................................................................... 195
      Import wideo do Flasha........................................................................................................................................... 197
      Eksport do formatu FLV .........................................................................................................................................208

Lekcja 8. Ekrany ...............................................................................................................................................................................211
      Ekrany — wprowadzenie ........................................................................................................................................ 213
      Tworzenie nowej prezentacji ekranowej................................................................................................................ 214
      Dodawanie do prezentacji dźwięku i wideo ......................................................................................................... 217
      Sterowanie dźwiękiem ............................................................................................................................................. 221
      Przemieszczanie się między ekranami...................................................................................................................223
      Wstawianie efektów przejścia i maski....................................................................................................................224
      Tworzenie przewodnika w programie Flash MX 2004........................................................................................226
      Ładowanie przewodnika do witryny Tech Bookstore..............................................................................................234

Lekcja 9. Tworzenie formularzy za pomocą komponentów ......................................................................................237
      Formularze i dane — wprowadzenie.....................................................................................................................238
      Komponenty Flasha — wprowadzenie .................................................................................................................240
      Tworzenie formularza zwrotnego..........................................................................................................................243
      Korzystanie z komponentu Button.......................................................................................................................247
      Tworzenie kwestionariusza .....................................................................................................................................250
      Korzystanie z klasy FocusManager........................................................................................................................257

Lekcja 10. Zamieszczanie danych dynamicznych ..........................................................................................................261
      Dane dynamiczne — wprowadzenie .....................................................................................................................262
      Definiowanie usług internetowych w programie Flash MX Professional........................................................264
      Wywoływanie usługi sieci WWW w programie Flash MX Professional ........................................................... 266
      Tworzenie formularza zwrotnego w programie Flash MX 2004 .......................................................................270
      Tworzenie kwestionariusza w programie Flash MX Professional .....................................................................273
      Tworzenie kwestionariusza w programie Flash MX 2004 ..................................................................................276
      Tworzenie strony książki rekomendowanej w programie Flash MX Professional..........................................278
      Tworzenie strony książki rekomendowanej w programie Flash MX 2004.......................................................282


                                                                                                                                                                           SPIS TREŚCI                7
Lekcja 11. Podstawy ActionScript .........................................................................................................................................287
           ActionScript 1.0 i ActionScript 2.0 — wprowadzenie ........................................................................................289
           Ścisła kontrola typów i uzupełnianie kodu ..........................................................................................................290
           Klasy, metody i właściwości ....................................................................................................................................293
           Funkcje i instrukcje warunkowe.............................................................................................................................294
           Zakres.........................................................................................................................................................................296
           Klasa LoadVars .........................................................................................................................................................299
           Tworzenie strony recenzji ....................................................................................................................................... 301
           Korzystanie ze zdarzeń, uchwytów zdarzeń i sond.............................................................................................. 306
           Formatowanie recenzji przy użyciu kaskadowych arkuszy stylów....................................................................309
           Tworzenie stron katalogu.........................................................................................................................................311
           Tworzenie głównej strony katalogu ....................................................................................................................... 316
           Tworzenie strony wiadomości................................................................................................................................ 319
           Tworzenie strony głównej ....................................................................................................................................... 321
           Dodawanie animacji do menu ...............................................................................................................................324
           Sterowanie przyciskami menu................................................................................................................................ 330

    Lekcja 12. Optymalizacja zawartości ...................................................................................................................................333
           Optymalizacja dokumentów .................................................................................................................................. 334
           O organizowaniu aplikacji i dobrych nawykach ................................................................................................. 336
           Ładowanie nowej zawartości................................................................................................................................... 337
           Dodawanie komponentu ProgressBar ..................................................................................................................344
           Ładowanie witryny Tech Bookstore ......................................................................................................................347
           Testowanie i usuwanie błędów z kodu witryny Tech Bookstore........................................................................ 351

    Lekcja 13. Publikacja dokumentów Flasha........................................................................................................................357
           Publikacja plików SWF............................................................................................................................................ 358
           Wykrywanie odtwarzacza Flash Player.................................................................................................................. 364
           Osadzanie pliku SWF na stronie HTML .............................................................................................................. 367
           Umieszczenie przykładowej witryny na serwerze WWW ...................................................................................370
           Na zakończenie ........................................................................................................................................................ 373

    Dodatek A Instalacja rozszerzeń .............................................................................................................................................375

    Dodatek B Zasoby...........................................................................................................................................................................381

    Dodatek C Skróty klawiaturowe..............................................................................................................................................391

    Skorowidz ..........................................................................................................................................................................................397




8     MACROMEDIA FLASH MX 2004
      Oficjalny podręcznik
5              Tworzenie animacji
Flash już od wielu lat jest dobrze znanym programem do tworzenia animacji. Głównie dlatego, iż
bardzo dobrze spełnia zadanie animacji grafiki. Dzięki niewielkim rozmiarom plików SWF i doskona-
łej jakości grafiki Flash stał się doskonałym narzędziem do tworzenia animacji dostępnych w Interne-
cie. W ostatnich latach Flash jest nawet wykorzystywany do tworzenia animacji na potrzeby telewizji
(głównie reklam telewizyjnych i kreskówek). Flash znalazł tak wiele zastosowań nie przez przypadek:
jest doskonałym narzędziem do tworzenia i animacji grafiki wektorowej.

Animacja
na tworzonej
witrynie.
Firma Macromedia dołożyła starań, by animacja obiektów na scenie była bardzo prosta zarówno dla
      początkujących, jak i ekspertów. Bardzo łatwo można dodać ruch do dokumentu, używając efektów
      listwy czasowej, kreujących animację za nas. Wystarczy tylko kilka kliknięć i już można uzyskać
      efekty takie jak rozmycie, wybuch, rozszerzenie, transformacja i przejście. Oczywiście można także
      tworzyć własne animacje, używając animacji automatycznej i animacji „klatka po klatce”. W niniej-
      szej lekcji poznasz wszystkie te techniki.


      Czego się nauczysz
      Po tej lekcji będziesz potrafił:
         Opisać różne rodzaje animacji
         Dodać ruch do systemu menu
         Wykorzystać efekt łagodzenia do spowolnienia lub przyspieszenia automatycznej
         animacji ruchu
         Zmienić jasność i przezroczystość dzięki automatycznej animacji ruchu
         Dodać automatyczną animację kształtu
         Wykonać animację „klatka po klatce”
         Wykorzystać warstwę ścieżki ruchu, by poruszać symbol po wektorowej ścieżce
         Użyć efektów listwy czasowej do animacji klonów


      Czas trwania
      Lekcja zajmie około 2 godzin.


      Materiały do lekcji
      Pliki multimedialne:
         brak

      Pliki startowe:
         Lekcja05/bookstore9.fla
         Lekcja05/map_starter.fla

      Gotowy projekt:
         Lekcja05/bookstore9_complete.fla
         Lekcja05/map.fla




130    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
Rodzaje animacji
Animacja jest sekwencją obrazów tworzących iluzję ruchu, jeżeli kolejne obrazy są wyświetlane wystar-
czająco szybko. We Flashu obrazem jest grafika znajdująca się w klatce listwy czasowej. Do uzyskania
animacji i ruchu w plikach FLA można wykorzystać rysunki, zdjęcia, a nawet kod ActionScript.

Istnieje kilka sposobów tworzenia animacji we Flashu. Można kreować automatyczną animację
ruchu, automatyczną animację kształtu lub animację „klatka po klatce”. Animacja automatycz-
na dotyczy obliczeń (na przykład zmiany właściwości lub kształtu obiektu) wykonywanych przez
Flasha między ustalonymi stanami obiektu (klatkami kluczowymi). Gdy na przykład stosuje się
automatyczną animację ruchu między zbiorem klatek kluczowych, Flash sam tworzy ruch, wypeł-
niając przestrzeń między klatkami kluczowymi odpowiednimi przejściami. Automatyczna animacja
kształtu służy do modyfikacji wektorowych linii lub krzywych (na przykład do zamiany kwadratu
w okręg). Automatyczna animacja ruchu zmienia właściwości obiektu, na przykład może przesu-
wać obiekt po scenie. W tej lekcji wykonamy oba rodzaje ruchu.

Animacja „klatka po klatce” jest bardziej tradycyjnym sposobem tworzenia animacji. W tym przy-
padku to nie Flash wypełnia przejścia między klatkami kluczowymi, ale my sami rysujemy poszcze-
gólne klatki animacji. Tego rodzaju animacja potrzebna jest wtedy, gdy chce się uzyskać pewne efekty
specjalne niemożliwe do wykonania innymi technikami. Oczywiście wykonanie animacji „klatka po
klatce” jest zdecydowanie bardziej pracochłonne i zajmuje więcej miejsca w wynikowym pliku SWF.


              Możliwe jest także tworzenie animacji na podstawie skryptów ActionScript. Dodatkowo istnieje
              oddzielny interfejs programistyczny języka ActionScript poświęcony rysowaniu linii i kształtów na
              scenie – Drawing API. Można z niego korzystać na wiele różnych sposobów. Choć zagadnienie to
              wykracza poza ramy niniejszej książki, warto zapoznać się z tymi technikami, gdy już opanuje się
              podstawy skryptów ActionScript.



Tworzenie automatycznej animacji ruchu
Jak się przed chwilą dowiedziałeś, automatyczna animacja ruchu służy do zmiany właściwości obiek-
tów w pewnym obszarze klatek. Można zmieniać właściwości takie jak położenie, rozmiar, przezro-
czystość, zabarwienie i obrót, a nawet przemieszczać obiekt wzdłuż ścieżki. Zawsze warto zamienić
obiekt na symbol przed przystąpieniem do tworzenia automatycznej animacji ruchu, gdyż pomaga
to utrzymać niewielkie rozmiary pliku SWF. Rozmiar pliku może być niewielki, gdyż Flash wielokrot-
nie korzysta z tego samego elementu z biblioteki, zamiast za każdym razem tworzyć go od podstaw.


              Możliwa jest automatyczna animacja kształtu surowych obiektów wektorowych, ale nie można w ten
              sposób animować bitmap ani klonów. Aby dokonać takiej animacji, trzeba rozbić bitmapę lub klon
              na elementy składkowe, używając polecenia Modify/Break Apart. W dalszej części omówimy ten
              rodzaj animacji automatycznej na podstawie grafiki wektorowej.




                                                                                                    LEKCJA 5.     131
                                                                                             Tworzenie animacji
Istnieje kilka różnych sposobów dodawania automatycznej animacji ruchu do plików FLA. Omó-
      wimy je w tej lekcji. W tym ćwiczeniu dodamy automatyczną animację ruchu do menu witryny
      wykonanego w poprzedniej lekcji, aby uzyskać efekt wysuwania się i zamykania menu. Dodamy
      także akcję stop, aby zatrzymać animację (nie chcemy mieć zapętlonej animacji w pliku SWF).
       1. Otwórz plik bookstore8_complete.fla utworzony w poprzedniej lekcji. Znajdziesz go także
         w katalogu Lekcja04. Zapisz nową wersję dokumentu w pliku bookstore9.fla.
         W lekcji 4. wykonaliśmy większość symboli, których animacją zajmiemy się w niniejszej
         lekcji. Zapisujemy dokument pod nową nazwą, ponieważ dodajemy wiele nowych informacji
         do tego pliku. Zapisując nową wersję, zawsze można powrócić do starszej wersji, gdy coś
         poszło nie tak i zacząć wszystko od początku.
       2. Znajdź klon symbolu products_btn na scenie, naciśnij klawisz F8, aby skonwertować go
         do klipu filmowego. Nadaj klipowi nazwę productsMenu_mc.
         Ten proces może się niektórym osobom wydawać nieco dziwny. Powodem, dla którego
         umieszcza się grafikę, przyciski i linie wewnątrz klipu filmowego, jest możliwość jednoczesnej
         animacji całości. Próba osobnej animacji poszczególnych elementów jest zbyt pracochłonna.
         Poza tym przy aktualnych ustawieniach dokumentu bezpośrednia animacji products_mc nie
         byłaby możliwa. Umieszczenie wszystkiego w klipie filmowym zapewnia animację wszystkiego
         jako jednej całości i dodatkowo umożliwia sterowanie animacją z poziomu kodu ActionScript.


                   Jeżeli masz problemy z zaznaczeniem menu, ponieważ przyciski ułożone są jeden nad drugim, zablokuj
                   warstwę buttons i dodatkowo ukryj ją, klikając kropkę pod ikoną kłódki.


       3. Dwukrotnie kliknij klon productsMenu_mc, aby rozpocząć jego edycję na scenie. Powiększ
         menu, jeżeli jest to konieczne.
         Po dwukrotnym kliknięciu klonu productsMenu_mc pozostała część sceny stanie się wyszarzona,
         aby można się było skoncentrować na edycji symbolu. Edycja symbolu na scenie umożliwi
         animację menu względem innych obiektów.


                   Aby powiększyć menu, wybierz narzędzie Zoom z przybornika. Narzędzie jest ustawione na powięk-
                   szanie, jeśli na narzędziu widać znak plus. Jeżeli nie widać tego znaku, wybierz opcję Enlarge z działu
                   opcji przybornika.


         Kliknij menu na scenie, używając narzędzia Zoom. Scena powiększy się, zachowując menu
         na środku. Powtórz ten krok kilka razy, ale upewnij się, iż przy powiększeniu nadal
         widać przycisk products_btn powyżej menu. Wybierz narzędzie Selection z przybornika
         po zakończeniu powiększania.
       4. Zaznacz warstwę Layer 1 i zmień jej nazwę na menu tween. Wstaw nową warstwę i nadaj jej
         nazwę actions. Dodaj klatki kluczowe do warstwy actions w klatkach 11. i 20.
         Zaznacz warstwę menu tween i kliknij przycisk Insert Layer. Zmień nazwę nowej warstwy
         na actions. Utwórz nowe klatki kluczowe w klatkach 11. i 20. nowej warstwy, zaznaczając
         każdą z klatek i naciskając klawisz F6. Zmienimy położenie klipu filmowego w każdej

132    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
klatce kluczowej. Zmiana położenia klipu filmowego utworzy animację po dodaniu
  automatycznego przejścia między klatkami kluczowymi. Automatyczną animację dodamy
  w następnym ćwiczeniu.
  Jeżeli pozostawisz na scenie klip filmowy zawierający więcej niż jedną klatkę, będzie on
  odtwarzany w pętli aż do zatrzymania go za pomocą odpowiedniego kodu ActionScript.
  W następnym kroku dodamy akcję stop, aby wyłączyć zapętlenie klipu filmowego.
5. Dodaj akcję stop do listwy czasowej sterującej animacją.

  Otwórz panel Actions, wybierając polecenie Window/Development Panels/Actions z głównego menu.
  Panel ten pojawi się zadokowany na dole sceny w systemie Windows lub będzie panelem
  swobodnym w systemie Mac OS. Okno skryptu to duży obszar tekstowy po prawej stronie
  panelu. Po lewej stronie panelu znajduje się nawigator skryptów i pasek narzędziowy akcji.




  Dodamy teraz trochę kodu ActionScript do panelu Actions. Zaznacz klatkę kluczową
  z pierwszej klatki listwy czasowej i wpisz w oknie skryptu tekst stop();. Następnie zaznacz
  klatkę kluczową w klatce 11. i wpisz ten sam tekst. Powtórz to samo dla klatki 20. Akcja stop
  zatrzyma odtwarzanie aktualnego klipu filmowego w tych klatkach. W lekcji 11. dodamy kod,
  który spowoduje odpowiednie animowanie menu. Powodem, dla którego umieszczamy akcję
  stop przed klatką kluczową z klatki 12. (wykonamy to w następnym kroku), jest potrzeba
  zatrzymania animacji po rozwinięciu menu. Gdyby brakło tej akcji, zaczęłaby być odtwarzana
  animacja zamykania menu. Podobnie po zakończeniu animacji zamykania menu istnieje
  odpowiednia akcja stop wyłączająca ponowne rozwinięcie menu.
  Gdy zakończysz dodawanie kodu ActionScript, zablokuj warstwę actions, klikając kropkę pod
  ikoną kłódki. W ten sposób zabezpieczymy się przed dodaniem czegokolwiek do tej warstwy.
  Zaleca się nieumieszczanie żadnej surowej grafiki, klonów symboli, komponentów i innych
  elementów na warstwach kodu ActionScript. Jeżeli umieścisz kod na tej samej warstwie
  co inne obiekty, na przykład komponenty, po eksporcie dokumentu do formatu SWF
  mogą się pojawić pewne problemy. Poza tym takie rozwiązanie może znacznie utrudnić
  testowanie plików FLA (patrz pierwszy rysunek na następnej stronie).
6. Wstaw nową warstwę o nazwie labels. Dodaj do nowej warstwy dwie klatki kluczowe
  w klatkach 2. i 12., a następnie zablokuj tę warstwę.
  Utwórz nową warstwę bezpośrednio pod warstwą actions i nadaj jej nazwę labels. Utwórz nowe
  klatki kluczowe w klatkach 2. i 12., zaznaczając każdą z nich i naciskając klawisz F6.


                                                                                        LEKCJA 5.     133
                                                                                 Tworzenie animacji
Zaznacz drugą klatkę warstwy labels i wpisz nazwę etykiety slidedown w polu tekstowym
         <Frame Label> z inspektora Properties. Następnie zaznacz klatkę 12. i w tym samym polu
         wpisz tekst slideup. Na końcu zablokuj warstwę labels w sposób opisany w poprzednim kroku,
         aby uniemożliwić przypadkową modyfikację zawartości warstwy.




       7. Wstaw nowe klatki kluczowe w klatkach 12. i 20. warstwy menu tween.

         Te klatki zdefiniują sposób animacji menu. Klatka 12. jest końcem animacji otwierania
         menu i początkiem animacji zamykania menu.

       8. Zmień położenie klipu filmowego product_mc w klatce 12.

         Zaznacz klon product_mc na scenie w klatce 12. Przemieść klip dokładnie w dół, przytrzymując
         klawisz Shift i naciskając klawisz strzałki w dół aż do momentu znalezienia się klipu
         dokładnie poniżej paska bar_gr (patrz rysunek na następnej stronie).

       9. Powróć do głównej sceny i powtórz te same kroki dla dwóch pozostałych menu.

         Kliknij łącze Scene 1 na pasku edycji, aby powrócić na główną scenę. Powtórz kroki od 2. do 8.
         dla symboli contact_mc i company_mc. Gdy skończysz ten krok, wszystkie trzy menu będą
         gotowe do wykonania w nich animacji automatycznej.

      10. Pamiętaj o zapisaniu do pliku zmian w dokumencie FLA.

         Mamy już ustawione klipy filmowe menu w taki sposób, iż bardzo łatwo będzie można
         dodać do nich automatyczną animację ruchu. Zamiast wstawiać automatyczną animację,
         a następnie dodawać zawartość, najpierw rozmieściliśmy zawartość, a dopiero później
         dodamy animację automatyczną. Flash jest elastyczny i umożliwia zastosowanie wielu
         różnych podejść do tworzenia animacji: można najpierw dodać automatyczną animację
         ruchu, a następnie przesunąć klon lub też najpierw przesunąć klon, a dopiero później
         utworzyć animację automatyczną. W następnym podrozdziale dodamy animację
         automatyczną, aby ożywić wykonane symbole.




134    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
Na danej warstwie można utworzyć tylko jedną animację automatyczną ruchu. Jeżeli chce się wykonać
              animację wielu symboli, trzeba umieścić każdy z symboli na osobnej warstwie. Aby przenieść kilka
              symboli znajdujących się na jednej warstwie do wielu warstw, wystarczy zaznaczyć symbole i użyć
              polecenia rozdzielania na warstwy (Modify/Timeline/Distribute to Layers).
              Rozdzielanie na warstwy przydaje się na przykład wtedy, gdy trzeba wykonać animację poszczegól-
              nych znaków bloku tekstu (po wcześniejszym rozbiciu tekstu na litery) lub też po zaimportowaniu
              grupy elementów w czasie tworzenia pliku FLA. Flash zmieni nazwy każdej warstwy, używając
              nazwy zaimportowanego pliku. Rozdzielenie na warstwy przyspiesza proces tworzenia filmów
              Flasha, gdyż zapewnia lepszą organizację dokumentu.



Dodawanie automatycznej animacji ruchu
Automatyczna animacja ruchu służy między innymi do zmiany położenia, jasności, przezroczysto-
ści i zabarwienia klonu na scenie. W inspektorze Properties znajduje się rozwijana lista o nazwie Color,
która służy do zmiany jasności, przezroczystości i zabarwienia klonu. Opcja Advanced umożliwia

                                                                                                    LEKCJA 5.     135
                                                                                             Tworzenie animacji
jednoczesną zmianę kolorów i przezroczystości. Jeżeli posiadasz klon z automatyczną animacją
      ruchu, wybranie odpowiednich wartości z listy w klatce kluczowej powoduje przejście do wprowa-
      dzonych właśnie ustawień lub rezygnację z nich w trakcie trwania animacji.

      Po ustawieniu klatek kluczowych w klipie filmowym, a także ustaleniu położenia początkowego i koń-
      cowego klipu filmowego można rozpocząć wstawianie automatycznej animacji ruchu. Dodatkowo
      wykonamy także animację jasności menu, używając wartości ustawionych w inspektorze Properties.

       1. W dokumencie bookstore9.fla otwórz klon productsMenu_mc, jeżeli nie jest on otwarty.
         Zaznacz warstwę menu tween.

         Będziemy pracować z tym samym klipem filmowym i zawartością, co w poprzednim ćwiczeniu.

       2. Utwórz automatyczną animację ruchu między klatką 1. i 12. dla animacji otwierania menu.

         Kliknij prawym klawiszem myszy (Control+kliknięcie w Mac OS) klatki od 1. do 12. z warstwy
         menu tween i wybierz polecenie Create Motion Tween z menu kontekstowego. Zauważysz, iż kolor
         tła ciągu klatek zmienił kolor na purpurowy oraz że pojawiła się strzałka przecinająca cały
         ciąg klatek. Ta zmiana wyglądu wskazuje, iż powstała automatyczna animacja ruchu.
         Rysunek dla kroku 3. przedstawia listwę czasową zawierającą dwie animacje.

       3. Dodaj drugą automatyczną animację ruchu, aby zapewnić animację zamykania menu.
         Następnie przetestuj animację, przeciągając znacznik odtwarzania po listwie czasowej.

         Powtórz krok 2., aby dodać animację automatyczną między klatkami 12. i 20. Zaznacz dowolną
         z klatek z podanego przedziału i kliknij prawym klawiszem myszy (Control+kliknięcie w Mac
         OS), a następnie z menu kontekstowego wybierz polecenie Create Motion Tween. Gdy wykonasz
         te kroki, menu będzie się otwierało między klatkami numer 1 i 12 oraz zamykało między
         klatkami numer 12 i 20. Przeciągnij znacznik odtwarzania, aby się o tym przekonać.


                    Po wykonaniu animacji automatycznej zawsze można zmienić czas jej trwania, dodając lub usu-
                    wając klatki znajdujące się między klatkami kluczowymi. Klatki można dodać, zaznaczając jedną
                    z klatek wewnątrz animacji i naciskając klawisz F5. Klatki można usunąć poleceniem Remove
                    Frames z menu kontekstowego. Flash automatycznie dostosuje animację do wprowadzonych zmian.




       4. Dodaj łagodzenie ruchu do automatycznej animacji, używając inspektora Properties.

         Suwak Ease znajduje się w inspektorze Properties, gdy zaznaczona jest automatyczna animacja
         ruchu. Można łagodzić animację na początku lub na końcu, aby uzyskać efekt przyspieszania
         lub spowalniania. Domyślnie łagodzenie (parametr Ease) jest ustawione na 0, co oznacza brak
         efektu. Wprowadzenie wartości domyślnych w granicach od 1 do 100 powoduje spowolnienie


136    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
animacji na jej końcu. Wpisanie wartości ujemnych od –1 do –100 powoduje początkową
  powolność animacji, a następnie jej przyspieszenie. Pierwszy rodzaj animacji nazywany jest
  animacją spowalniającą, a drugi animacją przyspieszającą.

  Zaznacz pierwszą klatkę i rozwiń panel inspektora Properties. Ustaw suwak Ease na wartość 100,
  a wykonasz animację spowalniającą (menu na końcu animacji będzie się przesuwało wolniej
  niż na jej początku). Następnie zaznacz klatkę 12. i ustaw suwak Ease na wartość –100,
  co oznacza animację przyspieszającą. Menu będzie powoli przyspieszało w trakcie zamykania.




5. Dodaj animację jasności do menu, a następnie przetestuj animację, przeciągając znacznik
  odtwarzania po listwie czasowej.
  Zaznacz klon productsMenu_mc z pierwszej klatki warstwy menu tween. Musisz zaznaczyć klon,
  a nie klatkę, aby dostać się do właściwości jasności. Wybierz opcję Brightness z rozwijanej listy
  Color z inspektora Properties. Zmień wartość na 85%. Zaznacz productsMenu_mc z klatki 12.
  i upewnij się, iż jasność jest nadal ustawiona na 0%. Przeciągnij znacznik odtwarzania,
  aby zobaczyć animację. Przyjrzyj się dokładnie rodzajowi uzyskanej animacji.


            Powinieneś stosować animację jasność zamiast animacji przezroczystości wszędzie tam, gdzie jest to
            możliwe, ponieważ animacja przezroczystości, szczególne nad złożonymi bitmapami, znacznie bardziej
            obciąża procesor niż animacja jasności. Po prostu Flash musi wykonać w tym pierwszym przypad-
            ku znacznie więcej obliczeń niż dla animacji jasności.




6. Powtórz kroki od 2. do 5. dla dwóch pozostałych menu z pliku FLA. Sprawdź animacje,
  przeciągając znacznik odtwarzania listwy czasowej.
  Powtórz kroki od 2. do 5. dla dwóch pozostałych menu dokumentu, aby wszystkie menu
  posiadały stosowne animacje. Po dodaniu animacji dla każdego z menu, użyj znacznika
  odtwarzania, aby sprawdzić poprawność działania animacji. Możliwe jest także naciśnięcie
  klawisza Enter do sprawdzenia animacji. W tym przypadku animacja będzie odtwarzania
  w środowisku autorskim aż do osiągnięcia końca listwy czasowej.
7. Powróć na główną scenę. Wyczyść bibliotekę i zapisz dokument FLA.

  Kliknij łącze Scene 1, aby powrócić do głównej listwy czasowej. Wyczyść bibliotekę, umieszczając
  symbole productsMenu_mc, companyMenu_mc i contactMenu_mc w bibliotece. Zapisz zmiany
  dokonane w pliku FLA.



                                                                                                  LEKCJA 5.      137
                                                                                           Tworzenie animacji
Gdy stosuje się automatyczną animację ruchu, istnieje możliwość określenia kierunku i stopnia obrotu
                    zaznaczonego symbolu. Istnieją cztery opcje obrotu: None (brak), Auto (automatyczny), CW (zgodnie
                    z ruchem wskazówek zegara), CCW (przeciwnie do ruchu wskazówek zegara). Jeżeli wybrałeś opcję
                    Auto, obrót przeprowadzany jest w tym kierunku, który wymaga najmniejszego kąta. Dwie ostat-
                    nie opcje obracają obiekt w zadanym kierunku podaną liczbę razy.



      Animacja poziomów przezroczystości i wielkości
      Zmiana przezroczystości klonu nie różni się zbytnio od przesuwania klonu na scenie. W zasadzie
      wykonuje się ją identycznie jak zmianę jasności (patrz poprzednie ćwiczenie). W obu przypadkach
      potrzebny jest ciąg klatek z automatyczną animacją, dla których można zastosować przejście. Jak
      już wcześniej wspominałam, wartość alpha odpowiada kryciu (przezroczystości) obiektu. Jeżeli war-
      tość alpha jest ustawiona na 0, obiekt nie jest widoczny na ekranie. Jeżeli wartość alpha jest ustawio-
      na na 100%, obiekt jest nieprzezroczysty.

      W tym ćwiczeniu zastosujemy automatyczną animację ruchu, aby uzyskać efekt przyciemniania
      poświaty animowanej za logo, a także efekt zmiany rozmiaru. Nadal pracuj na pliku bookstore9.fla
      z poprzedniego ćwiczenia.
       1. Zaznacz symbol glow_gr i skonwertuj go do klipu filmowego o nazwie bookglow_mc.
         Zmień nazwę warstwy Layer 1 na glow animation.
         Upewnij się, iż znajdujesz się na głównej scenie, klikając łącze Scene 1 na pasku edycji.
         Znajdź klon symbolu glow_gr wewnątrz symbolu logo_mc. Zaznacz go i naciśnij klawisz F8,
         aby skonwertować go do klipu filmowego o nazwie bookglow_mc. Musisz zmienić symbol
         graficzny na klip filmowy, ponieważ animacja ma być stale odtwarzana na scenie. Upewnij
         się, iż warstwy pageTurn i logo są zablokowane, aby móc bez przeszkód zaznaczyć klon glow_gr.
         Dwukrotnie kliknij utworzony klip filmowy bookglow_mc i zmień nazwę domyślnej warstwy
         Layer 1 na glow animation.
       2. Utwórz klatkę kluczową w klatce 35. i 70. na warstwie glow animation.

         Zaznacz klatkę 35. warstwy glow animation i dodaj nową klatkę kluczową. Spowoduje to
         skopiowanie zawartości klatki 1. do nowej klatki kluczowego.
         Podobnie postąp w przypadku klatki 70. W dalszej części ćwiczenia zmodyfikujemy
         przezroczystość i rozmiar klonu symbolu.
       3. Zmień rozmiar glow_gr, używając narzędzia Free Transform.

         Zaznacz ujęcie 35. warstwy glow animation. Włącz narzędzie Free Transform z przybornika
         i przeciągnij jeden z uchwytów narożnikowych do środka symbolu, aby zmniejszyć klon.
         Aby zachować odpowiednie skalowanie, w trakcie przeciągania przytrzymaj klawisz Shift.
         Tak zmień rozmiar klonu, aby ukrył się on za grafiką logo (patrz rysunek z punktu 4.).
       4. Zmień przezroczystość klonu glow_gr, używając inspektora Properties i automatycznej
         animacji ruchu.


138    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
Zmieniłeś rozmiar grafiki w klatce 35. Teraz zmień przezroczystość klonu. Zaznacz klon
  w klatce 35., używając narzędzia Selection. Wybierz opcję Alpha z rozwijanej listy Color
  z inspektora Properties. Przesuń suwak Alpha z wartości 100% na 80%.




  Jeżeli wydaje Ci się, iż ta wartość nie wygląda najlepiej, metodą prób i błędów ustal inną wartość.


             Pamiętaj o tym, iż modyfikacje wykonywane na scenie dla klonu w żaden sposób nie wpływają na
             symbol w bibliotece. Jeżeli teraz przeciągnąłbyś nowy klon symbolu na scenę, wyglądałby on tak samo,
             jak klon glow_gr sprzed modyfikacji.


5. Dodaj automatyczną animację ruchu, aby skalować grafikę, a następnie przeciągnij znacznik
  odtwarzania po listwie czasowej.




                                                                                                     LEKCJA 5.      139
                                                                                              Tworzenie animacji
Kliknij dowolną kratkę od 1. do 35. i otwórz panel inspektora właściwości. Zmień opcję
         z rozwijanej listy Tween z None na Motion. Podobnie postąp dla klatek w przedziale od 35.
         do 70. Klip filmowy powinien teraz skalować poświatę i bardziej ją tonować przed powrotem
         do oryginalnego kształtu. Można przetestować poszczególne klipy filmowe, zaznaczając
         pierwszą klatkę klipu i wybierając polecenie Control/Play z głównego menu. W ten sposób
         nie trzeba eksportować całego filmu SWF, aby sprawdzić jeden klip filmowy.

       6. Przenieś klip filmowy bookglow_mc do folderu movie clips w bibliotece. Zapisz dokument FLA
         przed przejściem do następnego ćwiczenia.



      Animacja przycisku klipu filmowego
      W lekcji 4. utworzyliśmy dwa przyciski klipów filmowych: jeden dla spisu treści i jeden dla przykła-
      dowego rozdziału. W tym ćwiczeniu zamierzamy dodać animację do tych przycisków, aby wypełnie-
      nie posiadało jaśniejszy kolor, gdy odwiedzający stronę najedzie kursorem na przycisk (rozjaśnienie
      będzie animowane). Przyciski klipów filmowych wykorzystają animację rozjaśnienia w podobny
      sposób, jak wcześniejsze animacje menu. Przycisk będzie animowany wtedy, gdy użytkownik umieści
      kursor nad przyciskiem, oraz wtedy, gdy zsunie kursor myszy z przycisku. Przycisk klipu filmowe-
      go posiada specjalne etykiety klatek, więc Flash wie, które klatek odpowiadają danym stanom przyci-
      sku. W tym przykładzie wykorzystamy etykiety _over i _down odpowiadające stanom Over i Down
      rzeczywistych przycisków.

      Nadaj pracujemy z plikiem bookstore9.fla.
       1. Znajdź symbol samplechapter_mc w bibliotece i kliknij go dwukrotnie.

         Po dwukrotnym kliknięciu symbolu zostanie on otwarty w trybie edycji. Odblokuj warstwę
         fill i upewnij się, iż pozostałe warstwy są odblokowane przed przejściem do następnego
         kroku, gdyż w ten sposób uniemożliwi się modyfikację warstw text i stroke.

       2. Zaznacz warstwę fill i wstaw klatkę kluczową dla etykiety _over (klatka 14.), a także w ostatniej
         klatce klipu filmowego (klatka 25.).




         Kliknij, aby zaznaczyć klatkę i naciśnij klawisz F6, by wstawić klatkę kluczową. Powtórz ten
         krok dla klatek 14. i 25. Będą istniały dwie animacje: jedna dla stanu _over i jedna dla stanu
         _down. Chcemy utworzyć animację dla stanu _over jako odwróconą animację dla stanu
         _down. Z tego powodu początek animacji _over będzie taki sam, jak koniec animacji _down.



140    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
3. Dodaj animację jasności do klonu fill_gr i wstaw klatkę kluczową w klatce 15.

   Zaznacz klatkę kluczową w etykiecie _over i rozwiń panel inspektora Properties. Wybierz opcję
   Motion z menu Tween, aby wstawić automatyczną animację ruchu. Zaznacz klon fill_gr z ujęcia
   14. i wybierz opcję Brightness z listy Color z inspektora Properties. Zmień wartość na 85%.
   Gdy skończysz, zaznacz klatkę 15. i wstaw klatkę kluczową (klawisz F6). Zmień opcję z listy Tween
   na Motion. Przeciągnij znacznik odtwarzania, aby sprawdzić poprawność wykonanej animacji.




              Jeśli w tym momencie przetestujesz przycisk, nie będziesz widział animacji rozjaśniania. Jest to
              spowodowane tym, że przycisk klipu filmowego musi zawierać specjalny kod ActionScript, aby był
              traktowany przez Flasha jako przycisk. Kod ten dodamy w kolejnej lekcji.


 4. Powtórz kroki od 1. do 3. dla klonu toc_mc.

   Klip filmowy toc_mc także powinien znajdować się w bibliotece. Kliknij go dwukrotnie,
   aby wejść do trybu jego edycji. Wykonaj te same kroki, co w przypadku symbolu
   samplechapter_mc. Chcemy, by oba przyciski były animowane w ten sam sposób.
 5. Zablokuj warstwę fill na listwie czasowej, zapisz zmiany i powróć do głównej listwy czasowej.



Tworzenie automatycznej animacji kształtu
Automatyczna animacja kształtu umożliwia stworzenie efektu zmiany kształtu odbywającej się
w określonej liczbie klatek. Tego rodzaju animacja zapewnia możliwość zmiany długość linii, wy-
ginanie linii itp. Innymi słowy, zapewnia modyfikację kształtu, co pozwala uzyskać bardzo intere-
sujące efekty. Zamiast ręcznie tworzyć wszystkie kształty w kolejnych klatkach animacji, wystarczy
tylko ustalić początek i koniec animacji, a Flash wykona za nas odpowiednie obliczenia. Na jednej
warstwie może się znajdować jedna lub więcej animacji kształtu, choć w pewnych sytuacjach poszcze-
gólne kształty mogą sobie nawzajem przeszkadzać. Kreowane efekty mogą być zarówno bardzo
proste, jak i bardzo złożone.


              Automatyczna animacja kształtu może być stosowana dla surowej grafiki wektorowej (oznaczanej
              przez wzorzec krzyżykowy po jej zaznaczeniu) lub bitmap, dla których wcześniej wykonano polecenie
              Modify/Break Apart lub Trace Bitmap. Jest to bardzo elastyczny sposób animacji, ale by uzyskać
              pożądane efekty przy większych zmianach kształtu, trzeba stosować kształty pomocnicze.


                                                                                                    LEKCJA 5.     141
                                                                                             Tworzenie animacji
Automatyczna animacja kształtu często daje nieoczekiwane wyniki. Wynikają one przede wszyst-
      kim z tego, iż Flash dokonuje jak najprostszego przejścia między dwoma kształtami. Aby wskazać
      inny sposób przejścia, można zastosować kształty pomocnicze. Kształty te wskazują miejsca, przez które
      ma przejść punkt w trakcie swojej drogi od położenia początkowego do końcowego. Każdy kształt
      pomocniczy posiada oznaczenie literowe. Z tego powodu, jeśli kształt pomocniczy „a” jest umiesz-
      czony na początku animacji, animacja ta najpierw przejdzie do tego kształtu, a dopiero później do
      kształtu końcowego.

      Na przykład możesz mieć animację zamieniającą kształt kota w kształt psa. Jeżeli posiadasz trójkąt
      reprezentujący ucho kota z kształtem pomocniczym „a” znajdującym się na szczycie ucha kota,
      a taki sam kształt pomocniczy znajduje się na szczycie ucha psa, wtedy ucho kota od razu zamieni
      się w ucho psa bez żadnych pośrednich dróg.

      Istnieją dwa sposoby mieszania dla automatycznych animacji kształtu: rozkładowa (Distribute) i narożniko-
      wa (Angular). Pierwszy sposób mieszania tworzy płynne przejścia, które wydają się nieco nieregularne.
      Drugi sposób mieszania zachowuje narożniki i linie w trakcie przejścia. Mieszanie narożnikowe
      dostępne jest tylko dla kształtów z prostymi liniami i ostrymi narożnikami.

      W tym ćwiczeniu opracujemy subtelny efekt przewracania kartek książki znajdującej się w logo
      witryny. Nadal pracujemy z plikiem bookstore9.fla.
       1. Znajdź klon pageTurn_mc wewnątrz symbolu logo_mc. Kliknij go dwukrotnie, aby otworzyć go
         w trybie edycji. Włącz znaczne powiększenie strony, przynajmniej 800%.
         Utworzyłeś klip filmowy obracania strony w poprzedniej lekcji. Na razie klip ten po prostu
         zawiera jedną linię. Animacja obracania strony składa się z dwóch części. Pierwsza część
         polega na utworzeniu automatycznej animacji kształtu. Właśnie tym zagadnieniem
         zajmiemy się w niniejszym ćwiczeniu.
       2. Zmień nazwę warstwy Layer 1 na animation. Dodaj klatkę kluczową w klatce 10., a następnie
         zmodyfikuj nową klatkę kluczową.
         Po zmianie nazwy warstwy na animation i dodaniu klatki kluczowej możesz zmodyfikować
         klatkę 10. Zaznacz tę klatkę i upewnij się, iż linia nie jest zaznaczona. Przesuń kursor myszy
         nad linię aż do pojawienia się kursora przedstawionego na rysunku poniżej.




         Kliknij i przeciągnij linię, aby ją wygiąć. Wygnij linię w sposób przedstawiony na pierwszym
         rysunku na następnej stronie.

142    MACROMEDIA FLASH MX 2004
       Oficjalny podręcznik
Przeciągnij mysz nad górną krawędź linii aż do pojawienia się kursora przedstawionego
   na rysunku poniżej. Kliknij i przeciągnij koniec linii lekko na prawo (patrz rysunek).




 3. Wstaw automatyczną animację kształtu, używając inspektora Properties, a następnie
   sprawdź animację.
   Zaznacz pierwsze ujęcie i otwórz panel inspektora Properties. Wybierz opcję Shape z rozwijanej
   listy Tween. Pojawi się zielona strzałka na klatkach z warstwy animation. Oznacza to, iż w tych
   klatkach występuje animacja kształtu.
   Kliknij i przeciągnij znacznik odtwarzania między klatkami, aby podejrzeć animację dodaną
   do logo. Dolny punkt krzywej powinien pozostać w tym samym miejscu (na łączeniu książki).
   Animację dokończymy w następnym ćwiczeniu.
 4. Gdy zakończysz tworzenie automatycznej animacji kształtu, zapisz zmiany dokonane
   w dokumencie, wybierając polecenie File/Save.

W następnym ćwiczeniu dodamy animację „klatka po klatce”, która dokończy efekt przewracania
strony.




                                                                                           LEKCJA 5.     143
                                                                                    Tworzenie animacji

More Related Content

What's hot

Flash CS3 Professional PL. Klatka po klatce
Flash CS3 Professional PL. Klatka po klatceFlash CS3 Professional PL. Klatka po klatce
Flash CS3 Professional PL. Klatka po klatceWydawnictwo Helion
 
Tworzenie stron WWW. Kurs. Wydanie II
Tworzenie stron WWW. Kurs. Wydanie IITworzenie stron WWW. Kurs. Wydanie II
Tworzenie stron WWW. Kurs. Wydanie IIWydawnictwo Helion
 
Macromedia Dreamweaver 8. Oficjalny podręcznik
Macromedia Dreamweaver 8. Oficjalny podręcznikMacromedia Dreamweaver 8. Oficjalny podręcznik
Macromedia Dreamweaver 8. Oficjalny podręcznikWydawnictwo Helion
 
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBA
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBAMS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBA
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBAWydawnictwo Helion
 
Tworzenie stron WWW w praktyce. Wydanie II
Tworzenie stron WWW w praktyce. Wydanie IITworzenie stron WWW w praktyce. Wydanie II
Tworzenie stron WWW w praktyce. Wydanie IIWydawnictwo Helion
 
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalisty
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalistyPHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalisty
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalistyWydawnictwo Helion
 
Macromedia Flash 8 ActionScript. Oficjalny podręcznik
Macromedia Flash 8 ActionScript. Oficjalny podręcznikMacromedia Flash 8 ActionScript. Oficjalny podręcznik
Macromedia Flash 8 ActionScript. Oficjalny podręcznikWydawnictwo Helion
 
Flash MX. Vademecum profesjonalisty
Flash MX. Vademecum profesjonalistyFlash MX. Vademecum profesjonalisty
Flash MX. Vademecum profesjonalistyWydawnictwo Helion
 
Tworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceTworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceWydawnictwo Helion
 
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalisty
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalistyExcel 2003 PL. Programowanie w VBA. Vademecum profesjonalisty
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalistyWydawnictwo Helion
 
Macromedia Studio 8. Oficjalny podręcznik
Macromedia Studio 8. Oficjalny podręcznikMacromedia Studio 8. Oficjalny podręcznik
Macromedia Studio 8. Oficjalny podręcznikWydawnictwo Helion
 

What's hot (20)

Flash CS3 Professional PL. Klatka po klatce
Flash CS3 Professional PL. Klatka po klatceFlash CS3 Professional PL. Klatka po klatce
Flash CS3 Professional PL. Klatka po klatce
 
Flash MX 2004. Tworzenie gier
Flash MX 2004. Tworzenie gierFlash MX 2004. Tworzenie gier
Flash MX 2004. Tworzenie gier
 
Dreamweaver MX
Dreamweaver MXDreamweaver MX
Dreamweaver MX
 
Tworzenie stron WWW. Kurs. Wydanie II
Tworzenie stron WWW. Kurs. Wydanie IITworzenie stron WWW. Kurs. Wydanie II
Tworzenie stron WWW. Kurs. Wydanie II
 
Macromedia Dreamweaver 8. Oficjalny podręcznik
Macromedia Dreamweaver 8. Oficjalny podręcznikMacromedia Dreamweaver 8. Oficjalny podręcznik
Macromedia Dreamweaver 8. Oficjalny podręcznik
 
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBA
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBAMS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBA
MS Office 2000 i 2002/XP. Tworzenie własnych aplikacji w VBA
 
Tworzenie stron WWW. Kurs
Tworzenie stron WWW. KursTworzenie stron WWW. Kurs
Tworzenie stron WWW. Kurs
 
ABC języka HTML i XHTML
ABC języka HTML i XHTMLABC języka HTML i XHTML
ABC języka HTML i XHTML
 
JavaScript i DHTML. Receptury
JavaScript i DHTML. RecepturyJavaScript i DHTML. Receptury
JavaScript i DHTML. Receptury
 
Tworzenie stron WWW w praktyce. Wydanie II
Tworzenie stron WWW w praktyce. Wydanie IITworzenie stron WWW w praktyce. Wydanie II
Tworzenie stron WWW w praktyce. Wydanie II
 
Dreamweaver MX. Ćwiczenia
Dreamweaver MX. ĆwiczeniaDreamweaver MX. Ćwiczenia
Dreamweaver MX. Ćwiczenia
 
Po prostu FrontPage 2003 PL
Po prostu FrontPage 2003 PLPo prostu FrontPage 2003 PL
Po prostu FrontPage 2003 PL
 
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalisty
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalistyPHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalisty
PHP i MySQL. Tworzenie stron WWW. Wydanie drugie. Vademecum profesjonalisty
 
Macromedia Flash 8 ActionScript. Oficjalny podręcznik
Macromedia Flash 8 ActionScript. Oficjalny podręcznikMacromedia Flash 8 ActionScript. Oficjalny podręcznik
Macromedia Flash 8 ActionScript. Oficjalny podręcznik
 
Flash MX. Vademecum profesjonalisty
Flash MX. Vademecum profesjonalistyFlash MX. Vademecum profesjonalisty
Flash MX. Vademecum profesjonalisty
 
Tworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceTworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyce
 
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalisty
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalistyExcel 2003 PL. Programowanie w VBA. Vademecum profesjonalisty
Excel 2003 PL. Programowanie w VBA. Vademecum profesjonalisty
 
HTML i XHTML dla każdego
HTML i XHTML dla każdegoHTML i XHTML dla każdego
HTML i XHTML dla każdego
 
Director MX. Szybki start
Director MX. Szybki startDirector MX. Szybki start
Director MX. Szybki start
 
Macromedia Studio 8. Oficjalny podręcznik
Macromedia Studio 8. Oficjalny podręcznikMacromedia Studio 8. Oficjalny podręcznik
Macromedia Studio 8. Oficjalny podręcznik
 

Viewers also liked

Aplikacje w Delphi. Przykłady. Wydanie II
Aplikacje w Delphi. Przykłady. Wydanie IIAplikacje w Delphi. Przykłady. Wydanie II
Aplikacje w Delphi. Przykłady. Wydanie IIWydawnictwo Helion
 
Teoria sygnałów. Wstęp. Wydanie II
Teoria sygnałów. Wstęp. Wydanie IITeoria sygnałów. Wstęp. Wydanie II
Teoria sygnałów. Wstęp. Wydanie IIWydawnictwo Helion
 
MS Office 2003 PL w biznesie. Tom I i II
MS Office 2003 PL w biznesie. Tom I i IIMS Office 2003 PL w biznesie. Tom I i II
MS Office 2003 PL w biznesie. Tom I i IIWydawnictwo Helion
 
Bazy danych SQL. Teoria i praktyka
Bazy danych SQL. Teoria i praktykaBazy danych SQL. Teoria i praktyka
Bazy danych SQL. Teoria i praktykaWydawnictwo Helion
 
Photoshop CS/CS PL. 50 praktycznych projektów
Photoshop CS/CS PL. 50 praktycznych projektówPhotoshop CS/CS PL. 50 praktycznych projektów
Photoshop CS/CS PL. 50 praktycznych projektówWydawnictwo Helion
 
Excel w nauce i technice. Receptury
Excel w nauce i technice. RecepturyExcel w nauce i technice. Receptury
Excel w nauce i technice. RecepturyWydawnictwo Helion
 
Wstęp do programowania w języku C#
Wstęp do programowania w języku C#Wstęp do programowania w języku C#
Wstęp do programowania w języku C#Wydawnictwo Helion
 

Viewers also liked (11)

Aplikacje w Delphi. Przykłady. Wydanie II
Aplikacje w Delphi. Przykłady. Wydanie IIAplikacje w Delphi. Przykłady. Wydanie II
Aplikacje w Delphi. Przykłady. Wydanie II
 
SQL. Receptury
SQL. RecepturySQL. Receptury
SQL. Receptury
 
Teoria sygnałów. Wstęp. Wydanie II
Teoria sygnałów. Wstęp. Wydanie IITeoria sygnałów. Wstęp. Wydanie II
Teoria sygnałów. Wstęp. Wydanie II
 
MS Office 2003 PL w biznesie. Tom I i II
MS Office 2003 PL w biznesie. Tom I i IIMS Office 2003 PL w biznesie. Tom I i II
MS Office 2003 PL w biznesie. Tom I i II
 
Bazy danych SQL. Teoria i praktyka
Bazy danych SQL. Teoria i praktykaBazy danych SQL. Teoria i praktyka
Bazy danych SQL. Teoria i praktyka
 
Photoshop CS/CS PL. 50 praktycznych projektów
Photoshop CS/CS PL. 50 praktycznych projektówPhotoshop CS/CS PL. 50 praktycznych projektów
Photoshop CS/CS PL. 50 praktycznych projektów
 
SQL. Receptury
SQL. RecepturySQL. Receptury
SQL. Receptury
 
Excel w nauce i technice. Receptury
Excel w nauce i technice. RecepturyExcel w nauce i technice. Receptury
Excel w nauce i technice. Receptury
 
Fedora Core 2 dla każdego
Fedora Core 2 dla każdegoFedora Core 2 dla każdego
Fedora Core 2 dla każdego
 
Python. Od podstaw
Python. Od podstawPython. Od podstaw
Python. Od podstaw
 
Wstęp do programowania w języku C#
Wstęp do programowania w języku C#Wstęp do programowania w języku C#
Wstęp do programowania w języku C#
 

Similar to Macromedia Flash MX 2004. Oficjalny podręcznik

Flash MX 2004 ActionScript. Ćwiczenia praktyczne
Flash MX 2004 ActionScript. Ćwiczenia praktyczneFlash MX 2004 ActionScript. Ćwiczenia praktyczne
Flash MX 2004 ActionScript. Ćwiczenia praktyczneWydawnictwo Helion
 
Macromedia Fireworks 8. Oficjalny podręcznik
Macromedia Fireworks 8. Oficjalny podręcznikMacromedia Fireworks 8. Oficjalny podręcznik
Macromedia Fireworks 8. Oficjalny podręcznikWydawnictwo Helion
 
Flash 8. Techniki zaawansowane. Klatka po klatce
Flash 8. Techniki zaawansowane. Klatka po klatceFlash 8. Techniki zaawansowane. Klatka po klatce
Flash 8. Techniki zaawansowane. Klatka po klatceWydawnictwo Helion
 
101 praktycznych skryptów na stronę WWW. Wydanie II
101 praktycznych skryptów na stronę WWW. Wydanie II101 praktycznych skryptów na stronę WWW. Wydanie II
101 praktycznych skryptów na stronę WWW. Wydanie IIWydawnictwo Helion
 
Flash MX. Ćwiczenia zaawansowane
Flash MX. Ćwiczenia zaawansowaneFlash MX. Ćwiczenia zaawansowane
Flash MX. Ćwiczenia zaawansowaneWydawnictwo Helion
 
Microsoft Access. Podręcznik administratora
Microsoft Access. Podręcznik administratoraMicrosoft Access. Podręcznik administratora
Microsoft Access. Podręcznik administratoraWydawnictwo Helion
 
PHP. 101 praktycznych skryptów. Wydanie II
PHP. 101 praktycznych skryptów. Wydanie IIPHP. 101 praktycznych skryptów. Wydanie II
PHP. 101 praktycznych skryptów. Wydanie IIWydawnictwo Helion
 
ActionScript. Przewodnik encyklopedyczny
ActionScript. Przewodnik encyklopedycznyActionScript. Przewodnik encyklopedyczny
ActionScript. Przewodnik encyklopedycznyWydawnictwo Helion
 
JavaScript dla każdego. Wydanie IV
JavaScript dla każdego. Wydanie IVJavaScript dla każdego. Wydanie IV
JavaScript dla każdego. Wydanie IVWydawnictwo Helion
 
PHP5. Zaawansowane programowanie
PHP5. Zaawansowane programowaniePHP5. Zaawansowane programowanie
PHP5. Zaawansowane programowanieWydawnictwo Helion
 
Visual Basic 2005. Zapiski programisty
Visual Basic 2005. Zapiski programistyVisual Basic 2005. Zapiski programisty
Visual Basic 2005. Zapiski programistyWydawnictwo Helion
 
Visual C# 2005. Zapiski programisty
Visual C# 2005. Zapiski programistyVisual C# 2005. Zapiski programisty
Visual C# 2005. Zapiski programistyWydawnictwo Helion
 

Similar to Macromedia Flash MX 2004. Oficjalny podręcznik (20)

Flash MX 2004. Biblia
Flash MX 2004. BibliaFlash MX 2004. Biblia
Flash MX 2004. Biblia
 
Flash MX 2004 ActionScript. Ćwiczenia praktyczne
Flash MX 2004 ActionScript. Ćwiczenia praktyczneFlash MX 2004 ActionScript. Ćwiczenia praktyczne
Flash MX 2004 ActionScript. Ćwiczenia praktyczne
 
Macromedia Fireworks 8. Oficjalny podręcznik
Macromedia Fireworks 8. Oficjalny podręcznikMacromedia Fireworks 8. Oficjalny podręcznik
Macromedia Fireworks 8. Oficjalny podręcznik
 
Flash 8. Techniki zaawansowane. Klatka po klatce
Flash 8. Techniki zaawansowane. Klatka po klatceFlash 8. Techniki zaawansowane. Klatka po klatce
Flash 8. Techniki zaawansowane. Klatka po klatce
 
ActionScript 2.0. Od podstaw
ActionScript 2.0. Od podstawActionScript 2.0. Od podstaw
ActionScript 2.0. Od podstaw
 
Flash MX. Programowanie
Flash MX. ProgramowanieFlash MX. Programowanie
Flash MX. Programowanie
 
101 praktycznych skryptów na stronę WWW. Wydanie II
101 praktycznych skryptów na stronę WWW. Wydanie II101 praktycznych skryptów na stronę WWW. Wydanie II
101 praktycznych skryptów na stronę WWW. Wydanie II
 
Flash MX. Ćwiczenia zaawansowane
Flash MX. Ćwiczenia zaawansowaneFlash MX. Ćwiczenia zaawansowane
Flash MX. Ćwiczenia zaawansowane
 
Microsoft Access. Podręcznik administratora
Microsoft Access. Podręcznik administratoraMicrosoft Access. Podręcznik administratora
Microsoft Access. Podręcznik administratora
 
ABC Delphi 2006
ABC Delphi 2006ABC Delphi 2006
ABC Delphi 2006
 
Flash i PHP5. Podstawy
Flash i PHP5. PodstawyFlash i PHP5. Podstawy
Flash i PHP5. Podstawy
 
3ds Max 8. Biblia
3ds Max 8. Biblia3ds Max 8. Biblia
3ds Max 8. Biblia
 
PHP. 101 praktycznych skryptów. Wydanie II
PHP. 101 praktycznych skryptów. Wydanie IIPHP. 101 praktycznych skryptów. Wydanie II
PHP. 101 praktycznych skryptów. Wydanie II
 
AutoCAD 2004
AutoCAD 2004AutoCAD 2004
AutoCAD 2004
 
ActionScript. Przewodnik encyklopedyczny
ActionScript. Przewodnik encyklopedycznyActionScript. Przewodnik encyklopedyczny
ActionScript. Przewodnik encyklopedyczny
 
JavaScript dla każdego. Wydanie IV
JavaScript dla każdego. Wydanie IVJavaScript dla każdego. Wydanie IV
JavaScript dla każdego. Wydanie IV
 
PHP5. Zaawansowane programowanie
PHP5. Zaawansowane programowaniePHP5. Zaawansowane programowanie
PHP5. Zaawansowane programowanie
 
Visual Basic 2005. Zapiski programisty
Visual Basic 2005. Zapiski programistyVisual Basic 2005. Zapiski programisty
Visual Basic 2005. Zapiski programisty
 
Visual C# 2005. Zapiski programisty
Visual C# 2005. Zapiski programistyVisual C# 2005. Zapiski programisty
Visual C# 2005. Zapiski programisty
 
Pajączek 5 NxG
Pajączek  5 NxGPajączek  5 NxG
Pajączek 5 NxG
 

More from Wydawnictwo Helion

Tworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyTworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyWydawnictwo Helion
 
Blog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikBlog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikWydawnictwo Helion
 
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktycznePozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczneWydawnictwo Helion
 
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesieE-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesieWydawnictwo Helion
 
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsMicrosoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsWydawnictwo Helion
 
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IICo potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IIWydawnictwo Helion
 
Makrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuMakrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuWydawnictwo Helion
 
Java. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIJava. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIWydawnictwo Helion
 
Ajax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningAjax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningWydawnictwo Helion
 
PowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykPowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykWydawnictwo Helion
 
Serwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaSerwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaWydawnictwo Helion
 

More from Wydawnictwo Helion (20)

Tworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyTworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. Projekty
 
Blog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikBlog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnik
 
Access w biurze i nie tylko
Access w biurze i nie tylkoAccess w biurze i nie tylko
Access w biurze i nie tylko
 
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktycznePozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
 
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesieE-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image&#39;u w biznesie
 
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsMicrosoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
 
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IICo potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
 
Makrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuMakrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółu
 
Windows PowerShell. Podstawy
Windows PowerShell. PodstawyWindows PowerShell. Podstawy
Windows PowerShell. Podstawy
 
Java. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIJava. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie II
 
JavaScript. Pierwsze starcie
JavaScript. Pierwsze starcieJavaScript. Pierwsze starcie
JavaScript. Pierwsze starcie
 
Ajax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningAjax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny trening
 
PowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykPowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktyk
 
Excel 2007 PL. Seria praktyk
Excel 2007 PL. Seria praktykExcel 2007 PL. Seria praktyk
Excel 2007 PL. Seria praktyk
 
Access 2007 PL. Seria praktyk
Access 2007 PL. Seria praktykAccess 2007 PL. Seria praktyk
Access 2007 PL. Seria praktyk
 
Word 2007 PL. Seria praktyk
Word 2007 PL. Seria praktykWord 2007 PL. Seria praktyk
Word 2007 PL. Seria praktyk
 
Serwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaSerwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacja
 
AutoCAD 2008 i 2008 PL
AutoCAD 2008 i 2008 PLAutoCAD 2008 i 2008 PL
AutoCAD 2008 i 2008 PL
 
Bazy danych. Pierwsze starcie
Bazy danych. Pierwsze starcieBazy danych. Pierwsze starcie
Bazy danych. Pierwsze starcie
 
Inventor. Pierwsze kroki
Inventor. Pierwsze krokiInventor. Pierwsze kroki
Inventor. Pierwsze kroki
 

Macromedia Flash MX 2004. Oficjalny podręcznik

  • 1. IDZ DO PRZYK£ADOWY ROZDZIA£ SPIS TRE CI Macromedia Flash MX 2004. Oficjalny podrêcznik KATALOG KSI¥¯EK Autor: Jen Dehaan T³umaczenie: Rafa³ Joñca (rozdz. 1 – 7, 13, dod. A – C), KATALOG ONLINE Konrad Mantorski (rozdz. 8 – 12) ISBN: 83-7361-534-2 ZAMÓW DRUKOWANY KATALOG Tytu³ orygina³u: Macromedia Flash MX 2004: Training from the Source Format: B5, stron: 416 TWÓJ KOSZYK DODAJ DO KOSZYKA Macromedia Flash MX 2004 i Macromedia Flash MX 2004 Professional to aplikacje s³u¿¹ce do tworzenia publikacji multimedialnych opartych na grafice wektorowej. Mnogo æ narzêdzi graficznych, mo¿liwo ci tworzenia animacji, stosowania plików CENNIK I INFORMACJE graficznych i d wiêkowych w ró¿nych formatach oraz rozbudowany obiektowy jêzyk programowania ActionScript daj¹ projektantom nieograniczon¹ swobodê twórcz¹. ZAMÓW INFORMACJE Za pomoc¹ Flasha mo¿na stworzyæ zarówno proste przyciski nawigacyjne, jak O NOWO CIACH i interaktywn¹ witrynê WWW korzystaj¹c¹ z baz danych i jêzyka XML. „Macromedia Flash MX 2004. Oficjalny podrêcznik” to zbiór æwiczeñ i przyk³adów ZAMÓW CENNIK przygotowanych przy wspó³pracy z firm¹ Macromedia — producentem Flasha. Dziêki przyk³adom przedstawianym w kolejnych lekcjach poznasz poszczególne funkcje i narzêdzia aplikacji Flash MX 2004. Dowiesz siê miêdzy innymi, jak tworzyæ przyciski CZYTELNIA i ³¹cza, rysowaæ i animowaæ, formatowaæ tekst, wczytywaæ zewnêtrzne dane do aplikacji i pisaæ skrypty ActionScript. FRAGMENTY KSI¥¯EK ONLINE • Podstawy korzystania z Flasha • Narzêdzia graficzne • Wprowadzanie i formatowanie tekstu • Tworzenie i edycja symboli • Animacja automatyczna i poklatkowa • Elementy interaktywne • Korzystanie z plików d wiêkowych i cyfrowego wideo • Stosowanie komponentów do tworzenia interaktywnych formularzy • Wczytywanie danych z plików • Podstawy jêzyka ActionScript • Publikowanie gotowej prezentacji Wydawnictwo Helion Poznaj mo¿liwo ci Flasha MX 2004 w praktyce, ul. Chopina 6 44-100 Gliwice wykorzystuj¹c podrêcznik polecany przez firmê Macromedia. tel. (32)230-98-63 e-mail: helion@helion.pl
  • 2. Spis treści O Autorce ................................................................................................................................................................................................. 9 Wprowadzenie ..................................................................................................................................................................................... 11 Lekcja 1. Podstawy programu...................................................................................................................................................... 17 Wprowadzenie do programu Macromedia Flash MX 2004................................................................................. 18 Przestrzeń robocza Flasha .........................................................................................................................................20 Tworzenie pierwszego dokumentu ..........................................................................................................................22 Korzystanie z paneli................................................................................................................................................... 26 Listwa czasowa i klatki............................................................................................................................................... 30 Warstwy ....................................................................................................................................................................... 34 Modyfikacja ustawień programu ............................................................................................................................. 38 Testowanie pliku FLA................................................................................................................................................ 41 Szukanie pomocy ....................................................................................................................................................... 43 Projekt.......................................................................................................................................................................... 45 Lekcja 2. Tworzenie grafiki............................................................................................................................................................ 47 Przybornik...................................................................................................................................................................49 Tworzenie grafiki przy użyciu narzędzi rysowania ............................................................................................... 53 Korzystanie z prowadnic, siatek, współrzędnych i przyciągania......................................................................... 56 Tworzenie nowej grafiki ............................................................................................................................................ 57 Tworzenie i korzystanie z masek.............................................................................................................................. 62 Dodawanie pociągnięć pędzla (konturów) ............................................................................................................. 63 Biblioteka .................................................................................................................................................................... 64 Import i optymalizacja grafiki ................................................................................................................................. 67 Import grafiki wektorowej ........................................................................................................................................70 Wypełnienia i gradienty ............................................................................................................................................ 73 Modyfikacja grafiki....................................................................................................................................................77 Lekcja 3. Korzystanie z tekstu ..................................................................................................................................................... 81 Narzędzie Text ............................................................................................................................................................82 Dodawanie tekstu do dokumentu ...........................................................................................................................84 Korzystanie z osadzonych czcionek ........................................................................................................................90
  • 3. Właściwości czcionek................................................................................................................................................. 91 Dodawanie efektów listwy czasowej do pola tekstowego...................................................................................... 96 Sprawdzanie pisowni dokumentu ...........................................................................................................................98 Korzystanie z komponentów tekstowych ...............................................................................................................99 Istota działania dynamicznych pól tekstowych ................................................................................................... 100 Lekcja 4. Tworzenie i edycja symboli...................................................................................................................................101 Omówienie symboli................................................................................................................................................. 102 Symbole graficzne .................................................................................................................................................... 106 Tworzenie przycisków ............................................................................................................................................. 107 Rozmieszczanie przycisków na scenie....................................................................................................................110 Tworzenie przycisków tekstowych..........................................................................................................................112 Tworzenie niewidzialnego przycisku .....................................................................................................................113 Tworzenie klipów filmowych i korzystanie z nich ...............................................................................................117 Tworzenie menu....................................................................................................................................................... 120 Tworzenie przycisków klipów filmowych ............................................................................................................ 123 Duplikowanie symboli i dodawanie ich do sceny ............................................................................................... 126 Lekcja 5. Tworzenie animacji ....................................................................................................................................................129 Rodzaje animacji .......................................................................................................................................................131 Tworzenie automatycznej animacji ruchu ............................................................................................................131 Dodawanie automatycznej animacji ruchu.......................................................................................................... 135 Animacja poziomów przezroczystości i wielkości .............................................................................................. 138 Animacja przycisku klipu filmowego ................................................................................................................... 140 Tworzenie automatycznej animacji kształtu .........................................................................................................141 Tworzenie animacji „klatka po klatce” ................................................................................................................. 143 Animacja wzdłuż ścieżki ......................................................................................................................................... 147 Efekty listwy czasowej w animacji .......................................................................................................................... 153 Lekcja 6. Dodawanie prostej interaktywności..................................................................................................................157 Dodawanie interaktywności do dokumentów Flasha.............................................................................................. 159 Wprowadzenie do behawiorów .............................................................................................................................. 159 Wykorzystywanie behawiora do wczytania obrazu JPEG .................................................................................. 160 Wykorzystywanie behawiora do otwarcia strony WWW ........................................................................................ 163 Przeglądanie kodu behawiorów ............................................................................................................................. 165 Implementacja prostej interakcji z serwerem przy użyciu komponentu ......................................................... 166 Wprowadzenie do języka ActionScript ................................................................................................................. 169 Korzystanie z akcji sterujących odtwarzaniem listwy czasowej ......................................................................... 175 Tworzenie przycisku powrotu do klatki home .................................................................................................... 176 6 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 4. Usuwanie kursora ręki............................................................................................................................................. 178 Kończenie przycisku klipu filmowego.................................................................................................................. 179 Korzystanie z nawigatora skryptów i pinesek .......................................................................................................181 Lekcja 7. Dźwięk i wideo .............................................................................................................................................................185 Korzystanie z dźwięku i filmów wideo.................................................................................................................. 187 Dostarczanie mediów w Internecie........................................................................................................................ 189 Dodanie dźwięku do przycisku.............................................................................................................................. 189 Import dźwięku do dokumentu............................................................................................................................. 192 Dostosowanie dźwięku do własnych potrzeb....................................................................................................... 195 Import wideo do Flasha........................................................................................................................................... 197 Eksport do formatu FLV .........................................................................................................................................208 Lekcja 8. Ekrany ...............................................................................................................................................................................211 Ekrany — wprowadzenie ........................................................................................................................................ 213 Tworzenie nowej prezentacji ekranowej................................................................................................................ 214 Dodawanie do prezentacji dźwięku i wideo ......................................................................................................... 217 Sterowanie dźwiękiem ............................................................................................................................................. 221 Przemieszczanie się między ekranami...................................................................................................................223 Wstawianie efektów przejścia i maski....................................................................................................................224 Tworzenie przewodnika w programie Flash MX 2004........................................................................................226 Ładowanie przewodnika do witryny Tech Bookstore..............................................................................................234 Lekcja 9. Tworzenie formularzy za pomocą komponentów ......................................................................................237 Formularze i dane — wprowadzenie.....................................................................................................................238 Komponenty Flasha — wprowadzenie .................................................................................................................240 Tworzenie formularza zwrotnego..........................................................................................................................243 Korzystanie z komponentu Button.......................................................................................................................247 Tworzenie kwestionariusza .....................................................................................................................................250 Korzystanie z klasy FocusManager........................................................................................................................257 Lekcja 10. Zamieszczanie danych dynamicznych ..........................................................................................................261 Dane dynamiczne — wprowadzenie .....................................................................................................................262 Definiowanie usług internetowych w programie Flash MX Professional........................................................264 Wywoływanie usługi sieci WWW w programie Flash MX Professional ........................................................... 266 Tworzenie formularza zwrotnego w programie Flash MX 2004 .......................................................................270 Tworzenie kwestionariusza w programie Flash MX Professional .....................................................................273 Tworzenie kwestionariusza w programie Flash MX 2004 ..................................................................................276 Tworzenie strony książki rekomendowanej w programie Flash MX Professional..........................................278 Tworzenie strony książki rekomendowanej w programie Flash MX 2004.......................................................282 SPIS TREŚCI 7
  • 5. Lekcja 11. Podstawy ActionScript .........................................................................................................................................287 ActionScript 1.0 i ActionScript 2.0 — wprowadzenie ........................................................................................289 Ścisła kontrola typów i uzupełnianie kodu ..........................................................................................................290 Klasy, metody i właściwości ....................................................................................................................................293 Funkcje i instrukcje warunkowe.............................................................................................................................294 Zakres.........................................................................................................................................................................296 Klasa LoadVars .........................................................................................................................................................299 Tworzenie strony recenzji ....................................................................................................................................... 301 Korzystanie ze zdarzeń, uchwytów zdarzeń i sond.............................................................................................. 306 Formatowanie recenzji przy użyciu kaskadowych arkuszy stylów....................................................................309 Tworzenie stron katalogu.........................................................................................................................................311 Tworzenie głównej strony katalogu ....................................................................................................................... 316 Tworzenie strony wiadomości................................................................................................................................ 319 Tworzenie strony głównej ....................................................................................................................................... 321 Dodawanie animacji do menu ...............................................................................................................................324 Sterowanie przyciskami menu................................................................................................................................ 330 Lekcja 12. Optymalizacja zawartości ...................................................................................................................................333 Optymalizacja dokumentów .................................................................................................................................. 334 O organizowaniu aplikacji i dobrych nawykach ................................................................................................. 336 Ładowanie nowej zawartości................................................................................................................................... 337 Dodawanie komponentu ProgressBar ..................................................................................................................344 Ładowanie witryny Tech Bookstore ......................................................................................................................347 Testowanie i usuwanie błędów z kodu witryny Tech Bookstore........................................................................ 351 Lekcja 13. Publikacja dokumentów Flasha........................................................................................................................357 Publikacja plików SWF............................................................................................................................................ 358 Wykrywanie odtwarzacza Flash Player.................................................................................................................. 364 Osadzanie pliku SWF na stronie HTML .............................................................................................................. 367 Umieszczenie przykładowej witryny na serwerze WWW ...................................................................................370 Na zakończenie ........................................................................................................................................................ 373 Dodatek A Instalacja rozszerzeń .............................................................................................................................................375 Dodatek B Zasoby...........................................................................................................................................................................381 Dodatek C Skróty klawiaturowe..............................................................................................................................................391 Skorowidz ..........................................................................................................................................................................................397 8 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 6. 5 Tworzenie animacji Flash już od wielu lat jest dobrze znanym programem do tworzenia animacji. Głównie dlatego, iż bardzo dobrze spełnia zadanie animacji grafiki. Dzięki niewielkim rozmiarom plików SWF i doskona- łej jakości grafiki Flash stał się doskonałym narzędziem do tworzenia animacji dostępnych w Interne- cie. W ostatnich latach Flash jest nawet wykorzystywany do tworzenia animacji na potrzeby telewizji (głównie reklam telewizyjnych i kreskówek). Flash znalazł tak wiele zastosowań nie przez przypadek: jest doskonałym narzędziem do tworzenia i animacji grafiki wektorowej. Animacja na tworzonej witrynie.
  • 7. Firma Macromedia dołożyła starań, by animacja obiektów na scenie była bardzo prosta zarówno dla początkujących, jak i ekspertów. Bardzo łatwo można dodać ruch do dokumentu, używając efektów listwy czasowej, kreujących animację za nas. Wystarczy tylko kilka kliknięć i już można uzyskać efekty takie jak rozmycie, wybuch, rozszerzenie, transformacja i przejście. Oczywiście można także tworzyć własne animacje, używając animacji automatycznej i animacji „klatka po klatce”. W niniej- szej lekcji poznasz wszystkie te techniki. Czego się nauczysz Po tej lekcji będziesz potrafił: Opisać różne rodzaje animacji Dodać ruch do systemu menu Wykorzystać efekt łagodzenia do spowolnienia lub przyspieszenia automatycznej animacji ruchu Zmienić jasność i przezroczystość dzięki automatycznej animacji ruchu Dodać automatyczną animację kształtu Wykonać animację „klatka po klatce” Wykorzystać warstwę ścieżki ruchu, by poruszać symbol po wektorowej ścieżce Użyć efektów listwy czasowej do animacji klonów Czas trwania Lekcja zajmie około 2 godzin. Materiały do lekcji Pliki multimedialne: brak Pliki startowe: Lekcja05/bookstore9.fla Lekcja05/map_starter.fla Gotowy projekt: Lekcja05/bookstore9_complete.fla Lekcja05/map.fla 130 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 8. Rodzaje animacji Animacja jest sekwencją obrazów tworzących iluzję ruchu, jeżeli kolejne obrazy są wyświetlane wystar- czająco szybko. We Flashu obrazem jest grafika znajdująca się w klatce listwy czasowej. Do uzyskania animacji i ruchu w plikach FLA można wykorzystać rysunki, zdjęcia, a nawet kod ActionScript. Istnieje kilka sposobów tworzenia animacji we Flashu. Można kreować automatyczną animację ruchu, automatyczną animację kształtu lub animację „klatka po klatce”. Animacja automatycz- na dotyczy obliczeń (na przykład zmiany właściwości lub kształtu obiektu) wykonywanych przez Flasha między ustalonymi stanami obiektu (klatkami kluczowymi). Gdy na przykład stosuje się automatyczną animację ruchu między zbiorem klatek kluczowych, Flash sam tworzy ruch, wypeł- niając przestrzeń między klatkami kluczowymi odpowiednimi przejściami. Automatyczna animacja kształtu służy do modyfikacji wektorowych linii lub krzywych (na przykład do zamiany kwadratu w okręg). Automatyczna animacja ruchu zmienia właściwości obiektu, na przykład może przesu- wać obiekt po scenie. W tej lekcji wykonamy oba rodzaje ruchu. Animacja „klatka po klatce” jest bardziej tradycyjnym sposobem tworzenia animacji. W tym przy- padku to nie Flash wypełnia przejścia między klatkami kluczowymi, ale my sami rysujemy poszcze- gólne klatki animacji. Tego rodzaju animacja potrzebna jest wtedy, gdy chce się uzyskać pewne efekty specjalne niemożliwe do wykonania innymi technikami. Oczywiście wykonanie animacji „klatka po klatce” jest zdecydowanie bardziej pracochłonne i zajmuje więcej miejsca w wynikowym pliku SWF. Możliwe jest także tworzenie animacji na podstawie skryptów ActionScript. Dodatkowo istnieje oddzielny interfejs programistyczny języka ActionScript poświęcony rysowaniu linii i kształtów na scenie – Drawing API. Można z niego korzystać na wiele różnych sposobów. Choć zagadnienie to wykracza poza ramy niniejszej książki, warto zapoznać się z tymi technikami, gdy już opanuje się podstawy skryptów ActionScript. Tworzenie automatycznej animacji ruchu Jak się przed chwilą dowiedziałeś, automatyczna animacja ruchu służy do zmiany właściwości obiek- tów w pewnym obszarze klatek. Można zmieniać właściwości takie jak położenie, rozmiar, przezro- czystość, zabarwienie i obrót, a nawet przemieszczać obiekt wzdłuż ścieżki. Zawsze warto zamienić obiekt na symbol przed przystąpieniem do tworzenia automatycznej animacji ruchu, gdyż pomaga to utrzymać niewielkie rozmiary pliku SWF. Rozmiar pliku może być niewielki, gdyż Flash wielokrot- nie korzysta z tego samego elementu z biblioteki, zamiast za każdym razem tworzyć go od podstaw. Możliwa jest automatyczna animacja kształtu surowych obiektów wektorowych, ale nie można w ten sposób animować bitmap ani klonów. Aby dokonać takiej animacji, trzeba rozbić bitmapę lub klon na elementy składkowe, używając polecenia Modify/Break Apart. W dalszej części omówimy ten rodzaj animacji automatycznej na podstawie grafiki wektorowej. LEKCJA 5. 131 Tworzenie animacji
  • 9. Istnieje kilka różnych sposobów dodawania automatycznej animacji ruchu do plików FLA. Omó- wimy je w tej lekcji. W tym ćwiczeniu dodamy automatyczną animację ruchu do menu witryny wykonanego w poprzedniej lekcji, aby uzyskać efekt wysuwania się i zamykania menu. Dodamy także akcję stop, aby zatrzymać animację (nie chcemy mieć zapętlonej animacji w pliku SWF). 1. Otwórz plik bookstore8_complete.fla utworzony w poprzedniej lekcji. Znajdziesz go także w katalogu Lekcja04. Zapisz nową wersję dokumentu w pliku bookstore9.fla. W lekcji 4. wykonaliśmy większość symboli, których animacją zajmiemy się w niniejszej lekcji. Zapisujemy dokument pod nową nazwą, ponieważ dodajemy wiele nowych informacji do tego pliku. Zapisując nową wersję, zawsze można powrócić do starszej wersji, gdy coś poszło nie tak i zacząć wszystko od początku. 2. Znajdź klon symbolu products_btn na scenie, naciśnij klawisz F8, aby skonwertować go do klipu filmowego. Nadaj klipowi nazwę productsMenu_mc. Ten proces może się niektórym osobom wydawać nieco dziwny. Powodem, dla którego umieszcza się grafikę, przyciski i linie wewnątrz klipu filmowego, jest możliwość jednoczesnej animacji całości. Próba osobnej animacji poszczególnych elementów jest zbyt pracochłonna. Poza tym przy aktualnych ustawieniach dokumentu bezpośrednia animacji products_mc nie byłaby możliwa. Umieszczenie wszystkiego w klipie filmowym zapewnia animację wszystkiego jako jednej całości i dodatkowo umożliwia sterowanie animacją z poziomu kodu ActionScript. Jeżeli masz problemy z zaznaczeniem menu, ponieważ przyciski ułożone są jeden nad drugim, zablokuj warstwę buttons i dodatkowo ukryj ją, klikając kropkę pod ikoną kłódki. 3. Dwukrotnie kliknij klon productsMenu_mc, aby rozpocząć jego edycję na scenie. Powiększ menu, jeżeli jest to konieczne. Po dwukrotnym kliknięciu klonu productsMenu_mc pozostała część sceny stanie się wyszarzona, aby można się było skoncentrować na edycji symbolu. Edycja symbolu na scenie umożliwi animację menu względem innych obiektów. Aby powiększyć menu, wybierz narzędzie Zoom z przybornika. Narzędzie jest ustawione na powięk- szanie, jeśli na narzędziu widać znak plus. Jeżeli nie widać tego znaku, wybierz opcję Enlarge z działu opcji przybornika. Kliknij menu na scenie, używając narzędzia Zoom. Scena powiększy się, zachowując menu na środku. Powtórz ten krok kilka razy, ale upewnij się, iż przy powiększeniu nadal widać przycisk products_btn powyżej menu. Wybierz narzędzie Selection z przybornika po zakończeniu powiększania. 4. Zaznacz warstwę Layer 1 i zmień jej nazwę na menu tween. Wstaw nową warstwę i nadaj jej nazwę actions. Dodaj klatki kluczowe do warstwy actions w klatkach 11. i 20. Zaznacz warstwę menu tween i kliknij przycisk Insert Layer. Zmień nazwę nowej warstwy na actions. Utwórz nowe klatki kluczowe w klatkach 11. i 20. nowej warstwy, zaznaczając każdą z klatek i naciskając klawisz F6. Zmienimy położenie klipu filmowego w każdej 132 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 10. klatce kluczowej. Zmiana położenia klipu filmowego utworzy animację po dodaniu automatycznego przejścia między klatkami kluczowymi. Automatyczną animację dodamy w następnym ćwiczeniu. Jeżeli pozostawisz na scenie klip filmowy zawierający więcej niż jedną klatkę, będzie on odtwarzany w pętli aż do zatrzymania go za pomocą odpowiedniego kodu ActionScript. W następnym kroku dodamy akcję stop, aby wyłączyć zapętlenie klipu filmowego. 5. Dodaj akcję stop do listwy czasowej sterującej animacją. Otwórz panel Actions, wybierając polecenie Window/Development Panels/Actions z głównego menu. Panel ten pojawi się zadokowany na dole sceny w systemie Windows lub będzie panelem swobodnym w systemie Mac OS. Okno skryptu to duży obszar tekstowy po prawej stronie panelu. Po lewej stronie panelu znajduje się nawigator skryptów i pasek narzędziowy akcji. Dodamy teraz trochę kodu ActionScript do panelu Actions. Zaznacz klatkę kluczową z pierwszej klatki listwy czasowej i wpisz w oknie skryptu tekst stop();. Następnie zaznacz klatkę kluczową w klatce 11. i wpisz ten sam tekst. Powtórz to samo dla klatki 20. Akcja stop zatrzyma odtwarzanie aktualnego klipu filmowego w tych klatkach. W lekcji 11. dodamy kod, który spowoduje odpowiednie animowanie menu. Powodem, dla którego umieszczamy akcję stop przed klatką kluczową z klatki 12. (wykonamy to w następnym kroku), jest potrzeba zatrzymania animacji po rozwinięciu menu. Gdyby brakło tej akcji, zaczęłaby być odtwarzana animacja zamykania menu. Podobnie po zakończeniu animacji zamykania menu istnieje odpowiednia akcja stop wyłączająca ponowne rozwinięcie menu. Gdy zakończysz dodawanie kodu ActionScript, zablokuj warstwę actions, klikając kropkę pod ikoną kłódki. W ten sposób zabezpieczymy się przed dodaniem czegokolwiek do tej warstwy. Zaleca się nieumieszczanie żadnej surowej grafiki, klonów symboli, komponentów i innych elementów na warstwach kodu ActionScript. Jeżeli umieścisz kod na tej samej warstwie co inne obiekty, na przykład komponenty, po eksporcie dokumentu do formatu SWF mogą się pojawić pewne problemy. Poza tym takie rozwiązanie może znacznie utrudnić testowanie plików FLA (patrz pierwszy rysunek na następnej stronie). 6. Wstaw nową warstwę o nazwie labels. Dodaj do nowej warstwy dwie klatki kluczowe w klatkach 2. i 12., a następnie zablokuj tę warstwę. Utwórz nową warstwę bezpośrednio pod warstwą actions i nadaj jej nazwę labels. Utwórz nowe klatki kluczowe w klatkach 2. i 12., zaznaczając każdą z nich i naciskając klawisz F6. LEKCJA 5. 133 Tworzenie animacji
  • 11. Zaznacz drugą klatkę warstwy labels i wpisz nazwę etykiety slidedown w polu tekstowym <Frame Label> z inspektora Properties. Następnie zaznacz klatkę 12. i w tym samym polu wpisz tekst slideup. Na końcu zablokuj warstwę labels w sposób opisany w poprzednim kroku, aby uniemożliwić przypadkową modyfikację zawartości warstwy. 7. Wstaw nowe klatki kluczowe w klatkach 12. i 20. warstwy menu tween. Te klatki zdefiniują sposób animacji menu. Klatka 12. jest końcem animacji otwierania menu i początkiem animacji zamykania menu. 8. Zmień położenie klipu filmowego product_mc w klatce 12. Zaznacz klon product_mc na scenie w klatce 12. Przemieść klip dokładnie w dół, przytrzymując klawisz Shift i naciskając klawisz strzałki w dół aż do momentu znalezienia się klipu dokładnie poniżej paska bar_gr (patrz rysunek na następnej stronie). 9. Powróć do głównej sceny i powtórz te same kroki dla dwóch pozostałych menu. Kliknij łącze Scene 1 na pasku edycji, aby powrócić na główną scenę. Powtórz kroki od 2. do 8. dla symboli contact_mc i company_mc. Gdy skończysz ten krok, wszystkie trzy menu będą gotowe do wykonania w nich animacji automatycznej. 10. Pamiętaj o zapisaniu do pliku zmian w dokumencie FLA. Mamy już ustawione klipy filmowe menu w taki sposób, iż bardzo łatwo będzie można dodać do nich automatyczną animację ruchu. Zamiast wstawiać automatyczną animację, a następnie dodawać zawartość, najpierw rozmieściliśmy zawartość, a dopiero później dodamy animację automatyczną. Flash jest elastyczny i umożliwia zastosowanie wielu różnych podejść do tworzenia animacji: można najpierw dodać automatyczną animację ruchu, a następnie przesunąć klon lub też najpierw przesunąć klon, a dopiero później utworzyć animację automatyczną. W następnym podrozdziale dodamy animację automatyczną, aby ożywić wykonane symbole. 134 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 12. Na danej warstwie można utworzyć tylko jedną animację automatyczną ruchu. Jeżeli chce się wykonać animację wielu symboli, trzeba umieścić każdy z symboli na osobnej warstwie. Aby przenieść kilka symboli znajdujących się na jednej warstwie do wielu warstw, wystarczy zaznaczyć symbole i użyć polecenia rozdzielania na warstwy (Modify/Timeline/Distribute to Layers). Rozdzielanie na warstwy przydaje się na przykład wtedy, gdy trzeba wykonać animację poszczegól- nych znaków bloku tekstu (po wcześniejszym rozbiciu tekstu na litery) lub też po zaimportowaniu grupy elementów w czasie tworzenia pliku FLA. Flash zmieni nazwy każdej warstwy, używając nazwy zaimportowanego pliku. Rozdzielenie na warstwy przyspiesza proces tworzenia filmów Flasha, gdyż zapewnia lepszą organizację dokumentu. Dodawanie automatycznej animacji ruchu Automatyczna animacja ruchu służy między innymi do zmiany położenia, jasności, przezroczysto- ści i zabarwienia klonu na scenie. W inspektorze Properties znajduje się rozwijana lista o nazwie Color, która służy do zmiany jasności, przezroczystości i zabarwienia klonu. Opcja Advanced umożliwia LEKCJA 5. 135 Tworzenie animacji
  • 13. jednoczesną zmianę kolorów i przezroczystości. Jeżeli posiadasz klon z automatyczną animacją ruchu, wybranie odpowiednich wartości z listy w klatce kluczowej powoduje przejście do wprowa- dzonych właśnie ustawień lub rezygnację z nich w trakcie trwania animacji. Po ustawieniu klatek kluczowych w klipie filmowym, a także ustaleniu położenia początkowego i koń- cowego klipu filmowego można rozpocząć wstawianie automatycznej animacji ruchu. Dodatkowo wykonamy także animację jasności menu, używając wartości ustawionych w inspektorze Properties. 1. W dokumencie bookstore9.fla otwórz klon productsMenu_mc, jeżeli nie jest on otwarty. Zaznacz warstwę menu tween. Będziemy pracować z tym samym klipem filmowym i zawartością, co w poprzednim ćwiczeniu. 2. Utwórz automatyczną animację ruchu między klatką 1. i 12. dla animacji otwierania menu. Kliknij prawym klawiszem myszy (Control+kliknięcie w Mac OS) klatki od 1. do 12. z warstwy menu tween i wybierz polecenie Create Motion Tween z menu kontekstowego. Zauważysz, iż kolor tła ciągu klatek zmienił kolor na purpurowy oraz że pojawiła się strzałka przecinająca cały ciąg klatek. Ta zmiana wyglądu wskazuje, iż powstała automatyczna animacja ruchu. Rysunek dla kroku 3. przedstawia listwę czasową zawierającą dwie animacje. 3. Dodaj drugą automatyczną animację ruchu, aby zapewnić animację zamykania menu. Następnie przetestuj animację, przeciągając znacznik odtwarzania po listwie czasowej. Powtórz krok 2., aby dodać animację automatyczną między klatkami 12. i 20. Zaznacz dowolną z klatek z podanego przedziału i kliknij prawym klawiszem myszy (Control+kliknięcie w Mac OS), a następnie z menu kontekstowego wybierz polecenie Create Motion Tween. Gdy wykonasz te kroki, menu będzie się otwierało między klatkami numer 1 i 12 oraz zamykało między klatkami numer 12 i 20. Przeciągnij znacznik odtwarzania, aby się o tym przekonać. Po wykonaniu animacji automatycznej zawsze można zmienić czas jej trwania, dodając lub usu- wając klatki znajdujące się między klatkami kluczowymi. Klatki można dodać, zaznaczając jedną z klatek wewnątrz animacji i naciskając klawisz F5. Klatki można usunąć poleceniem Remove Frames z menu kontekstowego. Flash automatycznie dostosuje animację do wprowadzonych zmian. 4. Dodaj łagodzenie ruchu do automatycznej animacji, używając inspektora Properties. Suwak Ease znajduje się w inspektorze Properties, gdy zaznaczona jest automatyczna animacja ruchu. Można łagodzić animację na początku lub na końcu, aby uzyskać efekt przyspieszania lub spowalniania. Domyślnie łagodzenie (parametr Ease) jest ustawione na 0, co oznacza brak efektu. Wprowadzenie wartości domyślnych w granicach od 1 do 100 powoduje spowolnienie 136 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 14. animacji na jej końcu. Wpisanie wartości ujemnych od –1 do –100 powoduje początkową powolność animacji, a następnie jej przyspieszenie. Pierwszy rodzaj animacji nazywany jest animacją spowalniającą, a drugi animacją przyspieszającą. Zaznacz pierwszą klatkę i rozwiń panel inspektora Properties. Ustaw suwak Ease na wartość 100, a wykonasz animację spowalniającą (menu na końcu animacji będzie się przesuwało wolniej niż na jej początku). Następnie zaznacz klatkę 12. i ustaw suwak Ease na wartość –100, co oznacza animację przyspieszającą. Menu będzie powoli przyspieszało w trakcie zamykania. 5. Dodaj animację jasności do menu, a następnie przetestuj animację, przeciągając znacznik odtwarzania po listwie czasowej. Zaznacz klon productsMenu_mc z pierwszej klatki warstwy menu tween. Musisz zaznaczyć klon, a nie klatkę, aby dostać się do właściwości jasności. Wybierz opcję Brightness z rozwijanej listy Color z inspektora Properties. Zmień wartość na 85%. Zaznacz productsMenu_mc z klatki 12. i upewnij się, iż jasność jest nadal ustawiona na 0%. Przeciągnij znacznik odtwarzania, aby zobaczyć animację. Przyjrzyj się dokładnie rodzajowi uzyskanej animacji. Powinieneś stosować animację jasność zamiast animacji przezroczystości wszędzie tam, gdzie jest to możliwe, ponieważ animacja przezroczystości, szczególne nad złożonymi bitmapami, znacznie bardziej obciąża procesor niż animacja jasności. Po prostu Flash musi wykonać w tym pierwszym przypad- ku znacznie więcej obliczeń niż dla animacji jasności. 6. Powtórz kroki od 2. do 5. dla dwóch pozostałych menu z pliku FLA. Sprawdź animacje, przeciągając znacznik odtwarzania listwy czasowej. Powtórz kroki od 2. do 5. dla dwóch pozostałych menu dokumentu, aby wszystkie menu posiadały stosowne animacje. Po dodaniu animacji dla każdego z menu, użyj znacznika odtwarzania, aby sprawdzić poprawność działania animacji. Możliwe jest także naciśnięcie klawisza Enter do sprawdzenia animacji. W tym przypadku animacja będzie odtwarzania w środowisku autorskim aż do osiągnięcia końca listwy czasowej. 7. Powróć na główną scenę. Wyczyść bibliotekę i zapisz dokument FLA. Kliknij łącze Scene 1, aby powrócić do głównej listwy czasowej. Wyczyść bibliotekę, umieszczając symbole productsMenu_mc, companyMenu_mc i contactMenu_mc w bibliotece. Zapisz zmiany dokonane w pliku FLA. LEKCJA 5. 137 Tworzenie animacji
  • 15. Gdy stosuje się automatyczną animację ruchu, istnieje możliwość określenia kierunku i stopnia obrotu zaznaczonego symbolu. Istnieją cztery opcje obrotu: None (brak), Auto (automatyczny), CW (zgodnie z ruchem wskazówek zegara), CCW (przeciwnie do ruchu wskazówek zegara). Jeżeli wybrałeś opcję Auto, obrót przeprowadzany jest w tym kierunku, który wymaga najmniejszego kąta. Dwie ostat- nie opcje obracają obiekt w zadanym kierunku podaną liczbę razy. Animacja poziomów przezroczystości i wielkości Zmiana przezroczystości klonu nie różni się zbytnio od przesuwania klonu na scenie. W zasadzie wykonuje się ją identycznie jak zmianę jasności (patrz poprzednie ćwiczenie). W obu przypadkach potrzebny jest ciąg klatek z automatyczną animacją, dla których można zastosować przejście. Jak już wcześniej wspominałam, wartość alpha odpowiada kryciu (przezroczystości) obiektu. Jeżeli war- tość alpha jest ustawiona na 0, obiekt nie jest widoczny na ekranie. Jeżeli wartość alpha jest ustawio- na na 100%, obiekt jest nieprzezroczysty. W tym ćwiczeniu zastosujemy automatyczną animację ruchu, aby uzyskać efekt przyciemniania poświaty animowanej za logo, a także efekt zmiany rozmiaru. Nadal pracuj na pliku bookstore9.fla z poprzedniego ćwiczenia. 1. Zaznacz symbol glow_gr i skonwertuj go do klipu filmowego o nazwie bookglow_mc. Zmień nazwę warstwy Layer 1 na glow animation. Upewnij się, iż znajdujesz się na głównej scenie, klikając łącze Scene 1 na pasku edycji. Znajdź klon symbolu glow_gr wewnątrz symbolu logo_mc. Zaznacz go i naciśnij klawisz F8, aby skonwertować go do klipu filmowego o nazwie bookglow_mc. Musisz zmienić symbol graficzny na klip filmowy, ponieważ animacja ma być stale odtwarzana na scenie. Upewnij się, iż warstwy pageTurn i logo są zablokowane, aby móc bez przeszkód zaznaczyć klon glow_gr. Dwukrotnie kliknij utworzony klip filmowy bookglow_mc i zmień nazwę domyślnej warstwy Layer 1 na glow animation. 2. Utwórz klatkę kluczową w klatce 35. i 70. na warstwie glow animation. Zaznacz klatkę 35. warstwy glow animation i dodaj nową klatkę kluczową. Spowoduje to skopiowanie zawartości klatki 1. do nowej klatki kluczowego. Podobnie postąp w przypadku klatki 70. W dalszej części ćwiczenia zmodyfikujemy przezroczystość i rozmiar klonu symbolu. 3. Zmień rozmiar glow_gr, używając narzędzia Free Transform. Zaznacz ujęcie 35. warstwy glow animation. Włącz narzędzie Free Transform z przybornika i przeciągnij jeden z uchwytów narożnikowych do środka symbolu, aby zmniejszyć klon. Aby zachować odpowiednie skalowanie, w trakcie przeciągania przytrzymaj klawisz Shift. Tak zmień rozmiar klonu, aby ukrył się on za grafiką logo (patrz rysunek z punktu 4.). 4. Zmień przezroczystość klonu glow_gr, używając inspektora Properties i automatycznej animacji ruchu. 138 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 16. Zmieniłeś rozmiar grafiki w klatce 35. Teraz zmień przezroczystość klonu. Zaznacz klon w klatce 35., używając narzędzia Selection. Wybierz opcję Alpha z rozwijanej listy Color z inspektora Properties. Przesuń suwak Alpha z wartości 100% na 80%. Jeżeli wydaje Ci się, iż ta wartość nie wygląda najlepiej, metodą prób i błędów ustal inną wartość. Pamiętaj o tym, iż modyfikacje wykonywane na scenie dla klonu w żaden sposób nie wpływają na symbol w bibliotece. Jeżeli teraz przeciągnąłbyś nowy klon symbolu na scenę, wyglądałby on tak samo, jak klon glow_gr sprzed modyfikacji. 5. Dodaj automatyczną animację ruchu, aby skalować grafikę, a następnie przeciągnij znacznik odtwarzania po listwie czasowej. LEKCJA 5. 139 Tworzenie animacji
  • 17. Kliknij dowolną kratkę od 1. do 35. i otwórz panel inspektora właściwości. Zmień opcję z rozwijanej listy Tween z None na Motion. Podobnie postąp dla klatek w przedziale od 35. do 70. Klip filmowy powinien teraz skalować poświatę i bardziej ją tonować przed powrotem do oryginalnego kształtu. Można przetestować poszczególne klipy filmowe, zaznaczając pierwszą klatkę klipu i wybierając polecenie Control/Play z głównego menu. W ten sposób nie trzeba eksportować całego filmu SWF, aby sprawdzić jeden klip filmowy. 6. Przenieś klip filmowy bookglow_mc do folderu movie clips w bibliotece. Zapisz dokument FLA przed przejściem do następnego ćwiczenia. Animacja przycisku klipu filmowego W lekcji 4. utworzyliśmy dwa przyciski klipów filmowych: jeden dla spisu treści i jeden dla przykła- dowego rozdziału. W tym ćwiczeniu zamierzamy dodać animację do tych przycisków, aby wypełnie- nie posiadało jaśniejszy kolor, gdy odwiedzający stronę najedzie kursorem na przycisk (rozjaśnienie będzie animowane). Przyciski klipów filmowych wykorzystają animację rozjaśnienia w podobny sposób, jak wcześniejsze animacje menu. Przycisk będzie animowany wtedy, gdy użytkownik umieści kursor nad przyciskiem, oraz wtedy, gdy zsunie kursor myszy z przycisku. Przycisk klipu filmowe- go posiada specjalne etykiety klatek, więc Flash wie, które klatek odpowiadają danym stanom przyci- sku. W tym przykładzie wykorzystamy etykiety _over i _down odpowiadające stanom Over i Down rzeczywistych przycisków. Nadaj pracujemy z plikiem bookstore9.fla. 1. Znajdź symbol samplechapter_mc w bibliotece i kliknij go dwukrotnie. Po dwukrotnym kliknięciu symbolu zostanie on otwarty w trybie edycji. Odblokuj warstwę fill i upewnij się, iż pozostałe warstwy są odblokowane przed przejściem do następnego kroku, gdyż w ten sposób uniemożliwi się modyfikację warstw text i stroke. 2. Zaznacz warstwę fill i wstaw klatkę kluczową dla etykiety _over (klatka 14.), a także w ostatniej klatce klipu filmowego (klatka 25.). Kliknij, aby zaznaczyć klatkę i naciśnij klawisz F6, by wstawić klatkę kluczową. Powtórz ten krok dla klatek 14. i 25. Będą istniały dwie animacje: jedna dla stanu _over i jedna dla stanu _down. Chcemy utworzyć animację dla stanu _over jako odwróconą animację dla stanu _down. Z tego powodu początek animacji _over będzie taki sam, jak koniec animacji _down. 140 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 18. 3. Dodaj animację jasności do klonu fill_gr i wstaw klatkę kluczową w klatce 15. Zaznacz klatkę kluczową w etykiecie _over i rozwiń panel inspektora Properties. Wybierz opcję Motion z menu Tween, aby wstawić automatyczną animację ruchu. Zaznacz klon fill_gr z ujęcia 14. i wybierz opcję Brightness z listy Color z inspektora Properties. Zmień wartość na 85%. Gdy skończysz, zaznacz klatkę 15. i wstaw klatkę kluczową (klawisz F6). Zmień opcję z listy Tween na Motion. Przeciągnij znacznik odtwarzania, aby sprawdzić poprawność wykonanej animacji. Jeśli w tym momencie przetestujesz przycisk, nie będziesz widział animacji rozjaśniania. Jest to spowodowane tym, że przycisk klipu filmowego musi zawierać specjalny kod ActionScript, aby był traktowany przez Flasha jako przycisk. Kod ten dodamy w kolejnej lekcji. 4. Powtórz kroki od 1. do 3. dla klonu toc_mc. Klip filmowy toc_mc także powinien znajdować się w bibliotece. Kliknij go dwukrotnie, aby wejść do trybu jego edycji. Wykonaj te same kroki, co w przypadku symbolu samplechapter_mc. Chcemy, by oba przyciski były animowane w ten sam sposób. 5. Zablokuj warstwę fill na listwie czasowej, zapisz zmiany i powróć do głównej listwy czasowej. Tworzenie automatycznej animacji kształtu Automatyczna animacja kształtu umożliwia stworzenie efektu zmiany kształtu odbywającej się w określonej liczbie klatek. Tego rodzaju animacja zapewnia możliwość zmiany długość linii, wy- ginanie linii itp. Innymi słowy, zapewnia modyfikację kształtu, co pozwala uzyskać bardzo intere- sujące efekty. Zamiast ręcznie tworzyć wszystkie kształty w kolejnych klatkach animacji, wystarczy tylko ustalić początek i koniec animacji, a Flash wykona za nas odpowiednie obliczenia. Na jednej warstwie może się znajdować jedna lub więcej animacji kształtu, choć w pewnych sytuacjach poszcze- gólne kształty mogą sobie nawzajem przeszkadzać. Kreowane efekty mogą być zarówno bardzo proste, jak i bardzo złożone. Automatyczna animacja kształtu może być stosowana dla surowej grafiki wektorowej (oznaczanej przez wzorzec krzyżykowy po jej zaznaczeniu) lub bitmap, dla których wcześniej wykonano polecenie Modify/Break Apart lub Trace Bitmap. Jest to bardzo elastyczny sposób animacji, ale by uzyskać pożądane efekty przy większych zmianach kształtu, trzeba stosować kształty pomocnicze. LEKCJA 5. 141 Tworzenie animacji
  • 19. Automatyczna animacja kształtu często daje nieoczekiwane wyniki. Wynikają one przede wszyst- kim z tego, iż Flash dokonuje jak najprostszego przejścia między dwoma kształtami. Aby wskazać inny sposób przejścia, można zastosować kształty pomocnicze. Kształty te wskazują miejsca, przez które ma przejść punkt w trakcie swojej drogi od położenia początkowego do końcowego. Każdy kształt pomocniczy posiada oznaczenie literowe. Z tego powodu, jeśli kształt pomocniczy „a” jest umiesz- czony na początku animacji, animacja ta najpierw przejdzie do tego kształtu, a dopiero później do kształtu końcowego. Na przykład możesz mieć animację zamieniającą kształt kota w kształt psa. Jeżeli posiadasz trójkąt reprezentujący ucho kota z kształtem pomocniczym „a” znajdującym się na szczycie ucha kota, a taki sam kształt pomocniczy znajduje się na szczycie ucha psa, wtedy ucho kota od razu zamieni się w ucho psa bez żadnych pośrednich dróg. Istnieją dwa sposoby mieszania dla automatycznych animacji kształtu: rozkładowa (Distribute) i narożniko- wa (Angular). Pierwszy sposób mieszania tworzy płynne przejścia, które wydają się nieco nieregularne. Drugi sposób mieszania zachowuje narożniki i linie w trakcie przejścia. Mieszanie narożnikowe dostępne jest tylko dla kształtów z prostymi liniami i ostrymi narożnikami. W tym ćwiczeniu opracujemy subtelny efekt przewracania kartek książki znajdującej się w logo witryny. Nadal pracujemy z plikiem bookstore9.fla. 1. Znajdź klon pageTurn_mc wewnątrz symbolu logo_mc. Kliknij go dwukrotnie, aby otworzyć go w trybie edycji. Włącz znaczne powiększenie strony, przynajmniej 800%. Utworzyłeś klip filmowy obracania strony w poprzedniej lekcji. Na razie klip ten po prostu zawiera jedną linię. Animacja obracania strony składa się z dwóch części. Pierwsza część polega na utworzeniu automatycznej animacji kształtu. Właśnie tym zagadnieniem zajmiemy się w niniejszym ćwiczeniu. 2. Zmień nazwę warstwy Layer 1 na animation. Dodaj klatkę kluczową w klatce 10., a następnie zmodyfikuj nową klatkę kluczową. Po zmianie nazwy warstwy na animation i dodaniu klatki kluczowej możesz zmodyfikować klatkę 10. Zaznacz tę klatkę i upewnij się, iż linia nie jest zaznaczona. Przesuń kursor myszy nad linię aż do pojawienia się kursora przedstawionego na rysunku poniżej. Kliknij i przeciągnij linię, aby ją wygiąć. Wygnij linię w sposób przedstawiony na pierwszym rysunku na następnej stronie. 142 MACROMEDIA FLASH MX 2004 Oficjalny podręcznik
  • 20. Przeciągnij mysz nad górną krawędź linii aż do pojawienia się kursora przedstawionego na rysunku poniżej. Kliknij i przeciągnij koniec linii lekko na prawo (patrz rysunek). 3. Wstaw automatyczną animację kształtu, używając inspektora Properties, a następnie sprawdź animację. Zaznacz pierwsze ujęcie i otwórz panel inspektora Properties. Wybierz opcję Shape z rozwijanej listy Tween. Pojawi się zielona strzałka na klatkach z warstwy animation. Oznacza to, iż w tych klatkach występuje animacja kształtu. Kliknij i przeciągnij znacznik odtwarzania między klatkami, aby podejrzeć animację dodaną do logo. Dolny punkt krzywej powinien pozostać w tym samym miejscu (na łączeniu książki). Animację dokończymy w następnym ćwiczeniu. 4. Gdy zakończysz tworzenie automatycznej animacji kształtu, zapisz zmiany dokonane w dokumencie, wybierając polecenie File/Save. W następnym ćwiczeniu dodamy animację „klatka po klatce”, która dokończy efekt przewracania strony. LEKCJA 5. 143 Tworzenie animacji