Macromedia flash 8 lecke. A Macromedia Flash tanulása. Lineáris referenciapont

10.11.2020 Programok

Eddig az elejétől a végéig nézői beavatkozás nélkül lejátszott Flash-filmeket néztük meg. A Flash azonban lehetővé teszi interaktív alkalmazások létrehozását is, amelyekben a felhasználó szabályozhatja a tartalom megjelenítését. Ebben a leckében elkezdjük feltárni az Action Script szkriptnyelv elemeit, és megvizsgáljuk, hogyan használható interaktív alkalmazások létrehozására. Példaként hozzunk létre egy fotóalbumot interaktív felület elemekkel. Mielőtt azonban elkezdenénk az Action Script leírását, beszélnünk kell még egy szimbólumtípusról, amelyet eddig figyelmen kívül hagytunk – a gombszimbólumokról. Egy interaktív interfész felépítéséhez egyszerűen szükségesek.

Gombok létrehozása

A gomb egy négykockából álló interaktív filmklip. Amikor gombtípust rendelünk egy szimbólumhoz, a Flash négy képkockából álló idővonalat hoz létre az új szimbólumhoz:

Az up-state egy keret, amely megfelel annak a helyzetnek, amikor a gombot nem nyomják meg, és az egérmutató nincs a gomb felett;

Túlértékelt keret, amely a gomb megjelenését szemlélteti, amikor az egérmutató a gomb fölé kerül, de a gombot nem nyomják meg;

Lefelé állapot ez a keret mutatja a gomb megjelenését, amikor megnyomják;

A találati állapot azt a területet határozza meg, ahol a gomb reagál az egérkattintásra; ez a terület nem látható a klipben.

Gomb létrehozásához futtassa az Insert => New Symbol parancsot (begépelheti a Control+F8 billentyűkódot). A megjelenő Új szimbólum létrehozása párbeszédpanelen adjon nevet a gombszimbólumnak (például de1), és válassza ki a gomb szimbólumtípusát.

A Flash karakterszerkesztő módra vált, és fel, Over, Down és Hit képkockákat biztosít. Az első képkocka, az Up, üres kulcskockává válik. Rajzoljuk meg a gomb lenyomatlan nézetét ebben a keretben (1. ábra).

Rizs. 1. UP-frame gomb

Jelöljük ki a második keretet, amely Over jelöléssel rendelkezik, és megfelel annak az állapotnak, amikor a kurzor a gomb felett van. Szúrjunk be ebbe a keretbe egy kulcskeretet (az Insert => Keyframe paranccsal), aminek hatására megjelenik egy kulcskeret, amely teljesen megismétli az Up-frame tartalmát. Változtassuk meg a gomb színét, ahogy az ábra mutatja. 2.

2. ábra Képkocka feletti gomb

Hasonlóképpen adja hozzá a következő képkockát (Down frame), és rajzolja meg a gomb lenyomott állapotát (3. ábra).

Rizs. 3. Keret alsó gombja

A Hit keretben egyelőre nem húzunk semmit, de kicsit később visszatérünk ehhez a kerethez.

Menjünk a fő jelenetre, hívjuk meg a könyvtárat a Window => Library paranccsal, és hozzuk létre a gombszimbólum példányát a színpadra húzva (4. ábra).

Rizs. 4. Hozzon létre egy gombpéldányt a könyvtárból való húzással

Ennek eredményeként a következő filmet kapjuk. Amint ebből a filmből is látszik, egy gombnyomás nem csak akkor következik be, ha az egérrel a gomb központi (munka)területére kattintunk, hanem akkor is, ha a körülötte lévő keretre kattintunk. Ez annak a ténynek köszönhető, hogy ha a Hit keret nincs megrajzolva, akkor a gomb munkaterülete az Up keretnek felel meg.

Ahhoz, hogy a gomb csak a munkaterületen legyen megnyomva, ezt a zónát meg kell határozni a Hit keretben, vagyis a gombot keret nélkül kell megrajzolni (lásd 5. ábra).

Rizs. 5. Hit-frame gombok

A szükséges Hit-frame hozzáadása után a következő filmet kapjuk, amelyben a képkockára kattintva nem nyomják meg a gombot.

A gomb interaktívvá tételéhez a gomb megnyomásának tényét társítani kell bizonyos parancsok végrehajtásához, azaz le kell írni egy bizonyos forgatókönyvet. A Flash-ben szkriptek létrehozásához létezik egy speciális nyelv, az úgynevezett Action Script. Ebben a leckében ennek a nyelvnek a képességeinek csak egy kis részét érintjük, és a jövőben visszatérünk az Action Script felépítéséhez és szintaxisához, mivel az interaktív filmek Flash-ben való készítésének példái egyre összetettebbé válnak.

Akciószkript megértése

Az Action Script egy szkriptnyelv – egy olyan utasításkészlet, amely egy Flash-film elemeit vezérli. Az akciószkriptek beágyazhatók egy filmbe, vagy külsőleg tárolhatók szöveges fájl AS kiterjesztéssel.

Ha egy forgatókönyvet beágyaz egy filmbe, az a film különböző részeibe ágyazható be. Pontosabban, az Action Scriptek kulcskockákat, gombpéldányokat és filmklippéldányokat tartalmazhatnak. Ennek megfelelően a szkripteket keretműveleteknek, gombműveleteknek és filmklipműveleteknek nevezik.

A műveleti parancsfájlok akkor futnak le, amikor bizonyos felhasználó vagy rendszer által kezdeményezett események történnek. Azt a mechanizmust, amely megmondja a Flash-nek, hogy egy esemény bekövetkezésekor milyen utasítást kell végrehajtania, eseménykezelőnek nevezzük.

Az Action Scriptnek saját szintaxisa van, hasonlóan a JavaScripthez. A Flash MX 2004 támogatja a Flash összes korábbi verziójának Action Script-et.

Az Action Script egyik fő fogalma az Actions – olyan parancsok, amelyek utasításokat adnak ki egy SWF-fájl végrehajtása során. Például a gotoAndStop() elküldi a lejátszófejet egy adott kerethez vagy cue-hoz. Az Actions szóból származik a nyelv neve - Action Script (szó szerint - akciószkript). Ennek a nyelvnek a legtöbb fogalmát itt fogjuk megismerni konkrét példák.

Interaktív fotóalbum

Mutassuk be a gombok használatát egy fotóalbum kezeléséhez – hozzon létre egy fotókészletet, és adjon hozzá két gombot, amelyek előre és hátra görgethetik a fényképeket.

Helyezzük az első fényképet a fő idővonalra, és adjunk hozzá egy gombot a standard készletből. A kívánt mappa eléréséhez futnia kell Windows parancs=> Vezérlőpultok Közös könyvtárak => Gombok (6. ábra).

Rizs. 6. Adjon hozzá egy gombot a szabványos könyvtárból

A parancs végrehajtásának eredményeként megjelenik egy panel, amely előre megrajzolt gombokat tartalmaz különféle típusok. Válasszuk ki például a Billentyűgombokat (a billentyűzet billentyűihez hasonló gombokat), nyissuk meg a megfelelő mappát, válasszuk ki a bal gombbal gombot (7. ábra), és hozzuk létre ennek a gombnak a példányát (a színpadra húzva).

Rizs. 7. A Key Buttons mappa elemei

Vegye figyelembe, hogy amikor egy második gombot (jobb gomb) helyez a színpadra, és elmozdítja, hogy az első gombhoz igazodjon, a program egy tippet (szaggatott vonalat) ad, amely lehetővé teszi a gomb pontos pozícióját (8. ábra).

Rizs. 8. A gombok automatikus igazítása ugyanazon a szinten

Szkript hozzáadásához meg kell hívnia az Action Script szerkesztőt az Ablak => Fejlesztési panelek => Műveletek paranccsal vagy az F9 billentyű lenyomásával. Ha azt tervezi, hogy gyakran ír szkripteket, ezt a billentyűzet parancsot érdemes megjegyezni. Ennek eredményeként megjelenik az Action Script szerkesztő (9. ábra).

Rizs. 9. Műveleti szkriptszerkesztő panelek

