Praca praktyczna "Tworzenie animacji kształtu we Flashu" Podręcznik metodyczny "Nauka tworzenia animacji na lekcjach informatyki. Ilustrowany samouczek animacji dla Internetu Tworzenie animacji kształtu animacji
Cała praca nad tworzeniem filmu odbywa się za pomocą panelu Oś czasu, który pokazano poniżej. Panel Oś czasu jest podzielony na dwie części pionową linią, którą można przesuwać myszą. Prawa strona panelu to tak zwana „linijka ramki” - linijka, na której znajdują się symbole ramek, które wyglądają jak małe prostokąty. Zawartość ramek to statyczne obrazy, które zmieniają się w czasie, pojawiając się na polu roboczym. Numeracja klatek jest pokazana u góry linijki. „Pasek stanu” znajduje się pod paskiem ramek.
Klatki kluczowe to klatki, w których umieszczane są statyczne obrazy, które „ożywają” podczas animacji. Klawisz
- główne narzędzie podczas pracy z animacjami we Flashu. Wyświetla informacje o warstwach, które klatki są kluczowe i które Flash generuje. Za pomocą osi czasu można zrozumieć, które klatki zawierają czynności lub etykiety. Umożliwia przenoszenie klatek kluczowych i całych fragmentów animacji.
Kluczowe cechy osi czasu:
- Aby uaktywnić warstwę, musisz ją zaznaczyć. Możesz rysować i edytować tylko na warstwie aktywnej. Aktywna warstwa jest podświetlona na osi czasu, a ikona ołówka wskazuje, że można ją edytować (warstwa 3).
- Zawartość warstw u góry osi czasu jest wyświetlana nad zawartością warstw znajdujących się pod nimi. Aby zamienić warstwy, przeciągnij nazwę warstwy w wybrane miejsce na osi czasu.
- Aby utworzyć nową warstwę, wybierz pozycję na osi czasu dla nowej warstwy i naciśnij przycisk „Dodaj warstwę”.
- Aby usunąć warstwę, po prostu przeciągnij ją do kosza.
- Aby zmienić nazwę warstwy, kliknij ją dwukrotnie na osi czasu.
- Tworząc obraz z warstwami, użyj elementów sterujących warstwami. Kliknięcie w kolumnie pod obrazem blokady zablokuje jakąkolwiek edycję, a w kolumnie pod obrazem oka uczyni warstwę niewidoczną.
Poniżej znajduje się przykład animacji, w której inne tło (krajobraz) jest umieszczane na różnych warstwach z przesunięciem o 25 klatek z odpowiednim blokiem tekstu. Krajobraz uzyskano poprzez wypełnienie tła bitmapą Color Mixer-\u003e Bitmap, a następnie przetworzenie za pomocą narzędzia Fill Transformer.
- Obraz (grafika), to symbol składający się z pojedynczej ramki. Stąd wynika jego statyczna nazwa. Jeśli symbol jest rzeczywiście statycznym (nieanimującym) obiektem, lepiej zrobić z niego grafikę.
- Przycisk (przycisk). Flash ma niestandardowy symbol funkcji przycisku. Posiada 4 ramki: Up, Over, Down, Hit, które zawierają następujące stany przycisków:
- Trafienie to normalny stan przycisku zawierającego łącze, które użytkownik już odwiedził.
- Animacja (klip filmowy). Jest to najbardziej „kompletny” rodzaj symbolu. Może zawierać dowolną liczbę klatek. Symbol tego typu można zinterpretować jako obiekt filmu w języku ActionScript (osadzony Flash).
Istnieją dwa zasadniczo różne sposoby animowania czegoś w Macromedia Flash:
- Narysuj każdą klatkę samodzielnie, używając Flasha tylko do przechodzenia między klatkami.
- Wymuś program Flash, aby automatycznie renderował klatki pośrednie.
Animacja krok po kroku (klatka po klatce)
To animacja złożona w całości z klatek kluczowych. Te. Sam określasz zarówno zawartość ramki, jak i jej „czas trwania” (tj. Ile takich statycznych ramek zajmie obraz). Przed narysowaniem następnej klatki wstaw pustą klatkę kluczową (
Zalety tej metody to:
- Animacja klatka po klatce daje w pewnym sensie większą kontrolę nad animacją, a jeśli jesteś doświadczonym animatorem, możesz to wykorzystać na swoją korzyść.
- Tylko w ten sposób można zorganizować zmianę całkowicie niezależnych obrazów - pokaz slajdów (na przykład tworząc zwykły baner za pomocą Flasha).
- I wszystko inne, co wynika z możliwości ręcznego narysowania każdej klatki.
Wady obejmują:
- Animacja klatka po klatce jest trudna do zmodyfikowania. Zwłaszcza jeśli nie jest to dyskretny zestaw obrazów, ale powiązana animacja. Wszystkie ramki muszą zostać zmodyfikowane.
- Animacja klatka po klatce zajmuje dość dużo miejsca, ponieważ musisz przechowywać informacje o każdej klatce.
Podstawowe operacje z personelem:
- Wstaw pustą klatkę kluczową - Wstaw -\u003e Pusta klatka kluczowa,
. - Klatka kluczowa powtarzająca zawartość poprzedniej - Wstaw -\u003e Klatka kluczowa,
. - Wyczyść klatkę kluczową - Wstaw -\u003e Wyczyść klatkę kluczową,
+ . - Wstaw ramkę zwykłą - Wstaw ramkę,
. - Usuń ramkę - Wstaw -\u003e Usuń ramki,
+ .
Podstawowe operacje z walcem:
- Oglądanie wideo - Kontrola, film testowy.
- Zmiana wysokości i szerokości filmu - Modyfikuj, Film.
- Konwertuj film Flash do pliku dokumentu HTML, ustawienia publikowania, zakładka HTML.
- Podgląd dokumentu HTML - Plik, Podgląd publikacji.
Stwórzmy wielowarstwowy film z animacją krok po kroku „Flower Life”. I warstwa - ramka, II warstwa - doniczka, III warstwa - kwiat. Możesz przedstawić trzecią warstwę w trzech warstwach: liść, łodyga, kwiatostan.
Doniczka i rama są zawsze na naszych oczach, a kwiatek rośnie i blaknie w 25 kluczowych klatkach. W warstwie „kwiatek” każda klatka różni się od poprzedniej, ale stan kwiatka można zmieniać po jednej klatce na raz.
Film jest publikowany za pomocą opcji Plik-\u003e Ustawienia publikowania. Na karcie Formaty zaznaczone są opcje publikowania, możesz wybrać kilka, na odpowiednich kartach ustawić opcje dla wybranej opcji publikowania, a następnie kliknąć przycisk Publikuj. W tym przypadku utworzone pliki są zapisywane w tym samym folderze, co oryginalny plik z rozszerzeniem .fla. W naszym przykładzie opcja pliku animowanego Gif jest wybrana do publikacji, tak jak we wszystkich kolejnych przykładach.
Spróbuj wykonać drugie zadanie samodzielnie, korzystając z poniższego algorytmu. Spowoduje to utworzenie animacji „Poruszający się samochód”:
- utwórz warstwę „Krajobraz”;
- wykonaj polecenie Plik / Importuj i zaimportuj obraz z obrazem poziomym lub utwórz tło „asfaltowe”;
- zaznacz 30 klatkę na linijce i naciśnij klawisz F5. utworzyć łańcuch zduplikowanych ramek dla krajobrazu;
- utwórz nową warstwę „Auto”;
- narysuj samochód bez kół w pierwszej klatce kluczowej;
- pogrupuj narysowany samochód i naciśnij klawisz F8, aby utworzyć próbkę biblioteczną - klip samochodowy;
- przesuń samochód, wybierz drugą ramkę i naciśnij F6;
- będziemy przesuwać samochód i tworzyć nowe klatki kluczowe, aż samochód zniknie poza obszarem roboczym;
- utwórz nową warstwę i nazwij ją „Koło1”;
- narysuj koło w pierwszej ramce i utwórz z niego przykładowe koło z biblioteki;
- utwórz nową klatkę kluczową i przesuń kołem za poruszający się samochód itp. we wszystkich innych ramach, obracając koło pod niewielkim kątem;
- zablokuj warstwę „Wheel1” i skopiuj całą wynikową sekwencję klatek do bufora;
- utwórz nową warstwę i nazwij ją „Wheel2”;
- wybierz pierwszą klatkę i skopiuj całą sekwencję klatek z bufora;
- aby zapętlić widok, naciśnij
+ .
Jako kolejne niezależne zadanie możesz zaproponować stworzenie animacji krok po kroku „Wypalanie zapałki”:
We Flashu są dwie opcje tworzenia obrazów pośrednich - animacja ruchu (animacja budowania oparta na modyfikacji postaci), animacja kształtu (animacja budowania oparta na zmianie kształtu). Metody te radykalnie się różnią.
Animacja ruchu
Dzięki tej metodzie animacji ustalane jest położenie początkowe, kolor, rozmiar, orientacja i końcowe parametry, a sam program wykonuje ten ruch. Dzięki tej metodzie animacji Flash automatycznie tworzy klatki pośrednie między określonymi klatkami kluczowymi. Oznacza to, że rysujesz obiekt, a następnie wprowadzasz zmiany w innej klatce, o czym będziemy mówić poniżej, i poproś Flasha o obliczenie klatek, które znajdują się między tymi dwiema klatkami kluczowymi. Wykonuje swoją pracę i uzyskujesz płynną animację.
Szybkość i płynność animacji zależy od liczby klatek przydzielonych do ruchu i szybkości filmu Flash (filmu). Szybkość filmu można zmienić w następujący sposób: Modyfikuj-\u003e Film ...,
Rozważmy animację z konstrukcją klatek pośrednich (ruch z klatką pośrednią). Jest to najczęściej używana technika animacji we Flashu. W tym przypadku animacja polega na modyfikacji symboli, tj. obiekt animacji jest symbolem. Podobnie jak w przypadku animacji kształtów, potrzebujemy jednej warstwy dla każdego obiektu naraz. Na tej warstwie powinien znajdować się jeden symbol, za pomocą którego nastąpią wszystkie zmiany.
Podczas korzystania z animacji ruchu modyfikowane są następujące parametry:
- rozmiar (zarówno proporcjonalny, jak i nieproporcjonalny - osobno wysokość i szerokość);
- skłonić;
- lokalizacja;
- kąt obrotu;
- efekty kolorystyczne;
- możesz użyć warstw pomocniczych do zdefiniowania ścieżki obiektu.
Istnieje kilka sposobów włączenia animacji ruchu (i niestety jest tylko jeden sposób, aby ją wyłączyć). Aby włączyć animację ruchu, należy uaktywnić początkową klatkę przejścia, a następnie, naciskając prawy przycisk myszy, wybrać opcję Utwórz animację ruchu w menu kontekstowym (można to również zrobić, wybierając opcję Wstaw-\u003e Utwórz animację ruchu). Uniwersalnym sposobem włączania / wyłączania animacji ruchu jest użycie panelu Klatka i wybranie opcji Ruch w polu Animacja. Możesz tam również kontrolować parametry animacji:
- Łagodzenie - odwrotne przyspieszenie wykładnicze, działa dokładnie tak samo, jak w przypadku animacji kształtu.
- Obróć pozwala kontrolować rotację. Auto - Flash automatycznie próbuje określić liczbę pętli. CW (zgodnie z ruchem wskazówek zegara) i CCW (przeciwnie do ruchu wskazówek zegara). W tym przypadku obok pola po prawej stronie możliwe staje się wprowadzenie liczby obrotów. Można używać tylko wartości całkowitych. Możesz wyłączyć rotację, wybierając opcję Brak.
- Orient to path - obraca znak zgodnie z linią prowadzącą. Przyciągnij symbol do tego przewodnika.
W przypadkach, gdy liczba klatek sceny głównej nie jest wielokrotnością liczby klatek symbolu, pole wyboru Synchronizuj umożliwia synchronizację obu animacji.
Nazywane są warstwy zawierające krzywą, wzdłuż której ma się poruszać obiekt warstwy pomocnicze (warstwy prowadzące) (tj. zawierają ścieżkę do obiektu). Aby dodać warstwę pomocniczą, musisz wybrać warstwę, na której znajduje się twój symbol; następnie naciśnij prawy przycisk myszy i wybierz Dodaj przewodnik z menu kontekstowego. To sprawia, że \u200b\u200boryginalna warstwa jest warstwą prowadzoną. Nie jest to jedyny sposób tworzenia warstwy pomocniczej. Każdą warstwę można utworzyć jako prowadnicę, określając ją w jej właściwościach lub prowadząc, przeciągając żądaną warstwę myszą, tak aby znajdowała się pod prowadnicą.
Następnie musisz narysować trajektorię ruchu. Ścieżka może być dowolną krzywą, która nie jest regionem wypełnienia. Wszystko! Warstwa kontrolna jest gotowa. Możesz zabronić edycji, aby była wygodniejsza w pracy, a później całkowicie niewidoczna.
Teraz, aby użyć tej warstwy, musisz wziąć symbol centralnego punktu (to takie małe kółko) i przeciągnąć go na ścieżkę. Poczujesz, kiedy symbol „zaczepi się” na nim i zobaczysz, jak się po nim przesunie.
Wtedy wszystko przebiega zgodnie ze znanym scenariuszem - klatki kluczowe, włącz animację ruchu ... Jeśli chcesz, aby obiekt obracał się zgodnie z trajektorią, a nie tylko poruszał się po niej, to w panelu Ramka musisz zaznaczyć pole wyboru Zorientuj do ścieżki.
Animacja ruchu umożliwia stosowanie różnych efektów kolorystycznych do całego symbolu. Tej funkcji brakuje w animacji kształtu. Aby zastosować efekt do symbolu, należy wybrać ten symbol, a następnie w panelu efektów (Windows -\u003e Panele -\u003e Efekty) wybrać żądany efekt, ustawiając jasność, przesunięcie koloru, odcień.
Utwórz bardzo prosty przykład animacji piłki poruszającej się po okręgu, korzystając z poniższego algorytmu:
- narysuj okrąg w pierwszej klatce i wypełnij go radialnym wypełnieniem gradientowym;
- pogrupuj rysunek;
- zaznacz go narzędziem Transformator i przesuń środek obrotu na pewną odległość;
- przejdź do ramki 30, naciśnij
czyli zróbmy to kopię pierwszej klatki; - wróć do pierwszej klatki i otwórz panel Właściwości i wybierz Ruch na liście Animacja;
- na dodatkowej liście Obróć wybierz wymuszony obrót w prawo (CW) lub przeciwnie do ruchu wskazówek zegara (CCW).
Kolejny przykład jest trochę bardziej skomplikowany - to stworzenie animacji ruchu liter tekstu:
- używając narzędzia Tekst, utwórz blok tekstu;
- wybierz napisane słowo i podziel je na oddzielne litery (Modifi / Break Apart);
- oddziel litery na osobnych warstwach Modyfikuj / rozpowszechniaj na warstwy;
- przekonwertować każdą literę w każdej warstwie na rysunek, powtórz polecenie Modyfikuj / Rozłącz. Wybierz każdą literę i pogrupuj ją;
- na linijce ramki w pewnej odległości utwórz kopie pierwszej klatki, w tym celu naciśnij
; - z kolei dobierzemy pierwsze ramki dla każdej litery, przeniesiemy ją poza obszar roboczy, zmieniając proporcje litery, środek obrotu itp .;
- w panelu Właściwości na liście animacji wybierz opcję Ruch. Na dodatkowej liście Obróć wybierz jeden obrót zgodnie z ruchem wskazówek zegara;
- zobaczmy animację w rzutni
+ .
Animacja kształtu to płynna zmiana obiektu animacji na scenie. Przez obiekt nie rozumiemy tutaj grupy ani bloku tekstu, jak w przypadku animacji ruchu, ale zwykły wielobarwny rysunek, który może składać się z kilku fragmentów. Co więcej, ilość takich fragmentów na początku i na końcu animacji może być różna.
W procesie animacji kształtu rysunek może rozpaść się na kilka niezależnych fragmentów, z których każdy stopniowo przekształca się w coś nieoczekiwanego. Lub odwrotnie, kilka niezależnych obrazów znajdujących się w obszarze roboczym, w trakcie animacji, stopniowo zmieniając swój wygląd (rozmiar, kolor, kształt), staje się częścią jednego obrazu. Powiedzmy, że chcesz, aby kwadrat płynnie zamienił się w okrąg lub sylwetka królika płynnie wlewała się w sylwetkę wilka. W takich przypadkach używana jest animacja kształtu.
Jak zwykle ustawiasz dwie klatki kluczowe w pewnej odległości od siebie. Ta opcja animacji ma sztywne ograniczenie: animacja musi zajmować oddzielną warstwę i być pojedynczym narysowanym kształtem (nie może być żadnych grup ani symboli). Po dwóch klatkach kluczowych musisz aktywować pierwszą (po prostu do niej przejść) i wybrać Frame w ramce (Windows-\u003e Panels-\u003e Frame,
Korzystając z animacji kształtu, należy ustawić dwa parametry:
- Łagodzenie ustawia odwrotne przyspieszenie wykładnicze. Wartość tego parametru może wahać się od -100 do + 100. Oznacza to, że jeśli określisz ujemne luzowanie, ruch będzie odbywał się z dodatnim przyspieszeniem, prędkość wzrośnie. I odwrotnie, jeśli łagodzenie jest pozytywne, animacja zwolni;
- Parametr Blend określa algorytm przejścia:
- Dystrybucja - wygładza przejście z jednego kształtu do drugiego.
- Kątowy (kanciasty) - stara się zachować proporcje rogów.
Ostatnim narzędziem w animacji animacji kształtów są wskazówki kształtu (dosłownie wskazówki dotyczące kształtów). To są punkty, dzięki którym pomagasz Flashowi poprawnie wykonać przejście. Nie da się bez nich obejść w przypadku skomplikowanych kształtów. Są bardzo łatwe w użyciu. W pierwszej klatce kluczowej (od której zaczyna się animacja) dodajesz punkt kontrolny (Modyfikuj-\u003e Przekształć-\u003e Dodaj wskazówkę dotyczącą kształtu, Możesz usunąć wszystkie punkty za pomocą Modyfikuj-\u003e Przekształć-\u003e Usuń wszystkie wskazówki. Aby usunąć pojedynczy punkt, możesz kliknąć go prawym przyciskiem myszy i wybrać Usuń wskazówkę z menu kontekstowego. Ponieważ punkty kontrolne są oznaczone literami alfabetu łacińskiego, może być ich maksymalnie 27. Istnieje wiele opcji przejścia z jednej formy do drugiej, więc animacja może podążać ścieżką, która w mniejszym stopniu Ci odpowiada. Nawet przekształcenie tak prostej figury geometrycznej, jak prostokąt położony pionowo w ten sam prostokąt, ale położony poziomo, może nastąpić na różne sposoby. Na przykład w procesie takiej transformacji figura może mieć kształt owalu lub nawet koła. Aby sterować procesem animacji, należy spróbować uprościć animację, dzieląc rysunki na kilka niezależnych fragmentów znajdujących się na różnych warstwach, ale jednocześnie uczestniczących w animacji. Bardziej skoordynowaną techniką jest użycie wspomnianych powyżej znaków kształtu. Jeśli chcesz wyłączyć animację kształtu, w panelu Klatka wybierz opcję Animacja: brak. Poniżej znajduje się przykład tej metody animacji „zamiany” słonia w owcę iz powrotem. Spróbuj stworzyć animację przedstawiającą kształt „przemiany” węża w orła iz powrotem: Często w procesie animacji konieczne jest, aby obiekt nie poruszał się po linii prostej, ale po zadanej trajektorii. W tym przypadku animacja jest tworzona w zwykły sposób, a trajektoria rysowana jest na osobnej warstwie. Warstwa ścieżek może obsługiwać kilka różnych animacji, z których każda znajduje się na osobnej warstwie, ale wszystkie te warstwy z animacją muszą znajdować się pod warstwą ścieżek. Możesz użyć różnych narzędzi do narysowania ścieżki: Ołówek, Pędzel, Pióro, Elipsa lub Prostokąt. Aby powiązać poruszający się obiekt z tą ścieżką, wystarczy przenieść ten element na ścieżkę w początkowej i końcowej klatce kluczowej animacji. W takim przypadku w panelu Właściwości należy dostosować parametry animacji, tak aby pole wyboru Przyciągaj było zaznaczone. Aby to zrobić, musisz najpierw zaznaczyć pierwszą klatkę kluczową animacji, przydatne jest również wybranie polecenia Widok / Przyciągaj do obiektów. Na przykład utwórzmy film „Motyl lecący nad kwiatem” zgodnie z poniższym algorytmem: Warstwa ta ma za zadanie zakryć i uczynić niewidoczną część obrazu znajdującego się bezpośrednio pod nią. Jeśli maska \u200b\u200bwarstwy nie zawiera żadnego obrazu, to całkowicie zakrywa (maskuje) warstwę poniżej i skojarzoną z nią, co nazywa się warstwa maskująca... Jeśli coś jest narysowane w masce warstwy, każde wypełnienie tego rysunku staje się przezroczystą częścią warstwy. Jeśli animujesz obraz utworzony w masce warstwy, przezroczysta część maski przesunie się po ekranie. Maska warstwy może maskować wiele warstw. Możesz uczynić zwykłą warstwę maskowalną, zmieniając jej pozycję w stosie warstw. Wystarczy przesunąć myszką zwykłą warstwę pod maskę warstwy. Animacja w tym przypadku może być dwojakiego rodzaju. Lub animacja obiektów umieszczonych na zamaskowanych warstwach. Lub animacja obrazu na masce warstwy. Przykład tworzenia efektu zanikania na ekranie litera po literze. Aby to zrobić, animujemy ruch obrazu w warstwie maski przy użyciu następującego algorytmu: Poniżej znajduje się plik animowany gif, który wykorzystuje animację kształtu liter tekstu „Szczęśliwego Nowego Roku”, a następnie tekst, który się pojawia, jest „wymazywany” za pomocą maski warstwy, prostokąta z wypełnieniem gradientowym, dzięki czemu uzyskuje się efekt „opalizacji” liter. Tło to kawałek grafiki bitmapowej. Poniższy przykład ilustruje słowo „wyrasta” z punktu, w którym zaimportowana grafika bitmapowa jest używana jako warstwa maski, aw masce warstwy tworzona jest animacja, w której słowo wyrasta z punktu, a następnie ponownie się zmniejsza. W tym przykładzie zastosowano również animację kształtu. Przycisk to specjalny rodzaj symbolu, który ma reagować na działania użytkownika, na przykład naciśnięcie samego przycisku, jego odpowiednika na klawiaturze lub aktywnego obszaru w filmie. Oś czasu przycisku zawiera następujące cztery klatki: Jeśli potrzebujesz stworzyć kilka identycznych przycisków, to w tym przypadku wystarczy utworzyć tylko jeden przykładowy przycisk. A następnie nałóż na niego niezbędne napisy, zmień kolor lub rozmiar. Jeśli przycisk ma zawierać animowane obiekty, musisz wcześniej utworzyć klipy filmowe, a następnie po prostu umieścić je w odpowiedniej ramce przycisku. Jako przykład stwórzmy przycisk z wbudowaną animacją przy użyciu następującego algorytmu: Ten obiekt został opublikowany w trybie HTML ze wskazaniem odpowiedniego pliku swf. Utwórzmy przyciski, które kontrolują działanie pokazu slajdów: On (release) ( GotoAndStop (k); - liczba w nawiasach oznacza numer odpowiedniej ramki. Włącz (naciśnij) ( GotoAndStop ("begin)"; Włącz (naciśnij) ( Root.prevFrame (); Włącz (naciśnij) ( Root.nextFrame (); Włącz (naciśnij) ( GotoAndStop ("koniec"); Poniżej efekt naszej pracy: Podczas tworzenia animacji w języku ActionScript często używana jest pętla z trzema klatkami. W pierwszej klatce (przygotowanie) zapisywane są dane początkowe, w drugiej umieszczane są elementy korpusu pętli, aw trzeciej ramce napisane jest polecenie powrotu do drugiej klatki gotoAndPlay (2);. Praca cyklu trójklatkowego polega na naprzemiennym oglądaniu klatek uczestniczących w cyklu, aż do spełnienia warunku wyjścia z cyklu. Rozważmy użycie pętli z trzema klatkami na przykładzie tworzenia ruchu maski. Nasz film będzie miał trzy warstwy: <маскируемый клип>.setMask (<клип-маска>) Za każdym razem, gdy uzyskuje się dostęp do drugiej klatki, klip maski obraca się o 2 °. Przed oczami użytkownika obraca się okno w postaci klipu Masked, przez które widoczna jest część klipu Masked. Nauczmy się, jak kontrolować kolor instancji klipu bibliotecznego. Stwórzmy film, w którym gwiazdy obracają się w różnych kierunkach na tle wschodzącego słońca, zmieniając swój kolor. Obiekt Color jest tworzony przy użyciu konstruktora ActionScript i ma następujący format: <имя экземпляра объекта Color> \u003d nowy kolor (<имя экземпляра клипа>) OnClipEvent (ładowanie) ( Star1Color \u003d new Color (this); ColorTransform \u003d (rb: 0, gb: 255, bb: 255); G \u003d 255; B \u003d 255; Krok \u003d 5; OnClipEvent (enterFrame) ( G - \u003d krok; ColorTransform.gb \u003d g; Jeśli (r\u003e \u003d 0 && b \u003d\u003d 255 && g \u003d\u003d 0) ( R + \u003d krok; ColorTransform.rb \u003d r; Jeśli (g \u003d\u003d 0 && r \u003d\u003d 255 && b B - \u003d krok; ColorTransform.bb \u003d b; Jeśli (b \u003d\u003d 0 && r \u003d\u003d 255 && g\u003e \u003d 0) ( G + \u003d krok; ColorTransform.gb \u003d g; Jeśli (g \u003d\u003d 255 && b \u003d\u003d 0 && r R - \u003d krok; ColorTransform.rb \u003d r; Jeśli (r \u003d\u003d 0 && g \u003d\u003d 255 && b\u003e \u003d 0) ( B + \u003d krok; ColorTransform.bb \u003d b; Star1Color.setTransform (colorTransform); This._rotation - \u003d 3; Przyciski i menu to jedne z najważniejszych części witryny internetowej i każdej innej aplikacji, w której ważna jest interaktywność. Stwórzmy menu Flash. on (release) (getURL ("1.html", "_self");) Grafika kształtów zyskuje na popularności od kilku lat. Jednak za wielką popularnością kryje się żmudna praca nad animacją każdego elementu na scenie. Jeśli nigdy wcześniej nie robiłeś animacji kształtu, teraz jest na to czas! Wybraliśmy 30, które pomogą Ci opanować zasadę animacji kształtu, a także nauczy Cię, jak tworzyć i eksportować ilustracje wektorowe nadające się do dalszej animacji.
Podczas korzystania z animacji kształtu można modyfikować następujące parametry kształtu:
Warstwa przewodnika i warstwa ścieżek
Warstwa maskująca i maska \u200b\u200bwarstwy
Tworzenie przycisków
Podstawowe rodzaje działań:
Algorytm tworzenia przycisku (alg1):
Algorytm tworzenia przycisku umożliwiającego przejście do określonej strony internetowej:
Algorytm tworzenia przycisku zatrzymującego klip:
Skrypty w języku ActionScript
Animação Feliz de Shapes com Textos
Animacja sekwencji - samouczek Adobe After Effects
Shape Layer Repeater (radialny) - samouczek Adobe After Effects
Tutorial - Szybkie porady 03 - Kręgi 2D i przerywany obrys
Animowanie sceny infograficznej Epizod 1 After Effects
Samouczek Godzina dla Ziemi Po efektach
Tworzenie animowanych wzorów przy użyciu Repeater warstw kształtów w programie After Effects
Summit 1.2 - Wprowadzenie do ruchomej grafiki - After Effects
Jak importować i animować plik wektorowy w programie After Effects
Przedstawiamy Ancor Point. Animacja dłoni
Jak tworzyć koła zębate?
Przejście kształtu wycieraczki promieniowej
Odliczanie i odliczanie w Adobe After Effects
Praca ze skryptem Lines Creator
Kręgi są dla nas wszystkim! Lekcja 1. Utwórz wprowadzenie
Kręgi są dla nas wszystkim! Lekcja 2. Zapętlenie kształtów
Kręgi są dla nas wszystkim! Lekcja 3. Dopasowywanie kolorów w Adobe Kuler
Kręgi są dla nas wszystkim! Lekcja 4. Praca z myślnikami
Efekt pływających okręgów
Animowanie kształtów
Tworzenie prostego wideo kształtów
Tworzenie animowanej ikony kształtu
Tworzenie prostego wprowadzenia do kształtu
Spektakularna animacja kształtu smartfona
Oszałamiająca animacja kształtu
Tworzenie prostej zmiany kształtu
Kształty! Tworzenie animowanych wzorów za pomocą powtarzacza warstw kształtów
Stylowa animacja kształtu
Jak zrobić animowany baner w kształcie
Co to jest animacja. Oś czasu. Klatki kluczowe. Operacje na ramkach. Rodzaje animacji. Animacja klatka po klatce. Animacja ruchu. Animacja kształtu. Animacja z wykorzystaniem efektów osi czasu
Animacja to iluzja ruchu stworzona przez serię sekwencyjnych nieruchomych obrazów, które nieznacznie się od siebie różnią. Już w renesansie zauważono, że gdy obrazy szybko się zmieniają, powstaje efekt ruchu.
Aby utworzyć animację, użyj osi czasu ( Oś czasu), na którym znajdują się wszystkie klatki, a także „głowica odtwarzania klatek” - mały wypełniony prostokąt w obszarze osi czasu z numerami klatek (patrz. ryż... 1). Podczas odtwarzania filmu głowa porusza się automatycznie.
Ramki mogą być kluczowe i statyczne. Klatki kluczowe zwykle zawierają obraz (definiują treść filmu). Takie ramki są zaznaczone czarnymi kółkami 1. Reszta klatek jest statyczna (są odtwarzane „na próżno”).
Ryż. 1
Ustawienie osi czasu odbywa się za pomocą przycisku, który ma następujące tryby:
- Malutki (Bardzo mały);
- Mały (Mało);
- Normalna (Normalna);
- Średni (Środkowy);
- Duży (Duży).
Na ramkach można wykonywać różne operacje (kopiowanie, usuwanie itp.). W przypadku operacji z oddzielną ramką wystarczy najpierw kliknąć na nią myszą, kilkoma kolejnymi ramkami - należy je zaznaczyć klikając najpierw na pierwszą z nich, a następnie z wciśniętym klawiszem na ostatnią.
Możesz stworzyć ramkę kluczową używając klawisza funkcyjnego F6 lub korzystając z menu głównego - komendy Wstawić - Oś czasu - KeyFrame (Wstaw - Oś czasu - Klatka kluczowa).
Aby usunąć ramkę (ramki), po jej zaznaczeniu (ich) należy wybrać element w menu kontekstowym Usuń ramki(Usuń ramki) lub wykonaj polecenia menu głównego Edytować - Oś czasu - Usuń ramki (Edycja - Oś czasu - Usuń klatki).
Aby przenieść klatki, można je przesuwać za pomocą myszy, jak pokazano na ryż. 2.
Ryż. 2
Kopiowanie ramek odbywa się za pomocą kontekstu (ust Kopiuj ramki (Kopiuj ramki)) lub menu główne ( Edytować - Oś czasu - Kopiuj ramki (Edycja - Oś czasu - Kopiuj klatki)). Skopiowana ramka (skopiowane klatki) jest wklejana w ten sam sposób za pomocą polecenia Wklej ramki (Wstaw ramki). Oczywiście musisz określić punkt wstawiania na osi czasu.
Aby wstawić statyczną i pustą klatkę kluczową, użyj odpowiednio klawiszy i klawiszy funkcyjnych.
Domyślnie animacja pojawia się wraz ze wzrostem liczby klatek. Aby odwrócić kierunek animacji, zaznacz klatki i wybierz element Odwróć klatki (Odwróć klatki). Możesz także użyć poleceń menu głównego Modyfikować - Oś czasu - Odwróć klatki (Zmień - Oś czasu - Odwróć klatki).
Rodzaje animacji
W Macromedia Flash możliwe są następujące typy animacji:
Animacja klatka po klatce;
Animacja ruchu ( Animacja ruchu);
Animacja kształtu ( Kształt);
Animacja z wykorzystaniem efektów osi czasu.
Rozważmy każdy rodzaj animacji osobno.
Animacja klatka po klatce
Animacja klatka po klatce jest implementowana przy użyciu serii kolejnych klatek kluczowych, z których każda musi być utworzona „ręcznie” ( ryż. 3).
Ryż. 3
Animacja ruchu (Animacja ruchu )
Dzięki tej animacji obiekt przemieszcza się z jednego miejsca do drugiego. Aby go utworzyć, wystarczy określić początkowe i końcowe klatki kluczowe, wszystkie klatki pośrednie zostaną automatycznie określone przez program. Przyjrzyjmy się bliżej technologii tworzenia takiej animacji.
Narysujmy okrąg na obszarze roboczym, na osi czasu pierwsza klatka automatycznie stanie się kluczową.
Kliknij prawym przyciskiem myszy klatkę kluczową i wybierz polecenie menu kontekstowego Utwórz animację ruchu (Utworzyć animację ruchu). Wokół koła tworzy się niebieska obwódka, co oznacza, że \u200b\u200bobiekt jest zgrupowany. Następnie zaznaczamy na osi czasu np. 30 klatkę (określamy czas trwania filmu) i przy wciśniętym prawym klawiszu myszy wybieramy komendę Wstawić - KeyFrame (Wstaw klatkę kluczową) - na osi czasu pojawia się pozioma linia ze strzałką na końcu, co oznacza, że \u200b\u200bruch został utworzony. Ramki pośrednie są automatycznie zabarwione na niebiesko.
Korzystanie z panelu Nieruchomości (Właściwości) możesz także ustawić dodatkowe parametry animacji:
- Obracać się (Rotation) określa kierunek obrotów - zgodnie z ruchem wskazówek zegara ( CW) lub przeciwko ( CWW) lub w ogóle brak rotacji ( Żaden). Możliwa jest również wartość Auto (obiekt jest obracany raz w kierunku obrotu o najmniejszy kąt);
- Łatwo (Zwolnij); jeśli wartość parametru jest dodatnia, to ruch podczas animacji zostanie spowolniony, jeśli ujemny - przyspieszony;
- Orientacja na ścieżkę (Orientacja względem ścieżki) pozwala zorientować ruch obiektu względem danej trajektorii i innych.
Animacja kształtu (Kształt twee n)
Animacja kształtu pozwala płynnie przekształcić jeden obiekt w inny. Można ją zastosować tylko do niezgrupowanych obiektów. Aby zmienić kształt wielu obiektów, umieść je na tej samej warstwie. Rozważmy wszystko na przykładzie.
Narysujmy kółko na pulpicie, wybierz długość filmu na 30 klatkach, w tym celu klikamy na 30 klatkę, wracamy do pierwszej klatki kluczowej i na panelu Nieruchomości (Właściwości) na liście animacji wybierz tryb Kształt (Kształt), pojawi się pozioma linia ze strzałką na końcu, klatki pośrednie zmienią kolor na zielony, co oznacza, że \u200b\u200bzostała utworzona animacja kształtu, w ostatniej klatce kluczowej narysujemy kwadrat zamiast koła.
Przetestujmy film i zobaczmy, jak okrąg płynnie zamienia się w kwadrat. Aby wskazać na specyfikę zmiany kształtu (przepełnienie punktów jednego obiektu na punkty drugiego) konieczne jest utworzenie tzw. etykiety podpowiedzi... Poznamy je później na konkretnym przykładzie.
Animacja z wykorzystaniem efektów osi czasu
W wersji Macromedia Flash MX 2004 możesz tworzyć animacje przy użyciu wbudowanych efektów. Efekty można zastosować do tekstu, kształtów, grup, grafiki, map bitowych i przycisków. Można ich używać również do klipów, ale w tym przypadku efekt jest osadzony w klipie.
Aby zastosować efekt, wybierz obiekt i wykonaj polecenie Wstawić - Efekty osi czasu (Wstaw - Efekty osi czasu); następnie wybierz rodzaj efektu: Asystenci (Pomocnicy) Efekty (Efekty), Przejście - Przekształcać (Przejście - przemiana). Efekty grupowe Asystenci nie są animowane. Po prostu albo tworzą duplikaty danego obiektu i umieszczają je w pewnej odległości od siebie, albo tworzą równomierne połączenie obiektu z jego duplikatem.
Po wybraniu efektu pojawia się okno dialogowe, w którym można ustawić parametry jego manifestacji.
Podczas tworzenia efektu automatycznie tworzona jest warstwa, na którą przenoszony jest obiekt (nazwa warstwy jest taka sama, jak nazwa efektu). Na podstawie obiektu tworzony jest symbol graficzny, który jest zapisywany w bibliotece w folderze Efekty (Efekty).
Część praktyczna
1. Projekt „Moving Man”.
2. Projekt „Ruch po zamkniętej krzywej”.
3. Projekt „Zamiana postaci w literę”.
1. Projekt „Moving Man”
Stwórzmy film, w którym animacja ruchu ( Animacja ruchu) mężczyzna się poruszy.
Przed stworzeniem projektu trzeba dobrze wiedzieć, z jakich elementów będzie składał się „bohater naszego filmu”. W końcu każdy szczegół musi się poruszać podczas odtwarzania filmu. Trzeba też przemyśleć taki moment - które elementy powinny być na pierwszym planie, a które na drugim planie. Aby uzyskać bardziej wizualną reprezentację, zaleca się najpierw narysować rysunek na kartce papieru.
Więc niech nasz mały człowiek wygląda jak dalej ryż. 4.
Ryż. 4
Taki obraz można uzyskać z najprostszych kształtów - kół, elips i prostokątów.
Zacznijmy rysować. Narysujmy całą osobę na jednej warstwie, a następnie rozłóżmy poszczególne części na warstwach, w programie jest taka możliwość. Najpierw narysuj głowę (kółko) i polecenie Modyfikować - Konwertuj na symbol (Zmień - Konwertuj na znak) przekonwertuj go na znak, pobierając typ ( Zachowanie) postać Klip filmowy (Symbol klipu); nazwijmy ten symbol głowa.
Następnie stworzymy obiekt, który posłuży jako „ciało”. Wykonajmy polecenie Wstawić - Nowy symbol (Wstaw - nowy symbol) i ustaw parametry jak w ryż... 5. Po kliknięciu przycisku dobrze wchodzimy w tryb edycji symboli, rysujemy prostokąt (patrz. ryż... 6a). Upewnij się, że środek każdego rysowanego obiektu w trybie edycji pokrywa się z punktem odniesienia, który jest oznaczony znakiem „+”.
Ryż. 5
Utworzony symbol trafia do biblioteki filmów. Podejdź do sceny i przeciągnij ją do obszaru roboczego.
Następnie w ten sam sposób tworzymy „udo” (uwaga - prostokąt rysowany jest z zaokrąglonymi rogami) i kopiując otrzymujemy drugi taki sam element ( ryż... 6b). Dostajemy również dwie golenie i wreszcie buty (patrz. ryż... 4). Nadamy nazwy wszystkim symbolom zgodnie z ryż. 8.
Rezultatem jest mały człowiek! Nie martw się o piękno i wiarygodność rysunku, najważniejsze jest dla nas zrozumienie idei animacji i przełożenie jej na film.
Ryż. 6
Więc mały człowieczek znajduje się w pierwszej klatce kluczowej na jednej warstwie. Rozłóż wszystkie kształty, które tworzą na warstwach - w tym celu uruchamiamy polecenie Modyfikować - Oś czasu - Rozłóż na warstwy(Zmień - Oś czasu - Rozłóż na warstwy) - patrz ryż. 7.
Ryż. 7
W wyniku wykonania tego polecenia warstwy powinny zostać ustawione tak, jak pokazano na ryż. 8.
Ryż. 8
Zróbmy tło naszego filmu jako dolną warstwę. Wybierz dla niego rysunek według własnego uznania.
Następnie musisz zdecydować o długości filmu i wskazać te klatki, które będą pokazywać różne pozycje osoby w ruchu. Aby to zrobić, wybierz następujące klatki: 5., 9., 13. i 17.. Oznacza to, że długość filmu wyniesie 17 klatek, a nazwane klatki powinny być ustawione jako kluczowe (używając klawisza funkcyjnego F6 we wszystkich warstwach oprócz tło.
Zobaczmy teraz, jak powinny wyglądać te klatki kluczowe. W pierwszej klatce obraz powinien być taki sam jak na ryc. 4, w 5 - jak dalej ryż... 9a, w 9 - jak dalej ryż... 9b, w 13. - jak w ryż... 9c i 17 - jak dalej ryż... 9d.
a B C D)
Ryż. 9
Wskazane jest lekkie uniesienie w 5. i 13. klatce warstw "ciała" i "głowy", aby ruch był bardziej realistyczny. Może być konieczne poprawienie niektórych ramek.
Następnie stworzymy animację ruchu w klatkach kluczowych. W tym celu kliknij prawym przyciskiem myszy klatkę kluczową i wybierz polecenie Stwórz - Animacja ruchu (Utworzyć animację ruchu). W rezultacie oś czasu przyjmie formę pokazaną na ryż. 10.
Ryż. 10
Film jest gotowy i można go przetestować.
2. Projekt „Obrót satelity wokół Ziemi”
Przedstawiamy model Ziemi z satelitą na orbicie w formie pokazanej na ryż. 11.
Ryż. 11
Opiszmy główne etapy tworzenia projektu wykorzystującego animację ruchu.
1. Korzystanie z panelu Mix kolorówr (Mikser kolorów) ustaw wypełnienie promieniowe, wybierając dwa kolory na skali gradientu: zielony i brązowy.
2. Narysuj okrąg bez konturu, z wypełnieniem wybranym w etapie 1, który posłuży jako „Ziemia”. Warstwa nazywa się planeta (ryż. 12).
Ryż. 12
3. Utwórz tło (najniższą warstwę), na którym możesz wykonać dowolne zdjęcie symulujące niebo.
4. Rysuj (za pomocą narzędzia Owalny) trajektoria orbity w postaci elipsy dowolnego koloru bez wypełnienia, tj. pasek narzędzi zarządzania kolorami ( Zabarwienie) będzie wyglądać tak ryż. 13.
Ryż. 13
5. Aby obrócić trajektorię o 45 °, konieczne jest zgrupowanie jej, ponieważ gdy regiony się przecinają, figura jest dzielona na części. Wybieraj poszczególne części trajektorii za pomocą myszy, trzymając wciśnięty klawisz. Aby je zgrupować, wybierz polecenie Modyfikować - Grupa (Edycja - Grupa) - pojawiła się niebieska ramka. Obróć zgrupowany obiekt o 45 ° (patrz. ryż... jedenaście). Aby to zrobić, możesz użyć panelu Przekształcać (Transformacja) wykonując polecenie Okno - Panele projektowe - Przekształcać (Okno - Panele projektowe - Transformacja) i wpisując w polu Obracać się Wartość kąta (Obróć) –30 ° ( ryż. 14).
6. Następnie ponownie podzielimy trajektorię na oddzielne części za pomocą polecenia Modyfikować - Rozpadają się(Edycja - Podziel). Aby zasymulować ruch po zamkniętej ścieżce, należy określić punkt początkowy i koniec ruchu. Aby to zrobić, narysuj kolejną elipsę o mniejszym rozmiarze i nałóż ją na orbitę ( ryż... 15). Obszar utworzony na przecięciu dwóch elips jest usuwany za pomocą klucza.
Ryż. 15
7. Za pomocą narzędzia i klawisza zaznacz niepotrzebne części małej elipsy i usuń je. Tak więc mamy trajektorię, która ma początek i koniec.
8. Wybierz najbliższą część trajektorii (patrz. ryż... 16), skopiuj go ( Edytować - Kopiuj) i wstaw w tym samym miejscu ( Edytować - Wklej na miejscu) na osobnej warstwie zwanej kawałkiem. Uczyń tę warstwę niewidoczną, klikając punkt pod ikoną w panelu warstw.
Ryż. 16
9. Zaznacz wszystkie części trajektorii i prawym przyciskiem myszy wybierz polecenie Skaleczenie (Wytnij) i umieść na osobnej warstwie z nazwą orbita w to samo miejsce ( Edytować - Wklej na miejscu).
10. Nad warstwą orbita utwórz warstwę o nazwie satelita... Stworzymy na nim obiekt satelitarny, który będzie klipem. Aby to zrobić, uruchom polecenie Wstawić - Nowy symbol(Wstaw - Nowy symbol), należy wskazać typ symbolu Klip filmowy (Klip) i podaj nazwę satelita... W trybie edycji narysuj okrąg bez konturu, wybierz wypełnienie i nie zapominaj, że środek obiektu pokrywa się z punktem rejestracji („+”), w przeciwnym razie satelita nie zostanie przywiązany do orbity.
11. Wróćmy na scenę, przenieś symbol satelita na polu roboczym i ustawić go w punkcie startowym na orbicie, skąd zacznie się poruszać, - ryż. 17.
Ryż. 17
12. Utwórzmy animację ruchu satelity, w tym celu klikamy prawym przyciskiem myszy klatkę kluczową na warstwie satelita iw menu kontekstowym wybierz element Stwórz - Animacja ruchu (Utwórz - Animacja ruchu), przejdźmy np. Do 40. klatki iw tym samym menu wybierz polecenie Wstawić - Klatka kluczowa (Wstaw - klatka kluczowa). Pojawi się pozioma strzałka wskazująca, że \u200b\u200banimacja jest tworzona. W ostatniej klatce kluczowej przesuń satelitę do punktu końcowego trajektorii i zmniejsz ją (patrz. ryż. 18).
Ryż. 18
13. Na wszystkich pozostałych warstwach utworzymy tę samą długość filmu, w tym celu wystarczy nacisnąć klawisz F6.
Jeśli teraz rozpoczniesz film, satelita „przesunie się” do ostatniego punktu najkrótszej ścieżki. Aby satelita poruszał się po całej trajektorii, utwórz nad warstwą satelita specjalna warstwa prowadząca ( Przewodnik) klikając ikonę ( Dodaj przewodnik ruchu) u dołu panelu Warstwy. I już na tej warstwie przeniesiemy klatki z warstwy orbity.
Sekwencja warstw folii na osi czasu jest pokazana na ryż. 19.
Ryż. 19
Przetestujmy film (naciskając kombinację klawiszy +), a następnie dopracujmy go.
14. Zakryjmy satelitę podczas przechodzenia wzdłuż odpowiedniej części orbity. Aby to zrobić, musisz utworzyć co najmniej cztery warstwy satelita nowe klatki kluczowe (np. 21, 25, 27 i 29 - rys. 20) i zmienić przezroczystość satelity w panelu Nieruchomości (Właściwości), wybierając z listy Kolor Wartość (Kolor)
Alpha (patrz. ryż... 21) i ustawiając wartość przezroczystości we wskazanych ramkach odpowiednio 68, 57, 28 i 9%.
Ryż. 21
15. Aby ukryć niewidzialną część orbity, należy zamienić warstwy planety (musi być wyższa) i orbita... Warstwa prowadząca Przewodnik powinna być niewidoczna, a warstwa kawałka przeciwnie powinna być widoczna, tj. na osi czasu będzie to wyglądać ryż... 22-23. Konieczna jest zmiana koloru odcinka orbitalnego na warstwie elementu (analogicznie jak na str. 7).
Ryż. 22
Ryż. 23
16. Poprawmy naszą „planetę”. Tymczasowo ukryj wszystkie warstwy z wyjątkiem warstwy planeta... Wybierzmy narzędzie
pasek narzędzi Narzędzia. Pozwala na zmianę wypełnienia.
Kliknij pierwszą klatkę kluczową warstwy. planeta, a następnie wzdłuż „planety” - pojawi się okrąg ze znacznikami kontrolującymi gradient. „Zahacz” środkowy znacznik za pomocą myszy i przeciągnij gradient w dół po przekątnej, około 45 ° do punktu styczności z orbitą (patrz. ryż. 24).
Ryż. 24
Te same czynności należy wykonać w ostatniej klatce, tylko znajdujący się w niej gradient musi zostać „przeciągnięty” w górę (patrz. ryż. 25).
Ryż. 25
17. Pozostaje zaprojektować animację. Aby to zrobić, kliknij pierwszą klatkę kluczową warstwy. planeta i na panelu Nieruchomości (Właściwości) wymienione Tween (Animacja) wybierz Ruch (Ruch).
18. Testowanie filmu.
3. Projekt „Zamiana prostokąta na literę”
W tym projekcie prostokąt zamienia się w literę, tj. zostanie zastosowana animacja kształtu.
1. Na warstwie, którą nazwiemy prostokątnarysuj prostokąt bez konturu, a obok niego piszemy list np. mi (ryż. 26).
Ryż. 26
2. Podziel literę na części za pomocą polecenia Modyfikować - Rozpadają się(Edycja - Podziel).
3. Umieść literę na prostokącie, a następnie kliknij ikonę
na pasku narzędzi i rozciągnij literę do wysokości i szerokości prostokąta, jak pokazano na ryż. 27.
Ryż. 27
4. Nie anulując zaznaczenia, w menu kontekstowym wybierz polecenie Wytnij, a następnie umieść literę na osobnej warstwie poleceniem Edytować- Wklej na miejscu (Edycja - wklej w tym samym miejscu).
5. Ukryj warstwę z literą, klikając kropkę pod ikoną.
6. Na osi czasu zaznacz na przykład 35. klatki w obu warstwach i ustaw je jako kluczowe (naciskając klawisz F6).
7. Zaznacz pierwszą klatkę kluczową warstwy literowej, skopiuj ją, zaznaczając element Kopiuj ramki (Kopiuj klatki) i wklej ostatnią klatkę kluczową warstwy prostokąt na komendę Wklej ramki(Wstaw ramki). Tak się złożyło, że w pierwszej klatce kluczowej warstwy prostokąt rysowany jest prostokąt, aw ostatniej klatce kluczowej tej samej warstwy znajduje się litera. Warstwę z literą można teraz usunąć.
8. Teraz stwórzmy animację. Kliknij pierwszą klatkę kluczową i w panelu Nieruchomości (Właściwości) wymienione Tween (Animacja) wybierz Kształt (Formularz). Zostanie wyświetlona pozioma linia ze strzałką, a klatki będą zielonkawe, co oznacza, że \u200b\u200butworzono animację kształtu.
Konieczne jest wskazanie, w którym punkcie prostokąta ma zostać przesunięty punkt litery. Do tego są tzw etykiety podpowiedzi... Aby je ustawić, musisz zaznaczyć pierwszą klatkę kluczową i wykonać polecenie Modyfikować - Kształt - Dodaj wskazówkę dotyczącą kształtu(Modyfikuj - Formularz - Dodaj podpowiedź do formularza). Pojawia się czerwony znak z literą a ( ryż. 28).
Ryż. 28
Dodajmy jeszcze jedną etykietę - w tym celu kliknij prawym przyciskiem myszy istniejącą etykietę i wybierz polecenie Dodaj wskazówkę (Dodaj podpowiedź), odznacz, kliknij czerwoną etykietę (z literą b) i przeciągnij go myszą w prawy górny róg prostokąta (patrz. ryż. 29).
Następnie przejdźmy do ostatniej klatki kluczowej. Kliknijmy białe pole robocze i dopiero wtedy przesuńmy czerwony punkt w to samo miejsce w prawym górnym rogu litery mi.
Utwórzmy jeszcze dwie etykiety w ten sam sposób (patrz. ryż... 30) na prostokącie i wskaż ich miejsce na literze.
Ryż. 30
Przetestujmy film.
Uwaga... Możesz zaprosić uczniów do zapoznania się z efektami na osi czasu.
Możliwe są również „puste” klatki kluczowe. Są oznaczone otwartym kółkiem. - Około. wyd.
Metoda obliczania ram pośrednich ( z animacją kształtów) pozwala przekształcić jeden kształt w inny, zmieniając jednocześnie jego rozmiar, położenie i kolor. Podczas tworzenia animacji kształtów należy pamiętać, że program Flash nie może tego robić między grupami, znakami, polami tekstowymi i bitmapami.
Animacja kształtu umożliwia stworzenie efektu metamorfozy, w którym jeden kształt przekształca się w inny. Te zmiany są kontrolowane przez specjalne identyfikatory formularzy ( wskazówki dotyczące kształtu), które pozwalają na tworzenie złożonych zmian i przekształcanie poszczególnych części pierwotnego kształtu w nowe. Identyfikatory kształtów oznaczają poszczególne punkty kształtu przed i po zmianie jego kształtu. Każdy z nich oznaczony jest literą alfabetu łacińskiego, co pozwala ustawić do 26 identyfikatorów. W ten sposób można stworzyć zmianę w wyrazie rysowanych twarzy, przemianę jednych zwierząt w inne itp. W przypadku figur o skomplikowanych kształtach pożądane jest ustawienie stanów pośrednich w postaci dodatkowych klatek kluczowych, które pozwolą kontrolować fazy transformacji. Najlepiej jest umieścić wszystkie animowane kształty na osobnych warstwach, chociaż możesz animować jednocześnie na warstwie zawierającej kilka kształtów jednocześnie.
Figa. 4.15... Transformacja formularza: automatyczna iz wykorzystaniem identyfikatorów
Aby zastosować animację kształtu ( z animacją kształtów) na grupy, symbole, bloki tekstowe i mapy bitowe, należy je najpierw przekonwertować za pomocą polecenia Zmień ›Rozłącz (Zmień ›Podziel na części). To polecenie przerywa połączenie między instancją a symbolem, przekształcając instancję w zestaw niepowiązanych ze sobą linii i kształtów, dzięki czemu można je modyfikować bez wpływu na inne instancje. Późniejsze zmiany symbolu również nie wpłyną na to wystąpienie.
Rozważmy kolejność działań podczas tworzenia animacji formularza:
- Wybierz warstwę i pustą klatkę kluczową, od której rozpocznie się animacja.
- Utwórz obiekt dla pierwszej klatki sekwencji za pomocą dowolnego narzędzia do malowania.
- Wybierz wymaganą końcową klatkę sekwencji i przekształć ją w klatkę kluczową.
- Utwórz nowy obiekt w tej ramce, do którego oryginalny obiekt powinien zostać przekształcony.
- Wykonajmy polecenie Okno ›Panele› Ramka (Okno ›Panele› Ramka), aby otworzyć panel Rama (Rama).
- Z listy rozwijanej Animacja (Obliczenie) wybierz wartość Kształt (Formularz).
- Ustawmy wartość Łagodzenie (Gładkość) w zakresie od -100 do 100, określających szybkość zmian w czasie. Wartości ujemne odpowiadają powolnym zmianom na początku i szybkim na końcu. Pozytywny - szybko na początku i zwalniający pod koniec animacji. Domyślnie prędkość jest stała. Regulacja odbywa się za pomocą suwaka, który otwiera się po kliknięciu strzałki.
- Upuścić Mieszanka (Przejście) wybierz wartość Dystrybucyjny (Rozproszone) - dla gładkich pośrednich kształtów lub znaczenia Kątowy (Sharp) - do zachowania ostrych kątów i prostych linii w pośrednich kształtach. Ta ostatnia wartość dotyczy tylko kształtów z ostrymi narożnikami i prostymi liniami, w przeciwnym razie wartość zostanie ustawiona automatycznie Dystrybucyjny (Rozpowszechniane).
Figa. 4.16... Ustawianie opcji animacji kształtu
Aby kontrolować złożone przekształcenia formularzy, użyj identyfikatorów formularzy ( wskazówki dotyczące kształtu). Określają punkty, które w pierwotnym i ostatecznym kształcie muszą sobie odpowiadać.
Identyfikatory formularzy ( wskazówki dotyczące kształtu) oznaczone literą łacińską są wyświetlane na żółto na początku i na zielono na końcowych klatkach kluczowych. Czerwony kolor identyfikatora oznacza, że \u200b\u200bnie znajduje się on na krzywej i nie może uczestniczyć w transformacji. Podczas korzystania z identyfikatorów formularzy należy przestrzegać kilku zasad:
- Identyfikatory są umieszczane na kształcie w określonej kolejności, na przykład w kierunku przeciwnym do ruchu wskazówek zegara, począwszy od lewego górnego rogu obiektu.
- Kolejność identyfikatorów musi zostać zachowana zarówno w początkowej pozycji figury, jak iw pozycji końcowej, aby ich logiczna sekwencja nie została naruszona (na przykład, jeśli pierwsza klatka kluczowa ma abc, następna nie powinna mieć acb).
- W przypadku złożonych kształtów tworzone są dodatkowe klatki kluczowe, które definiują etapy stanu kształtu, wraz z obliczaniem klatek pośrednich między nimi.
