Załącznik 22z

Ćwiczenia dla ucznia. Temat lekcji: Transformacje i tekst w programie Flash 8.

Aby używać transformacji numerycznych, trzeba koniecznie zapamiętać parametry głównego

układu współrzędnych we Flashu. Środek tego układu znajduje się zawsze w lewym górnym

rogu obszaru roboczego. Wartości na osi poziomej (X) zwiększają się w prawo, a na osi

pionowej (Y) zwiększają się w dół. Wartości w układzie współrzędnych Flasha są określane

w pikselach, a wielkość piksela jest wyznaczona przez rozmiar obszaru roboczego w danej

scenie.

Ćwiczenie 1

Do wykonania tego ćwiczenia możesz wykorzystać jabłko, które narysowałeś

w poprzednim ćwiczeniu za pomocą pióra.

• Włącz narzędzie Selection. Kliknij w dowolnym miejscu konturu jabłka

i przeciągnij kursorem. Spróbuj pociągnąć za ostre wierzchołki i za środki

prostych odcinków.

• Zaznacz całe zdeformowane jabłko - zakreśl kursorem (z wciśniętym

lewym przyciskiem myszy) prostokątną ramkę. Ten sam efekt osiągniesz,

klikając podwójnie na czerwonym wypełnieniu.

• Umieść kursor w dowolnym miejscu nad jabłkiem i przeciągnij. Spróbuj

przesunąć kształt poziomo albo pionowo, aby uaktywnić automatyczne

przyciąganie.

• Przytrzymaj klawisz Shift i spróbuj przeciągnąć jabłko w dowolnym

kierunku.

Wiesz już, w jaki sposób przy użyciu Selection Tool można zaznaczyć pojedynczy

kształt (kliknięcie) lub wiele obiektów (zakreślenie ramki). Czasami jednak te

techniki nie wystarczają i jesteśmy zmuszeni do zastosowania Lasso Tool

(pozwala ustawić zaznaczenie o dowolnym kształcie). Możemy też połączyć kilka

metod i stopniowo dołączać do zaznaczenia kolejne kształty.

• Zakreślając ramkę, zaznacz część jabłka z lewej strony.

• Przytrzymaj klawisz Shift i dołącz do zaznaczenia kawałek jabłka z prawej

strony (możesz zakreślić ramkę, ale obejmującą tylko część jabłka).

• Na panelu Properties zmień kolor wypełnienia na żółty.

Ćwiczenie 2

Aby wykonać to ćwiczenie, pozbądź się jabłka (które już dawno przestało

przypominać owoc) i pozostaw pustą scenę.

Piotr Chojnacki

1

• Narysuj na scenie kilka oddzielnych prostokątów różniących się kształtem

i wielkością.

• Wyświetl panel edycyjny Align (wyrównanie); możesz wykorzystać

polecenie Window/Align z górnego menu programu.

• Zaznacz wszystkie kształty. Naciśnij przycisk Align vertical center na

panelu Align.

Jak widać, polecenie Align vertical center układa wszystkie zaznaczone

obiekty tak, aby ich geometryczne środki miały tę samą wartość położenia na

osi Y - czyli po prostu ustawia je na tej samej wysokości. Przyciski na panelu

Align mają dość czytelne, graficzne oznaczenia, więc zapamiętanie znaczenia

poszczególnych funkcji nie powinno nikomu sprawić trudności.

• Kliknij na ikonę przycisku Space evenly horizontally z grupy Space, aby

jeszcze raz wyrównać prostokąty. Tym razem położenie prostokątów

zmieni się w taki sposób, że odstępy pomiędzy kolejnymi kształtami będą

takie same.

• Włącz opcję To stage, która sprawia, że kształty są wyrównywane

względem obszaru roboczego, a następnie naciśnij przycisk Align bottom

edge.

Prostokąty zostaną ułożone tak, jakby ktoś je postawił na dolnej krawędzi obszaru

roboczego. Bez włączenia opcji To stage efekt byłby podobny, ale wtedy kształty

znajdowałyby się cały czas na środku ekranu. Opcja To stage zmienia znaczenie

wszystkich przycisków na panelu Align.

Ćwiczenie 3

Przed wykonaniem ćwiczenia najlepiej usuń całą zawartość sceny i narysuj na

środku obszaru roboczego duży prostokąt.

• Zaznacz cały prostokąt, a następnie włącz narzędzie Frez Transform.