Ha a jelenet különböző elemeinek kiemelésével kísérletezik, miközben figyeli az üzeneteket az Action Script szerkesztő paneleken, akkor azt fogja tapasztalni, hogy a program megmondja, melyik elemre "akaszthatja" a kódot. Ha kiválasztunk egy keretet a színpadon, akkor a szerkesztőpanel bal felső sarkában megjelenik az Actions - Frame felirat, ha a gombra kattintunk, akkor az Actions - Button felirat jelenik meg, vagyis a program felszólítja, hogy a beírt kód kapcsolódnak a gombszkripthez. És ha kiválaszt egy fényképet, egy üzenet jelenik meg a szkript bevitelére szolgáló mezőben: A jelenlegi kijelölésre nem lehet műveleteket alkalmazni (a kiválasztott objektumra nem lehet szkriptet alkalmazni).

Egy gombhoz scriptet rendelünk. BAN BEN legújabb verziói Az ActionScript képes központosított kódot írni, vagyis olyan kódot, amely egy helyen található, és ez a képesség lehetővé teszi a nagy programok jobb megértését. Azonban egyszerű példákban (ezt nézzük) teljesen elfogadható egy szkript hozzárendelése egy gombhoz.

Tehát a bal nyílgombhoz a következő forgatókönyvet kell formalizálnunk: „Ha egy bizonyos kereten elengedjük a gombot, akkor ebből a keretből az előző képkockára kell lépni.” Az Action Script nyelv szintaxisának megfelelően (10. ábra) ez így fog kinézni:

Az első sor az on() gomb eseménykezelőjét tartalmazza, amelynek formátuma:

Most adjunk hozzá több kulcskeretet úgy, hogy az első keretben létrehozott gombokat másoljuk be, és helyezzük el a szükséges fényképeket az újonnan létrehozott keretekbe.

Ha az elkészített filmet lefuttatjuk végrehajtásra, akkor a képkockák folyamatosan egymás után kerülnek lejátszásra, ezért mindenekelőtt az első képkockán a „Stop” parancsot kell kiadnunk. Ehhez adja hozzá a megfelelő parancsot az első képkockához (11. ábra).

Rizs. 11. Az első képkockához rendelt szkript

Figyelem: a parancs már nem a gombhoz, hanem a kerethez van hozzárendelve. Azt a tényt, hogy egy kerethez szkriptet rendeltek, a fő szerkesztősorban fel kell tüntetni – a keretmegjelölésben a félkövér pont felett kisbetűs „a” jelenik meg.

Ennek eredményeként megkaptuk a következő filmet.

Ha csak néhány képkocka van a fotóalbumban, akkor két gomb – „Előre” és „Vissza” – bőven elég, de ha nagy a fotókészlet, akkor célszerű az elejére mutató gombokat is használni. és a film vége. A következő példában hozzáadjuk a megfelelő gombokat: „Az első képkockához” és „Az utolsó képkockához”. A Circle Buttons mappából (12. ábra) kiválaszthatja a megfelelő mnemonikus gombokat a szabványos gombkönyvtárból.

A javasolt példa segítségével megismerkedünk egy másik paranccsal, a gotoAndStop(), amely lehetővé teszi, hogy a kívánt kerethez lépjen, majd megálljon.

Rizs. 12. Gombok a Circle Buttons mappából

Kódot helyezünk el a gombon, hogy az első képkockához ugorjunk (balról a harmadik a 13. ábrán), ahogy az a 13. ábrán látható. 13.

Rizs. 13. Szkript az „Első keretben” gombhoz

Öt keretből álló fotóalbum esetén adja hozzá az „Utolsó képkockához” átmeneti szkriptet az utolsó gombhoz:

Automatizált forgatókönyvírás

Eddig az összes parancsot manuálisan írtuk be, de az ActionScript szerkesztő panelek biztosítják egész sor szolgáltatások automatizált szkriptíráshoz. Tekintsük ezeket a lehetőségeket.

Rizs. 14. Automatizált szkriptkészítő eszközök

Az Action Script szerkesztő panel lehetővé teszi a parancsok kiválasztását, húzását, átrendezését és törlését.

Mutatjuk meg, hogyan írhatja meg ugyanazt a szkriptet a „Tovább” gombhoz automatizált módon. A Movie Clip Control mappa kiválasztásával (a bal felső ablak a 14. ábrán) elérheti a bekapcsolt eseménykezelőt, majd vagy duplán kell kattintania a megfelelő elemre, vagy húznia kell a kifejezést a szkriptírás mezőjére a Drag and programban. Drop mód.

Rizs. 15. Tipp egy kifejezés kiegészítéséhez

Ennek eredményeként a munkamezőn megjelenik a kívánt kifejezés és ehhez hasonló tipp (15. ábra): kiválasztja a kívánt parancsot a menüből, és a kifejezés automatikusan elkészül. Ahogy a menüből is látszik, nem csak a képernyőn megjelenő gombokhoz tartozó állapotot választhatja ki – a menüből is választhat Fig. 15 pontos gomb Nyomja meg a " ", vagy nyomja meg a " gombot ”, amely a billentyűzet billentyűinek (balra nyíl, jobbra nyíl) lenyomásának felel meg, vagyis lehetőség van egy fotóalbum létrehozására, amelyet a billentyűzet billentyűivel „lapozunk”.

Rizs. 16. Billentyűzet gombos hívások

Használjuk a keyPress parancsot ” (16. ábra), majd lépjen a Timeline Control mappába, válassza ki a nextFrame parancsot, és húzza át a munkamezőbe (17. ábra).

Rizs. 17. A nextFrame parancs a Timeline Control mappában található

A filmet a fotóalbum elejére vivő gombnál eseményként kiválaszthatjuk a menüből a Home gomb megnyomását, majd (18. ábra) a gotoAndStop parancsot a mezőre húzzuk, aminek hatására egy másik hint fog megjelenni a parancs lehetséges szintaxisában.

Az eszköztippben található nyilak lehetővé teszik a különböző szintaktikai beállítások megtekintését. A program két lehetőséget kínál (18. és 19. ábra), vagyis felkínál egy jelenetet és egy keretet vagy csak egy keretet. Esetünkben elég csak a Frame-et megadni. Ha a jelenet nevét kihagyja, az alapértelmezett az aktuális jelenet képkockájára ugrás.

Rizs. 18. Tipp a lehetséges parancsszintaxishoz

Rizs. 19. A háromszög nyíl segítségével megtekintheti a szintaktikai beállításokat

Miután az összes gombot hozzárendeltük a megfelelő billentyűzet gombjai, a következő filmet kapjuk, ahol a fotók lapozgatása a billentyűzetről fog megtörténni, és a képernyő gombjaira való kattintás az egérrel nem okoz semmilyen következményt.

Lehetséges-e olyan forgatókönyvet adni, amelyben a különböző események ugyanazokhoz a cselekvésekhez vezetnek? Kiderült, hogy megteheti – ehhez fel kell sorolnia az eseménynevek listáját az eseménykezelőben. Ha az első esemény után vesszőt tesz az események listájába, maga a program kínál fel egy menüt (20. ábra).

Rizs. 20. Ha vesszőt ír be az eseménylistába, automatikusan megjelenik a további parancsokat tartalmazó menü

Adjunk hozzá az első eseményhez (egy billentyűzet gombjának megnyomása) egy második eseményt (a képernyőgomb felengedése):

be(billentyűnyomás" ", kiadás)

Ismételjük meg az eljárást a többi gombnál, és ennek eredményeként egy fotóalbumot kapunk, amelyben a fotók görgetni fognak az egér és a billentyűzet segítségével (az eredeti FLA fájl a linkről érhető el).

A vizsgált példában a képkockaszám szerinti átmenetet alkalmaztuk, de ez a módszer nem mindig kényelmes: ha a képkockaszámozás megváltozik a filmvágás során, a logika meghibásodhat. Kényelmesebb az átmenetet keretjellel használni. Nézzünk egy példát, amihez nem csak az album lapozgatása, hanem a különböző szakaszokba való költözés, vagyis összetettebb navigáció is szükséges.

Álljon az album rajzokból, számítógépes grafikaés fényképeket.

A "rajzok" szakasz első képkockáját címkézzük fel, a többi szakasz első képkockáihoz hasonlóan a "grafika" és a "fotó" címkéket.

Hozzunk létre egy réteget a címkék elhelyezésére, és nevezzük el Címkéknek. Egy keret felcímkézéséhez a Tulajdonságok panelen ki kell választani a Név címketípust, és fel kell írni a nevét. Esetünkben Képek (21. kép). Hasonlóképpen jelölőket helyezünk el az 5. és 10. keretben (22. ábra).

Rizs. 21. Példa címke hozzárendelésére egy kerethez

Most tegyük hozzá új rétegés nevezzük akcióknak. A Műveletek réteg első kulcskeretében hívja meg a Műveletek keret panelt (az F9 gomb megnyomásával), és írja be a stop parancsot () (lásd 22. ábra).

Rizs. 22. Első forgatókönyv

Adjunk hozzá még egy réteget Subjects (subjects) néven, amelyben címeket adunk a megfelelő kereteknek: „Rajzok” (23. ábra), „Grafika” és „Fotók”.

Rizs. 23. A „Rajzok” rovat kereteinek címe

Most adjunk mellé hasonló nevű menügombokat, melyeket egy új Menü nevű rétegre helyezünk.

Nyomtassuk ki a „Képek” menü első elemét a bal szélről, és alakítsuk át gombszimbólummá. A nyíl eszközzel jelölje ki a „Pictures” szövegblokkot, és hajtsa végre a Modify => Convert to Symbol parancsot (ez a parancs az F8 billentyűvel is végrehajtható), a Convert to Symbol panelen állítsa be a szimbólum típusát a Gombot és adja meg annak értékét. név, mint pictureButton (24. ábra).

Rizs. 24. Rendelje a pictureButton nevet a képek részhez való ugráshoz

Hozzunk létre négy keretet a „Rajzok” gombhoz: az első egyszerűen reprezentálja eredeti szöveg(25. ábra), a második ugyanaz a szöveg csak kék színben, a harmadik képkockát kihagyjuk (ebben az esetben a Down keret megegyezik az Over kerettel), a Hit keretben pedig téglalap alakú területet rajzolunk. amely meghatározza a kattintási terület gombjait (26. ábra).

Rizs. 25. A képgomb felső kerete

Rizs. 26. A pictureButton gomb találati kerete

Most csatolnunk kell a szkriptet az újonnan létrehozott gombra. Ehhez válassza ki a gombot az 1. jelenetben, és az F9 megnyomásával hívja fel a Műveletek panelt, majd írja be az ábrán látható kódot. 27.

Rizs. 27. Szkript címkével ellátott keretre való áthelyezéshez

A Flash program célja és felépítése

Mostanában divat lett a Flash. Sokan azt hiszik, hogy a Flash egy új termék, de ez nem így van. Még 1995-ben jelent meg egy Future Splash Animator nevű kis program webes grafika vektoros animációjára, majd két évvel később, 1997-ben a Macromedia felvásárolta, és új Flash néven kezdte el fejleszteni a terméket.

Ma a Flash egy univerzális, integrált alkalmazás, amely egyesíti a grafikai és hangszerkesztőt, az animációs eszközt, és lehetővé teszi egyedi interaktív multimédiás termékek létrehozását. VAL VEL Flash használatával költséghatékony, élénk animációkat készíthet a weben, interaktív űrlapokat, játékokat, interaktív előadásokés még sok más. A Flash ismerete nem csak a webdesignerek számára hasznos, hanem tanárok, művészek és még sokan mások számára is, akik az animáció nyelvén szeretnék kifejezni ötleteiket. Ma erre nincs szükség különleges stúdió elég személyi számítógép, Flash programok és egy kis türelem.

A Flash Workbench alapelemei

Mielőtt elkezdenénk a rajzeszközök leírását, beszélnünk kell az interfész elemeiről. Foglalkozzunk azzal, hogy nem bombázzuk egyszerre az olvasót a felülettel kapcsolatos összes információval, és nem kényszerítjük arra, hogy emlékezzen minden részletre. A program felületéről éppen annyi információt adunk, hogy az aktuális lecke befejezhető legyen. Minden leckében új interfész-elemeket vizsgálunk meg, konkrét példákon keresztül elmagyarázva céljukat.

Amikor először indítja el a programot, valami olyasmit fog látni, mint amilyen az ábrán látható. 1.

Rizs. 1. A Flash 5.0 programfelület alapelemei

Megint mindenkinek fájl megnyitása illeszkedik az asztalhoz. Az asztalon van egy keret vagy Stage, egy téglalap alakú terület a képernyőn, amelyben egy Flash-filmet játszanak le.

Az asztalon való rajzoláshoz rajzeszközök állnak rendelkezésre (lásd az eszköztárat az 1. ábrán). Ezekről fogunk először beszélni.

Minden animáció létrehozása a rendereléssel kezdődik statikus képek. Az egyik kép gyors változása a másikra, melynek eredményeként a kép mozgásának benyomása keletkezik, az animáció. A képek megjelenítési időtartamának szabályozásához (animációvezérlés) használja az idővonalat vagy az idővonalat.

ábrán. Az 1. ábrán a Flash munkakörnyezet konfigurálására tervezett lebegő panelek (lebegő, dokkolható panelek) is láthatók. Tehát nézzük meg a Flash alapvető rajzeszközeit.

Rajz

Vázlat, körvonal, kitölt

Mielőtt elkezdené dolgozni a rajzeszközökkel, ismertesse meg a körvonal, a körvonal és a kitöltés fogalmát. Nézzük meg őket egy egyszerű példa segítségével.

Válassza ki az Ovális szerkesztő eszközt az eszköztárból (2. ábra), és rajzoljon egy oválist. Az alakzat automatikusan megtelik színnel. (Ha ovális rajzolása közben lenyomva tartja a Shift billentyűt, a rajzolt alakzat kör alakú lesz.)

Rizs. 2. A rajz egy körvonalból, egy körvonalból és egy kitöltésből áll.

A rajz egy körvonalból, egy körvonalból és egy kitöltésből áll (2. ábra). Az ábra körvonalának kiválasztásához kattintson az ábrán látható gombra. 3 piros nyíl. Ennek eredményeként a körvonal és a kitöltés eltűnik, csak a körvonal marad meg (4. ábra).

Rizs. 3. Távolítsa el a kitöltő és húzógombot

Rizs. 4. A kitöltés és a körvonal eltávolításával kontúrvonalat kapunk

szervizvonal (nem jelenik meg nyomtatáskor). ábrán látható gomb megnyomásával. 3, törölt elemeket ad vissza. Könnyen megváltoztatható a körvonal és a kitöltési szín. A kitöltés színe a Kitöltés színe gombbal módosítható (5. ábra). Miután kiválasztottunk egy új színt a palettán (5. ábra), a megrajzolt ábra nem változik, de új ellipszis rajzolásakor a körvonal kitöltődik az újonnan kiválasztott színnel.

Rizs. 5. Kitöltés és húzás színe eszközök

Az aktuális alakzat kitöltési színének megváltoztatásához ki kell választania egy új színt, és használnia kell a Paint Bucket eszközt - ez az ábrán van kiemelve. 6.

Rizs. 6. A rajzolt alakzat kitöltési színe a Paint Bucket eszközzel módosítható

A körvonal színe is megváltoztatható. Ehhez válassza ki a Körvonal színe eszközt (Körvonal színének módosítása) - az ábrán. 7 a piros nyíl rá mutat. Ezt követően megnyílik egy paletta, amelyen kiválaszthatja a kívánt színt, majd ki kell választani az Ink Bottle Tool-t (a 7. ábrán kiemelve van), és rá kell kattintani a körvonalra. Ennek eredményeként a kiválasztott színnel lesz kitöltve.

Rizs. 7. Módosítsa a körvonal színét

ábrán. A 6. ábrán az általunk rajzolt ovális nagyobb léptékben látható. A lépték módosítása egyébként ugyanúgy történik, mint a Photoshopban, a Ctrl és a „+” vagy a Ctrl és „-” billentyűkombináció használatával.

A vonásvonalak vastagsága és stílusa is módosítható. Ehhez parancsolni kell Ablak > Panelek > Körvonal hívja a Stroke panelt. Ebben testreszabhatja a vonal stílusát, vastagságát és színét (8. ábra).

Rizs. 8. A Stroke panel menüjében módosíthatja a körvonal paramétereit

Ha a Hardline line stílust választja (8. ábra), és alkalmazza az Ink Bottle Tool-t, akkor egy pixeles vonalat kap. A Hardline vonalnak nincs vastagsága, így nem jelenik meg érték a vonalvastagság mezőben. Például más vonalak vastagsága szaggatott vonal, módosítható (9. ábra).

Rizs. 9. Példa a vonal típusának és vastagságának megváltoztatására