• Na panelu narzędziowym, pod zakładką Options, naciśnij przycisk Scal e

(Skalowanie). Dookoła zaznaczonego prostokąta powinna pojawić się

prostokątna ramka z uchwytami

• Pociągnij kursorem za uchwyt, który znajduje się w prawym dolnym rogu

prostokąta. Pomniejsz nieco prostokąt, przemieszczając kursor ukośnie

w lewo i do góry, a potem puść przycisk myszy.

• Teraz rozciągnij prostokąt wzdłuż osi Y, używając uchwytu, który znajduje

się na środku dolnej ściany prostokąta.

Piotr Chojnacki

2

• Na panelu narzędziowym przełącz narzędzie Free Transform w tryb pracy

Rotate and Skew (Obracanie i Pochylanie). Pociągnij za którykolwiek

z narożnych uchwytów i obróć prostokąt.

• Włącz narzędzie Selection i usuń zaznaczenie, aby obejrzeć efekt

przekształceń geometrycznych.

Możesz wypróbować narzędzie Free Transform, przekształcając jednocześnie wiele

obiektów. Spróbuj też przekształcić obiekty z wypełnieniem gradientowym albo linie różnej

grubości. Przetestuj !!! działanie pozostałych dwóch trybów narzędzia (Distort i Envelope).

Podczas pracy z Free Transform Tool możesz przytrzymywać klawisze Ctrl, Alt i Shift -

zarówno pojedynczo, jak i w rozmaitych kombinacjach - dzięki czemu uzyskasz dodatkową

funkcjonalność przekształceń.

Ćwiczenie 4

• Za pomocą pędzla narysuj na środku pustej sceny kształt przypominający

literę "C".

• Przełącz się na narzędzie Selection i kliknięciem zaznacz cały kształt.

• Wybierając z głównego menu polecenie Window/Transform, wyświetl

panel Transform.

• Jeżeli opcja Constrain na panelu Transform nie jest zaznaczona, włącz ją

teraz.

Opcja Constrain sprawia, że dwa pola edycyjne skalowania są ze sobą sprzężone -

zmiana wysokości obiektu spowoduje proporcjonalną zmianę jego szerokości

i odwrotnie. Podobna opcja znajduje się na panelu Properties - jest to przycisk

oznaczony ikoną kłódki. Jego działanie jest analogiczne, lecz wpływa tylko na

pola W i H panelu Properties.

• W jednym z pól zmiany rozmiaru zmień wartość ,,100%" na ,,200%",

a następnie naciśnij klawisz Enter. Litera "C" zostanie dwukrotnie

powiększona względem obu osi.

Działanie opcji Rotate jest dość proste - powoduje ona obrócenie kształtów

o wybrany kąt zgodnie z ruchem wskazówek zegara. Aby wykonać obrót

w kierunku przeciwnym do ruchu wskazówek zegara, trzeba wpisać w polu Rotate

wartość ujemną.

• Aby obrócić zaznaczony kształt o 90° w lewo, wpisz w polu Rotate

wartość ,,-90" i naciśnij Enter.

Zauważ, że po naciśnięciu klawisza Enter wartości w polach panelu Transform nie

Piotr Chojnacki

3

znikają - w dalszym ciągu wyświetlona jest wartość powiększenia i obrotu.

Mógłbyś wpisać w polach edycyjnych początkowe wartości i wszystkie

transformacje zostałyby cofnięte. Numeryczne wartości przekształceń są

pamiętane aż do momentu usunięcia zaznaczenia.

• Kliknij w dowolnym pustym miejscu obszaru roboczego, aby usunąć

zaznaczenie. Ponownie zaznacz poddany transformacjom kształt i spójrz,

jak zmieniły się wartości w panelu Transform.

Na panelu Transform można przeskalować obiekt względnie. Z kolei pola W, H, X

i Y; które zawsze znajdują się na panelu Properties, służą do wykonywania

transformacji bezwzględnych. Tak więc, jeśli chcemy pomniejszyć obiekt

dwukrotnie, skorzystamy z panelu Transform, a jeśli chcemy pomniejszyć go do

wysokości 50 pikseli, wykorzystamy panel Properties.

• Na panelu Properties ustaw szerokość (W) na 250 pikseli (transformacja

dotyczy tylko zaznaczonych kształtów). Taką samą wartość wpisz w polu

H, które odpowiada za wysokość.

• Wybierz polecenie Window/lnfo i porównaj opcje dostępne na panelu lnfo