A vonalparaméterek további finomhangolása a Vonalstílus panelen történik. Az ábrán a piros nyíllal jelzett gombra kattintva hívhatja meg. 10. A Vonalstílus panelen például módosíthatja a körvonal hosszát és a szaggatott vonal vonásai közötti távolságot. Ha az ábrán. 8, az alapértelmezett értékek elfogadásra kerültek - 6 pont a körvonalra és a vonások közötti távolságra, majd a 10 és 12 pontos értékek kiválasztásával, majd ismét a Tintapalack eszközzel kaphat egy körvonalat, mint az ábra. . 10.

Rizs. 10. Vonalparaméterek finomhangolása

Tehát megvizsgáltuk az alapfogalmakat - körvonal, kitöltési és húzási vonal - az ovális rajzolásának példáján. Most beszéljünk közvetlenül a rajzeszközökről.

Téglalap eszköz

A Téglalap eszköz az Ovális eszköz mellett található (11. ábra).

A hagyományos téglalap mellett lekerekített élű téglalapokat is rajzolhat. Ennek az üzemmódnak a beállításához válassza ki az ábrán látható ikont. 11-et a piros nyíl jelzi. Ennek eredményeként megjelenik a Téglalap beállításai panel, ahol megadhatja a filé sugarát, amely után a téglalap rajzolásakor a sarkok lekerekítésre kerülnek. A téglalap körvonal kitöltésének és körvonalának szerkesztése ugyanúgy történik, mint az ovális esetében.

Rizs. 11. Munka a Téglalap eszközzel

Vonal eszköz

A Vonal eszközzel egyenes vonalakat rajzolhat (12. ábra). A Shift billentyű lenyomva tartásával függőleges, vízszintes vagy 45°-os vonalakat rajzolhat.

Rizs. 12. Munka a Vonal eszközzel

Bizonyos esetekben, ha például egyenlő szárú háromszöget kell rajzolnia, célszerű rácsot használni. A paranccsal láthatóvá teheti a rácsvonalakat Nézet > Rács > Rács megjelenítése(13. ábra).

Rizs. 13. Szabályos geometriai formák rajzolásakor használhat rácsot

Ceruza eszköz

Rizs. 14. A Ceruza eszközzel végzett munka eredménye különböző beállításokkal (a háromszög felső sora Kiegyenesítés mód, az alsó sor Tinta)

A Ceruza eszköz az Ovális eszköz alatt található. ábrán. A 14. ábra a ceruzával végzett munka eredményét mutatja különböző beállítási lehetőségekkel, amelyek közül összesen hármat kínálunk. A Straighten beállítással a szerszám egy kézzel rajzolt kontúr remegő vonalait egyenes vonalakra alakítja, a Smooth beállítással a vonalakat simítja, Ink módban pedig gyakorlatilag nem változtatja meg az eredeti kontúrt.

Vonalszerkesztés, Nyíl és Subselect eszközök

A Nyíl eszköz működésének magyarázatához közelebbről meg kell vizsgálnunk a kontúrvonal szerkezetét.

Rajzoljunk egy vonalat a Ceruza eszközzel, az ábra szerint. 15. Kontúrból és vonalvonásból áll.

Rizs. 15. A Subselect eszközzel rögzítési pontokat és szintvonalszakaszokat választhat ki

Rizs. 16. Példa sarokpont mozgatására

Rizs. 17. Példa egy kontúr görbületének megváltoztatására

Rizs. 18. A körvonal követi a körvonalat

Mostanáig, ha az áramkörről beszélünk, nem említettük a szerkezetét. A kontúrvonal szerkezetének magyarázatához a Subselect eszközt fogjuk használni, amely az ábrán aktiválódik. 15, és kattintson rá a vonal körvonala mentén. Ennek eredményeként látni fogjuk, hogy a szintvonal szakaszokból és referenciapontokból áll (15. ábra). A Ceruza eszköz használatakor a szegmensek és a rögzítési pontok automatikusan létrejönnek. Amikor szerkesztjük a körvonalvonalat, a körvonal automatikusan megváltozik. Mutatjuk meg, hogyan szerkeszthetsz egy kontúrvonalat a Nyíl eszközzel – ez az ábrán kiemelve. 16.

A rögzítési pontok lehetnek szögletesek vagy simaak. Ha a nyíl eszközt közelebb hozzuk egy vonalhoz, a megjelenése megváltozik. Amikor egy sarokponthoz közeledik, a nyíl kép mellett egy sarok jelenik meg - ebben az üzemmódban a sarokpontokat mozgathatja (16. ábra), szegmenshez vagy sima ponthoz közeledve pedig egy ívkép jelenik meg - ebben módban módosíthatja a kontúr görbületét (17. ábra). A kontúrvonal megváltoztatásakor a körvonal követi a kontúrvonalat (18. ábra).

Rajzoljon egy ellipszist, és a Nyíl eszközzel jelölje ki a kitöltését egy kattintással (a kiválasztott kitöltés színe fehér pontokkal világosabb lesz), majd mozgassa a fogd és vidd módban, ahogy az ábra mutatja. 19. Ha duplán kattint, a kitöltés melletti körvonal is kijelölődik. A dupla kattintással metsző vonalakat is kiválaszthat.

Rizs. 19. Példa egy kiválasztott objektum mozgatására a Nyíl eszközzel

Rizs. 20. Eredeti kép

Tekintsük a kiválasztott kép más típusú módosításait. A Ceruza eszközzel rajzoljon egy bizonyos körvonalat, például egy levelet (20. ábra). Válassza a Nyíl eszközt, és jelölje ki a megrajzolt levelet egy téglalap alakú keretbe. Most már feldolgozhatja a kiválasztott objektumot a rendelkezésre álló módosítókkal.

Az Opciók panelen válassza ki a Simítás gombot, és kattintson rá többször – a levél körvonala simább körvonalat kap (21a. ábra).

Rizs. 21. Módosítók használata a Beállítások panelen: a) A Smooth lehetővé teszi a kép kontúrjainak kisimítását; b) Az egyenesítés lehetővé teszi a kép kontúrjainak kiegyenesítését

Az ábra mutatja a kontúr változásait a Kiegyenesítés gomb többszöri kattintása után. 21b.

A Lasszó eszközzel bármilyen alakú területet kiválaszthat (22. ábra).

Rizs. 22. Példa a Lasszó eszközzel végzett kijelölésre

Ecset eszköz

Rizs. 23. Példa az Ecset eszközzel való munkára

Az Ecset eszköz létrehoz egy vektorpályát, és kitölti a kiválasztott színnel, de a korábban tárgyalt eszközökkel ellentétben nem alkot vonásvonalat (23. ábra). Annak megértéséhez, hogy az Ecset eszköz milyen útvonalat hoz létre, nézze meg a 1. ábrát. 24, ahol a Subselect eszközt használják.

Rizs. 24. Példa az Ecset eszközzel készített kontúrvonalra

Rizs. 25. Ecseteszköz testreszabási beállításai

Az Opciók panel három lehetőséget kínál az Ecset eszköz testreszabásához: módok (felső gomb), ecsetméretek (középső gomb) és ecset alakja (alsó gomb) (25. ábra).

A módok határozzák meg a megrajzolt vonal és a már megrajzolt objektum interakciójának jellegét (26. ábra). Amint az ábrán látható, azonos típusú vízszintes vonalak különböző módokban történő rajzolásakor a festés különböző módon történik:

Paint Normal a kerettér át van festve, a festett tárgy körvonala és kitöltése;

Festék kitölti a keret területét átfestjük, és a festett tárgyat kitöltjük. A körvonal nincs átfestve;

Festék A keret mögött csak a szabad hely van festve;

Paint Selection csak a kiválasztott terület festve;

Festék Belül csak azt a kitöltést kell átfesteni, amelyik elkezdte a festést.

Rizs. 26. Az ecsetvonások és az előzőleg megrajzolt objektum interakciójának különböző módjai

Szükséges a Lock Fill paraméter hatásának magyarázata - a parancsnak megfelelő lakat ikont tartalmazó gomb látható a 2. ábrán lenyomva. 27.

Rizs. 27. Példa a Lock Fill paraméterre

A Kitöltés zárolása paraméter aktiválásakor (a gomb megnyomásakor) a színátmenet a teljes munkamezőre vonatkozik (27. ábra), és ha nincs aktiválva, az egyik színről a másikra ecsetvonás alapján történik az átmenet. (28. ábra).