z opcjami na panelu Properties.

Panel edycyjny Info zawiera takie same cztery pola, jakie pojawiają się na panelu Properties.

Jest on właściwie pozostałością po starszych wersjach Flasha, ale ma jedną przydatną funkcję,

której nie znajdziesz w innym miejscu programu. Chodzi o opcję Symbol position, dzięki

której można zdecydować, czy wartości położenia zaznaczonego obiektu są określone

w układzie współrzędnych względem środka tego obiektu, czy też względem lewego górnego

rogu prostokątnej ramki otaczającej obiekt.

Ćwiczenie 5

• Zaznacz prawą połowę wygiętego wypełnienia, które pozostało na scenie

po wykonaniu wcześniejszego ćwiczenia (możesz wykorzystać inny

kształt).

• Przytrzymaj lewy Control na klawiaturze i naciśnij klawisz "C" (taką

kombinację zapisuje się jako Ctrl+C). Jest to skrót klawiaturowy do

polecenia Edit/Copy z głównego menu Flasha, powodujący skopiowanie

zaznaczonych obiektów do schowka.

• Naciśnij Ctrl + V, czyli skrót do polecenia Edit/Paste in Center

(Edycja/Wklej na środku). Skopiowany kształt pojawi się na środku sceny -

niekoniecznie w miejscu, w którym znajdował się poprzednio.

• Zaznacz teraz dowolny fragment wypełnienia i naciśnij klawisze Ctrl+X

(skrót do polecenia Cut, czyli Wytnij). Część kształtów powinna zniknąć

ze sceny - została właśnie przeniesiona do schowka.

Piotr Chojnacki

4

Aby odzyskać utracone kształty, trzeba wkleić je dokładnie w to sarno miejsce,

z którego zostały wycięte. Takie działanie umożliwia polecenie Paste in Place

(Wklej na Miejsce), mające dłuższy skrót klawiaturowy: Ctrl + Shift + V.

• W ciśnij Ctrl + Shift+ V, a kształty ze schowka pojawią się na poprzedniej

pozycji.

Ćwiczenie 6

Przed wykonaniem ćwiczenia utwórz nowy plik Flasha.

• Włącz narzędzie Text (oznaczone literą "A" na panelu narzędziowym).

• Odszukaj pole Font size w górnej części panelu Properties. Aby ustalić

rozmiar czcionki, wpisz w tym polu wartość ,,20".

• Kliknij lewym przyciskiem myszy na środku obszaru roboczego i wpisz

dowolny tekst na klawiaturze.

• Włącz narzędzie Selection i zaznacz tekst pojedynczym kliknięciem.

• Zauważ, że zaznaczone pole tekstowe jest otoczone prostokątną, niebieską

ramką. Na panelu Properties wyświetliły się wszystkie właściwości tekstu,

takie jak czcionka, kolor i rozmiar.

• Na panelu Properties rozwiń listę Font (Czcionka) i wybierz pozycję

Courier .ew. Włącz pogrubienie tekstu za pomocą przełącznika Toggle

the bold style.

• Naciśnij klawisze Ctrl+B, aby podzielić tekst na oddzielne znaki. Naciśnij

ponownie tę samą kombinację klawiszy, aby zamienić tekst na krzywe.

BIBLIOGRAFIA:

Ćwiczenia sporządzono na podstawie następujących materiałów:

1. Macromedia Flash 8 Professional. Oficjalny podręcznik, Tom Green, Jordan L. Chilcott Wydawnictwo

Helion 2006

2. Flash 8. Ćwiczenia praktyczne, Krzysztof Pasek

Wydawnictwo Helion 2006

3. ActionScript 2.0. Od podstaw, Nathan Derksen, Jeff Berg

Wydawnictwo Helion 2007

4. Flash CS3 PL. Ćwiczenia praktyczne, Joanna Pasek, Krzysztof Pasek

5. http://www.webdiary.pl/info+art.id+2.htm Artykuł: Gra we FLASH :: WebDiary.PL

6. http://www.webdiary.pl/technologie+art.id+57.htm Podstawy :: Kurs FLASH MX :: WebDiary.PL

7. http://www.actionscript.prv.pl/

8. http://www.flashzone.pl

9. Po prostu Flash 5. Techniki zaawansowane - Russell Chun

10. Flash 5 Bible - Robert Reinhardt and Jon Warren Lentz

Piotr Chojnacki

5