Rizs. 28. A Kitöltés zárolása opció nincs aktiválva

Radír

A radír lehetővé teszi a vonalak törlését és a kitöltést, és számos különböző beállítással rendelkezik. Az Opciók panelen konfigurálhatja a radír méretét és alakját, valamint kiválaszthatja a törlési módot (29. ábra):

Az Erase Normal törli az objektum körvonalát és kitöltését;

Törlés Kitöltés az objektum kitöltése törlődik (a körvonal nem törlődik);

Sorok törlése Csak a sorok törlődnek;

Kijelölt kitöltések törlése Csak a kiválasztott terület törlődik.

Törlés Belül csak a kitöltés törlődik, és ha radírral rajzol egy vonalat, a törlés csak azon a kontúron belül történik, amelyben a vonal elindult.

A Csaptelep módosító lehetővé teszi a kitöltések vagy vonalak teljes eltávolítását.

Rizs. 29. Különböző radírmódok

Toll eszköz

Eddig olyan eszközöket vizsgáltunk, amelyek automatikusan körvonalakat hoznak létre. A Toll eszköz lehetővé teszi, hogy közvetlenül dolgozzon az útvonalakkal. Ezzel egyenes és ívelt szegmenseket hozhat létre, beállíthatja az egyenes vonalak hosszát és az ívelt szakaszok dőlését.

Lineáris referenciapont

Válassza ki a Toll eszközt, kattintson az egérrel (elhelyezte az első rögzítési pontot), mozgassa a kurzort, kattintson az egérrel (ez a második hivatkozási pont). Az eredmény egy szaggatott vonal lesz, mint az ábrán. 30. ábrán látható referenciapontok. A 30-at lineárisnak nevezzük, mivel a bennük konvergáló szakaszok lineárisak. Egy lineáris pontnak nincsenek vezetői.

Rizs. 30. Példa vonallánc létrehozására a Toll eszközzel

Sima rögzítési pont

Rizs. 31. Példa sima görbe létrehozására a Toll eszközzel

Sima rögzítési pont létrehozásához válassza ki a Toll eszközt, kattintson rá bal gomb egeret, és anélkül, hogy elengednénk, enyhén mozgassuk az egeret, aminek eredményeként egy sima referenciapont és az abból kilépő vezetővonal jelenik meg (31. ábra). A vezetővonal elforgatásával és meghosszabbításával módosíthatja a következő szegmens görbületét.

Nyitott kontúr létrehozásához végre kell hajtani dupla kattintás vigye az egeret az utolsó pont fölé. Engedje fel az egérgombot, mozgassa a kurzort, és helyezze el a következő rögzítési pontot; Ennek az eljárásnak a megismétlésével sima vonalat kaphat, mint az ábra. 31.

Egy útvonal bezárásához vigye közelebb a kurzort a kiindulási horgonyponthoz vagy útvonalvonalhoz. Miután a kurzor kör alakú tollra változik, kattintson az egérrel, és a körvonal bezárul.

Ha egy pontban két független szakasz kapcsolódik össze, akkor az egy sarokpont. Például, ha egyenes és ívelt szakaszokat köt össze, akkor a metszéspontjuknál egy sarokpont jelenik meg (32. ábra).

Rizs. 32. Egyenes és íves szakaszok metszéspontjában sarokpont alakul ki

A rögzítési pontok átalakíthatók, áthelyezhetők és törölhetők.

Egy sarokpont simává alakításához válassza az Alkijelölés eszközt. Kattintson a sarokpontra, és az Alt billentyűt lenyomva tartva húzza a pontot - simává válik, és megjelenik egy vezetővonal, amely lehetővé teszi az ezen a sima ponton összekapcsolódó szakaszok görbületének megváltoztatását (33. ábra).

Rizs. 33. Példa sarokpont simává alakítására

Alapértelmezés szerint a kiválasztott sima görbe pontok üreges pontokként, a kiválasztott sarokpontok pedig üreges négyzetekként jelennek meg.

A toll és az alválasztó eszközök használata a rögzítési pontok manipulálására

Hasonlóképpen pontokat hozhat létre más Flash rajzeszközökkel (ceruza, ecset, vonal, ovális, téglalap) húzott vonalakon, és beállíthatja ezeket a vonalakat.

Különösen az ábrán. A 34. ábra az Ovális eszközzel készített útvonalat mutatja, amely egy sima pont sarokponttá alakításával (a Toll eszközzel) és a sarokpontnak az Alkijelölés eszközzel történő húzásával készült.

Rizs. 34. Egy sima pont sarokponttá alakításával és húzásával az Ovális eszközzel készített pálya

Cseppentő eszköz

A Dropper eszközzel másolható a ceruzavonalak színe és stílusa, az ecsetmód és a kitöltések. Amikor a pipettát a vonalra mozgatja, a kurzor megváltozik – egy mini ceruza ikon jelenik meg a pipetta alatt. Ha rákattint a pipettára egy vonalra, a vonal összes paramétere (szín, vastagság, stílus) átmásolódik, és a pipettát az Ink Bottle eszközzel helyettesíti, amely lehetővé teszi, hogy ezeket a beállításokat egy másik sorra alkalmazza.

Hasonlóképpen, ha a kurzor egy kitöltés felett van, egy gombóc kép jelenik meg a cseppentő alatt, és ha a kurzor egy ecsetvonás felett van, egy ecsetkép jelenik meg a cseppentő alatt. Ezek az ikonok jelzik, hogy mely attribútumokat másolja a Dropper eszközzel.

Paint Bucket Tool

A Paint Bucket eszközt már említettük – ez az ábrán látható. 35, most nézzük meg részletesebben a képességeit. Ez az eszköz zárt (és részben zárt) területek kitöltésére szolgál szín-, színátmenet- és raszteres kitöltéssel.

Ha bittérképek kitöltésével dolgozott Photoshop program, akkor valószínűleg ismeri azt a helyzetet, amikor a nem túl szépen megrajzolt kontúrok szélén „kiömlik” a kitöltés azokon a helyeken, ahol „lyukak” vannak. A Flash-ben a kitöltő eszköz beállításának többféle módja lehetséges, így elkerülhető a fent leírt hiba.

Négy lehetőség van az eszköz konfigurálására:

Ne zárja be a réseket, ne zárja be a hiányosságokat;

Close Small Gaps bezárja a kis réseket;

Közepes rések bezárása Közepes rések bezárása;

Close Large Gaps bezárja a nagy réseket.

Válassza ki a Ceruza eszközt, és rajzoljon egy nyitott útvonalat (35. ábra). Válassza a Close Large Gaps módot, és töltse ki a körvonalat. ábrából látható. 35, a kitöltés a körvonalon belül marad, annak ellenére, hogy az eredeti körvonal nyitva volt.

Rizs. 35. Példa egy kontúr lezárására a Close Large Gaps módban

Most nézzük a gradiens kitöltést és a vele végzett műveleteket. A Kitöltés panelen válassza ki a kitöltési lehetőséget a Kitöltés lapon – Lineáris színátmenet. Ezután rajzoljon egy téglalapot, töltse ki lineáris kitöltéssel lineáris gradienssel, és a nagy téglalap belsejébe rajzoljon egy kisebb téglalapot (36. ábra). Amint az ezen az ábrán látható, egy kis téglalapban a fehérről a kékre való átmenet kisebb színátmeneten valósul meg. Ha a Kitöltés zárolása funkciót használja, és mindkét téglalapot kitölti, olyan képet kap, mint az ábra. 37. Vagyis a belső és a külső téglalap színátmenete azonos lesz.

Rizs. 36. Gradiens kitöltési mód, ha a Kitöltés zárolása paraméter nincs aktiválva

Rizs. 37. Gradiens kitöltés abban az üzemmódban, amikor a Kitöltés zárolása paraméter aktiválva van

A kitöltési gradiens irányának megváltoztatásához kattintson a Beállítások panelen a Kitöltés átalakítása gombra (38. ábra), majd kattintson a kitöltésre, ennek eredményeként megjelennek a jelölők (ábra). 38).

Rizs. 38. Módosítási példa gradiens kitöltése

A felső kerek jelölő a színátmenetes kitöltés forgatására szolgál, a téglalap alakú az egyik színről a másikra való átmenet gradiensének növelésére (csökkentésére), a középső kerek jelölővel pedig a színátmenetes kitöltés középpontjának mozgatására szolgál.

A Paint Bucket eszközzel zárt görbét is kitölthet raszteres képpel. Mutassuk meg, hogyan hajtják végre ezt az eljárást egy egyszerű példán keresztül. A Téglalap eszközzel rajzolja meg a monitor képét, amelynek képernyőjére a raszteres képet beilleszti (39. ábra).

Rizs. 39. A monitor vektorképe, amelybe a fénykép raszterképe kerül

Ezután importáljon egy bittérképes képet, amely kitölti a képernyőt. A parancs futtatásával importálhat bittérképet Fájl > Importálásés válassza ki a kívánt fájlt. Ezután lépjen a Kitöltés panelre, és módosítsa a kitöltési módot raszteres - Bitmap -re (40. ábra).

Rizs. 40. Kitöltés panel, Kitöltés fül

Így ha egy zárt kontúrt kitölt a rajzolt belsejében monitor képernyő, akkor megtörténik a raszteres kitöltés, amint az az ábrán látható. 41.

Rizs. 41. Példa raszteres kitöltésre

A raszteres kitöltés szerkesztéséhez kattintson a Kitöltés átalakítása gombra a Beállítások panelen (a 42. ábrán van rákattintva), majd kattintson a raszteres kitöltésre, ennek eredményeként egy keret jelenik meg jelölőkkel ( 42. ábra).

A központi marker segítségével a raszteres kép elhúzható, így a kép kívánt része megjelenik a megrajzolt monitoron (43. ábra).

Rizs. 42. Raszteres kitöltés módosító keret

Rizs. 43. A középső marker mozgatásával levághatja a bitképet

Más jelölők lehetővé teszik a raszteres kép méretezését, elforgatását és deformálását (44. ábra).

Rizs. 44. Példa raszteres kitöltési deformációra

Több fénykép importálása után beállíthatunk egy palettát, amelyből kiválaszthatjuk a kitöltendő rasztert (45. ábra), akárcsak a színpalettát.

Rizs. 45. Példa több bittérképes palettára

Alakzatok összeadása és kivonása

Ha két alakzat átfedi egymást, a Flash egyesíti vagy szegmentálja őket. Rajzoljon két azonos színű alakzatot - egy kört és egy téglalapot (46. ábra), jelölje ki a téglalapot (a nyíl eszközzel rákattintva), majd fedje rá a téglalapot a körre és távolítsa el a kijelölést (kattintva a ismét a Nyíl eszközzel).

Rizs. 46. ​​Kezdeti adatok

Ennek eredményeként a két figura eggyé fog olvadni. A kapott alakzat körvonalára a Subselect eszközzel kattintva megbizonyosodhatunk arról, hogy a belső körvonal eltűnt (47. ábra).

Rizs. 47. Példa két azonos színű forma kombinálására

Most végezze el ugyanazt az eljárást különböző színű formákkal. Ebben az esetben a belső határ nem tűnik el (48. ábra).

Rizs. 48. Különböző színű formák átfedésekor a belső kontúr nem tűnik el

Ha most kiválaszt egy téglalapot, és a Nyíl eszközzel mozgatja, akkor egy alkatrész ki lesz vágva a körből, amint az az ábrán látható. 49.

Rizs. 49. A kör egy részét kivágjuk téglalappá

Néha hasznos az alakzatok körvonalainak kombinálása és kivonása, hogy összetett körvonalat kapjunk.

Minden animáció vagy film képkockák sorozatából áll. A keret egy animációs dokumentum vagy film legkisebb része. Ezért egy animáció létrehozásához először több képkockát kell létrehoznunk. Flash MX 2004 - számos eszköz animáció készítéséhez.

Flash MX 2004 kerettípusok

Kulcskeret - feldolgozásra rendelkezésre álló keret. Az animációban ez a keret akkor jelenik meg, amikor a felhasználó rajzolja. Az idővonalon a kulcskép fekete körként jelenik meg, ha képet tartalmaz, és fehérként, ha nincs kép.

A normál keret olyan keret, amely megjelenik az animációban, de a felhasználó közvetlenül nem vett részt a keret megrajzolásában. Ez megegyezik a bal oldali kulcskockával, vagy ha storyboard készült, akkor a program által automatikusan generált kerettel.

Storyboard - a kép automatikus váltása egyik kulcskeretről a másikra.

A fantomkeret egy üres cella az idődiagramon, amelyben kulcskeret vagy normál keret állítható be.

Keretképképzéssel.

Animáció létrehozásának legegyszerűbb módja a rajz kockánkénti megváltoztatása, azaz. Minden kereten megváltozik az objektum helyzete és jellemzői, vagy új objektumok kerülnek hozzáadásra, és a régi objektumok eltávolításra kerülnek.

Flash MX 2004. 1. gyakorlat

A rajz képkockánkénti kialakítása: minden kereten a rajzhoz adnak hozzá alkatrészeket.

Most meghajlíthatja a vonalat, és bármilyen formát készíthet ennek az alaknak.

Borítékolás – egy téglalap alakú diagramot jelenít meg, amely lehetővé teszi az alakzat megváltoztatását és becsomagolását.

Miután manipuláltam a vonalat a Flash MX 2004 eszközökkel, ezt az ábrát kaptam.

Az első képkocka készen van, az animáció készítésének folytatásához további képkockákat kell hozzáadnunk. Kattintson az ideiglenes panelre, a következő keret kékre vált. Kattintson a jobb gombbal, és a legördülő menüből válassza a Konvertálás kulcskockákra lehetőséget. Ezen műveletek után a 2. keretet, az elsőhöz hasonlóan, fekete kör jelzi.

Néhány képkocka-manipulációs jelölés a Flash MX 2004-ben: Keret beszúrása, Keretek eltávolítása, Kulcskocka beszúrása, Üres kulcskockák beszúrása, Kulcskockák törlése, Konvertálás kulcskockákká, Átalakítás üres kulcskockákká, Gut keretek, Copi Frames, Keretek beillesztése, Keretek törlése és Összes képkocka kiválasztása - műveleteket hajt végre a parancsnevekben megadott keretekkel.

Több kulcskeret elkészítése után ilyen képet kell kapnunk.

Egy egyenes átalakításakor előfordulhat, hogy nem csak hajlítani kell az egyenest, hanem méretét is módosítani kell, azaz szabadon kell átalakítani. A Flash MX 2004-ben ezt így is megteheti.

Vigye az egérmutatót közvetlenül a vonalra, és kattintson a jobb gombbal. Válassza a Szabad átalakítás lehetőséget a legördülő menüből. Vagy a főmenüben válassza a Módosítás => Átalakítás => Ingyenes átalakítás lehetőséget. Most meghajlíthatja a vonalat, és bármilyen formát készíthet ennek az alaknak.

A napot és a sugarakat sokkal könnyebb elkészíteni, ezért az önteszthez azt javaslom, hogy csináld magad.

Most meg kell zöldítenünk a fa koronáját. Felhőszerű kitöltést nem fogunk tudni készíteni, hiszen zárt figurából alakult ki. A fa koronáját pedig több vonal határolja. Lehet ecsettel átfesteni, de nem lesz túl kényelmes.
A Flash MX 2004 lehetővé teszi több réteg létrehozását. Ezért adjunk hozzá egy új réteget a háttérhez, és fessük rá a fa koronája területén.

Új réteg létrehozása
Új réteg létrehozásához kövesse az alábbi lépéseket:
1. Válassza ki közvetlenül azt a dokumentumjelenet-réteget, amely előtt az új fóliát el kell helyezni.
2. Ha normál rétegtípust hoz létre, tegye a következők egyikét:
- kattintson a Réteg beszúrása gombra, az elsőre a rétegkezelő bal alsó sarkában;
- hajtsa végre a főmenü Insert => Timeline => Layer (Insert => Timeline => Layer) parancsát;
- futtassa a Réteg beszúrása parancsot helyi menü kiválasztott réteg.

Réteg húzása az egérrel
Egy réteg egérrel való húzásához tegye a következőket:
1. Helyezze a mutatót egy üres helyre az áthelyezett réteg sorában, és kattintson az egérgombbal.
2. Húzza a mutatót arra a helyre a rétegkezelőben, ahol ennek a rétegnek el kell helyezkednie (a dokumentum többi rétege között vagy egyes rétegmappákban). Ezt a helyet a rétegek között megjelenő kettős elválasztó vonal jelzi, vagy a mappa ikon elsötétedése a rétegek mappasorában. Amint egy ilyen vonal vagy mappaárnyalat megjelenik a kezelőben a kívánt helyen, engedje fel az egérgombot. Ha dupla vonal jelenik meg, a kiválasztott réteg a helyére kerül beillesztésre, ha pedig a mappa árnyékolt volt, a réteg a következő helyre kerül. ezt a mappátés a legtetején lesz elhelyezve.

Minden következő pixelnél szabadon átalakítjuk a keretet. A végén lassú mozgást végezhet a kereten. Erre találták ki a Flash MX 2004-et – hogy megkönnyítse az animáció készítését. Hozzon létre egy kulcskeretet. Ezután az Alt billentyű lenyomásával húzza el a kulcskeretet 10 képkockával a bal egérgombbal, és engedje el. Húzáskor egy kis + jel kerül a kurzor ikonjára. Ezután módosítjuk az átvitt keretet.

Most a kép köztes változásait a rendszer automatikusan kiszámítja két képkocka között.

Macromedia Flash Az MX 2004 számos módot kínál animációs sorozatok létrehozására:

Animációs effektusok - a program maga hoz létre egy olyan képkockát, amely egy bizonyos hatást szimulál egy bizonyos objektumhoz képest;

Képkockánkénti animáció – a felhasználó létrehozza a jövőbeli animáció minden egyes képkockáját;

Automatikus tweened animáció, vagy transzformációs animáció, - a felhasználó adja meg a kezdő és záró képkockákat, a program pedig maga készít köztes képkockákat szoftveres interpoláció alapján.

Animációs effektusok

A Flash MX 2004 előre elkészített animációs effektusokat (idővonal-effektusokat) tartalmaz, amelyek segítségével összetett animációkat hozhat létre minimális mennyiség akciókat. Használhatja a funkciót Idővonal-effektusok a következő objektumokhoz:

Grafikus objektumok, beleértve az alakzatokat, csoportosított objektumokat és grafikus szimbólumokat;

Raszteres képek;

Amikor animációs effektusokat ad hozzá egy objektumhoz, a Flash automatikusan létrehoz egy megfelelő réteget, és az ehhez a réteghez szükséges összes mozgás- és alakátalakítás végrehajtásra kerül. Az új réteg automatikusan ugyanazt a nevet kapja, mint az effektus.

Példaként hozzunk létre egy „robbanás” hatást a szövegen. Ehhez írjon be egy kifejezést vagy szót (1. ábra), jelölje ki a Nyíl eszközzel, és hajtsa végre a parancsot Insert => Timeline Effects => Effects => Explode.

Rizs. 1. Kijelölt szövegobjektum

Ennek eredményeként megjelenik egy azonos nevű panel (2. ábra), amely számos effektparaméter konfigurálását teszi lehetővé.

Rizs. 2. A panel felrobbanása

Az előnézeti ablak lehetővé teszi az effektusok különböző változatainak elemzését anélkül, hogy elhagyná a panelt Felrobban. Miután kiválasztotta a szükséges opciókat, kattintson a gombra rendbenés kapsz valami ehhez hasonló animációt.

Hasonló hatások alkalmazhatók raszteres képre is. Tekintsünk egy példát a raszteres kép zökkenőmentes eltűnésére. Bittérkép importálása a jelenetbe parancs segítségével Fájl => Import => Importálás a színpadra(3. ábra), és alkalmazza a Blur effektust a parancsra Beszúrás => Idővonal effektusok => Effektusok => Elmosódás Videoklip .

Rizs. 3. Raszteres kép, behozva a színre

Animációs effektus szerkesztéséhez válassza ki az effektushoz társított objektumot a színpadon és a megjelenő ablakban Tulajdonságok kattintson a gombra Szerkesztés(4. ábra) - ennek eredményeként egy panel jelenik meg Elhomályosít.

Rizs. 4. Gomb Szerkesztés a panel alján található Tulajdonságok

A panelben Elhomályosít ismét módosíthatja az effektparamétereket, és elmentheti az új beállításokat (5. ábra).

Rizs. 5. Panel Elhomályosít lehetővé teszi az effektbeállítások módosítását

Stop motion animáció

Mérlegeljük legegyszerűbb példa— a papírdarab a képernyő egyik pontjáról a másikra mozog a tengelye körüli forgással.

Rizs. 6. Az animáció első kulcskockája

Rajzoljunk például egy juharlevelet, ahogy az ábra mutatja. 6, - megfelelő keret a panelen Idővonal szürkévé válik, és egy pont jelenik meg benne, jelezve, hogy ez egy kulcskép. A kulcskeret egy olyan keret, amelyben a tartalom elhelyezhető vagy módosítható.

Rizs. 7. Hozza létre a második keretet az első húzásával és átalakításával

Ezután kattintson a jobb gombbal a szomszédos keretre, és szúrjon be egy másik kulcskeretet a paranccsal Kulcskeret beszúrása. Ennek eredményeként a levél másolata megjelenik ebben a keretben; mozgassa lefelé (a nyíl eszközzel), és forgassa el a paranccsal Módosítás => Átalakítás => Ingyenes átalakítás(7. ábra).

Ismételjük meg az eljárást úgy, hogy a 6. képkockában a lap elfoglalja a végső pozícióját (8. ábra).

Rizs. 8. Az animáció utolsó képkockája

Ügyeljen a panelre Tulajdonságok(8. ábra) - az objektum típusa a bal oldalon látható. Minden keretben a levél egy típusú objektum Alak(forma), más típusú objektumokról kicsit később lesz szó.

Ha egy filmet SEF-fájlként (a Macromedia natív formátuma a Flash-filmekhez) szeretne exportálni, futtassa a parancsot Fájl => Exportálás => Film exportálása. Ennek eredményeként a következő filmet kapjuk: szabadság1.fla). A kapott filmet anélkül tekintheti meg, hogy parancsra elhagyná a Flash programot Control => Test Movie. Sőt, annak megtekintéséhez, hogy mennyi helyet foglalnak el a film egyes képkockái, futtassa a parancsot. Ennek eredményeként látni fogjuk, hogy a hat képkocka mindegyike körülbelül 600 KB-ot foglal el (9. ábra). Így a teljes film mérete 3686 bájt.

Rizs. 9. Filmnézés Sávszélesség-profilozó

Annak értékeléséhez, hogy ez sok-e vagy kevés, gondolja át, hogyan lehet hasonló filmet készíteni automatikus animáció vagy mozgástranszformációs animáció segítségével.

Automatikus animáció

Rizs. 10. Az objektum automatikusan grafikus szimbólummá változik

Nézzük meg, hogyan készítheti el ugyanazt az animációt, és hogyan kaphat kompaktabb eredményű fájlt. Jelölje ki a rajzolt levelet a képernyőn az Arrow eszközzel, és hajtsa végre a parancsot Beszúrás => Idővonal => Motion Tween létrehozása, ennek eredményeként a szórólap keretbe kerül, és a panelbe Tulajdonságoküzenet jelenik meg, hogy a kiválasztott objektumnak vannak tulajdonságai Grafikus(10. ábra). Ez azt jelenti, hogy az animált objektum automatikusan grafikus szimbólummá alakul. Most már nem lehet tetszőlegesen szerkeszteni a Nyíl eszközzel, mint Shape típusú objektummal. A szimbólumok használata fontos fogalom a Flash-ben. A szimbólum létrehozása után többször is felhasználható egy filmben anélkül, hogy növelné az eredményül kapott fájl méretét. A szimbólumokat grafikus szimbólumokra, gombszimbólumokra és filmklipszimbólumokra osztják. Ebben a leckében egy grafikus szimbólumot fogunk megnézni, és később visszatérünk más típusú szimbólumokra. Minden új szimbólum azonnal az aktuális dokumentum könyvtárának részévé válik (11. ábra).

Rizs. 11. Minden új szimbólum a könyvtár részévé válik

Ha lefuttatja a parancsot Ablak => Könyvtár, akkor megbizonyosodhat arról, hogy egy szimbólum megjelent a könyvtárban, és alapértelmezés szerint a Tween 1 nevet kapta. Ha egy szimbólumhoz más nevet szeretne rendelni, kattintson duplán a névre, és cserélje ki a kívánt névre. Miután elkészítettük a grafikus szimbólumot, menjünk az animációnk utolsó képkockájára (legyen ez a 15. képkocka) és szúrjunk be egy kulcskockát (az Insert paranccsal Kulcskocka). Ebben a keretben megjelenik a szimbólum másolata, amelyet mozgatunk és elforgatunk a tengelye körül (a parancs segítségével Modify Transform=>Ingyenes átalakítás), mint az előző példában. ábrából látható. 12, minden képkocka két kulcsképkocka között kék színű, és egy nyíl húzódik az első kulcskockától az utolsóig, ami animáció létrehozását jelzi Motion Tween.

Rizs. 12. Kék alapon nyíl jelzi az animáció létrehozását Motion Tween

A parancs végrehajtásával Control => Test Movieábrán látható információkat kapjuk. 13.

Rizs. 13. Filmnézés Sávszélesség-profilozó módban

Annak ellenére, hogy ebben a példában 15 helyett hat képkocka van, mint az előzőben, és az animáció simább, a kapott fájl mérete kisebb - csak 900 bájt. Amint az a diagramból (13. ábra) látható, az objektumra vonatkozó információk csak az első keretben tárolódnak, és minden új keretben csak a lap új pozícióit kell megjegyezni. Ez átlagosan csak 20 bájtot vesz igénybe.

A lap síkja körüli elforgatással történő leesés szemléltetésére megismételjük az előző példát, csak az utolsó kulcskeret módosításakor adjuk hozzá a parancsot Módosítás => Átalakítás => Flip Vízszintes. Ennek eredményeként a következő filmet kapjuk.

Most nézzünk egy példát, amikor egy levél közeledik a nézőhöz. Ehhez az utolsó képkockában a tükrözés helyett ( Vízszintesen megfordít) növeljük a lap méretét. Annak érdekében, hogy elkerüljük a lassulás érzését, amikor egy tárgy közeledik a nézőhöz, növelni kell a mozgás sebességét. Ennek a hatásnak az eléréséhez kattintson az első képkockára, és tekintse meg a részt Könnyű a panelben Tulajdonságok. Az Ease paraméter pozitív értékei a mozgás lelassulását, míg a negatív értékek felgyorsítják a mozgást. Válasszuk ki az objektum maximális gyorsulását.

Rizs. 14. Válassza ki az objektum maximális gyorsulását Könnyű = -100

Ehhez állítsa be a paraméter értékét Könnyű egyenlő -100 (14. ábra). Az eredmény egy film. Vegyük figyelembe, hogy az első képkockát a színpad mögé is elhelyezhetjük, ekkor kapunk egy filmet, amiben a levél berepül a képkockába és a néző felé mozdul. Simulálhatja a lap forgását egy eltolt szimmetriaközéppont körül. Remélem, maga az olvasó is tud majd kísérletezni, megnehezítve a végső képkocka módosítását, és ezzel megváltoztatva a lap mozgásának jellegét.

A bemutatott példákból kitűnik, hogy az automatikus mozgásanimáció akkor hatékony, ha egy objektum mozgása közbeni átalakulását egyszerű függvények (forgatás, méretezés stb.) adják meg. Ha összetett mozgásokat kell animálni (például egy rajzfilmfigura kezének mozgását), akkor a mozgástranszformációs animáció nem alkalmazható. Minden képkockát kézzel kell megrajzolni, azaz kockánkénti animációt használunk, amely kulcskockák halmazából áll. Így a kockánkénti animáció a legsokoldalúbb, de egyben a legtöbb munkaigényű animációtípus, ráadásul a legnehezebb fájlokat hozza létre. Ha lehetséges a képkockánkénti animációt automatikus animációval helyettesíteni, ez előnyösebb. Nézzünk meg néhány példát, amelyek lehetővé teszik az automatikus mozgás-animáció használatát repülés szimulálásakor.

Mozgás adott pálya mentén

A vaku lehetővé teszi egy objektum mozgásának beállítását egy adott útvonalon. Ennek a pályának a beállításához futtassa a parancsot Beszúrás => Idővonal => Mozgási útmutató.

Ennek eredményeként egy speciális réteg jelenik meg az aktuális réteg felett, amelynek alapértelmezés szerint a neve lesz 1. útmutató réteg.

Kattintsunk a pályarétegre, és a ceruza eszközzel rajzoljunk egy vonalat, amely mentén a lapot tervezzük mozgatni (15. ábra).

Rizs. 15. Példa mozgási pálya megadására

Most menjünk az első képkockára (kattintsunk rá az egérrel) és a megjelenő panelen Tulajdonságok jelölje be a négyzetet Snap(beállítja a pattintás módját a mozgási pályára) - ábra. 16.

Rizs. 16. Paraméter Snap beállítja a csattanási módot a mozgáspályához

Miután bejelölte a négyzetet Snap, a lap közepe a mozgás pályájához igazodik. A Nyíl eszközzel mozgathatja a levelet a mozgási pályán, de ha megpróbálja letépni a lapot és mellé helyezni, akkor az visszahúzódik, és ismét a mozgáspályához ragad (ábra). 17).

Rizs. 17. Úgy tűnik, hogy a tárgy a középpontjával ragaszkodik a mozgás pályájához

Menjen az utolsó képkockára, és hasonló módon kösse a lapot a mozgáspálya végpontjához. A film hangerejének növeléséhez adja hozzá az átalakítást Vízszintesen megfordít, - ennek eredményeként megkapjuk a filmet .

Amikor egy lap egy pálya mentén mozog, számunkra nem mindegy, hogyan forgatjuk el a mozgás irányába. De ha hasonló módon beállítjuk egy madár repülési útvonalát, akkor a görbe egyes részein kiderül, hogy a madár repül először farokkal.

Nyilvánvaló, hogy ha egy repülőgép vagy egy madár repülését akarjuk animálni, akkor arra van szükség, hogy az orrát mindig előre mozgassa. Flash-ben ez a fajta mozgás nagyon könnyen beállítható (18. ábra).

Rizs. 18. Ha bejelöli a négyzetet Orientation to Path, a madár fejjel előre repül

Jelölőnégyzet kötelező Orientation to Path, és a madár mozgása teljesen ismerősre változik (ennek a videónak a forrása egy madár repülése.fla).

Rizs. 19. Egyszínű háttér hozzáadása

Ha egyszínű hátteret szeretne hozzáadni, kattintson a háttérre és a megjelenő panelen Tulajdonságok(19. ábra) a terepen Háttér válassza ki a kívánt háttérszínt.

Ha hozzá akarjuk tenni háttér kép, ehhez külön rétegre lesz szükségünk. A Flash elvileg lehetőséget kínál a klasszikus animációban használthoz hasonló rétegrendszer létrehozására, amelyben a háttér és a különböző mozgó objektumok mindegyike a saját átlátszósági rétegére rajzolódik ki.

elhelyezésével háttérképés minden animált objektum a saját rétegén található, sokkal könnyebb irányítani őket. Tehát egy háttérkép hozzáadásához hozzunk létre egy új réteget. Ehhez kattintson a jobb gombbal az ábrán látható rétegre. A 19 az 1. rétegnek van kijelölve, és a legördülő menüben válassza a Réteg beszúrása sort. A hozzáadott rétegben rajzolja meg a napot. Annak érdekében, hogy ne keveredjünk össze a rétegszámokkal, adjuk a rétegnek a „háttér” nevet. Ehhez kattintson az aktuális névre, és írja be a kívánt nevet (20. ábra).

Rizs. 20. Egy új rétegen hozzon létre egy álló háttérobjektumot

ábrából látható. 20, a madár a nap mögött van, ami ellentmond a józan észnek. A rétegek felcseréléséhez használja a fogd és vidd módot a „háttér” nevű réteg lehúzásához.

Szerkesszük meg a film tárgyait (úgy, hogy a madár körözzön a nap hátterében, változtassuk meg repülésének pályáját és változtassuk meg a nap és a madár méreteinek arányát), és kapjuk meg a következő videót.

Rizs. 21. A felhő animálásához hozzon létre egy külön réteget

Most adjunk hozzá mozgó objektumokat az animációnkhoz, például egy felhőt. A felhőhöz hozzon létre egy új réteget, és állítsa be rajta a mozgástranszformációs animációt. Annak érdekében, hogy a felhő berepüljön a helyszínre, az ábrán látható módon helyezzük el. 21. Ennek eredményeként a következő filmet kapjuk (a film forrása a csatolt fájlban található