Kako napraviti animaciju u flashu. Kako napraviti flash animaciju. Promjena redoslijeda scena

💖 Sviđa li vam se? Podijelite vezu sa svojim prijateljima

Preuzmite flash sa stranice Limenka različiti putevi. Ali neki od njih su prilično glomazni, neki zahtijevaju upotrebu dodataka, programa i web stranica. U međuvremenu, postoji vrlo elegantna i jednostavna metoda, čija provedba ne oduzima puno vremena.

Prvo, definirajmo zašto nam uopće treba ispiranje i što je to. Bljesak je multimedijska prezentacija izrađena pomoću programa Adobe Flash ili . Te se datoteke nazivaju flash filmovi, iako mogu biti puno više od filma.

To mogu biti čitavi mini-programi: banneri koji reagiraju na kretanje miša posjetitelja, male igrice, tzv. flash igre, testovi s rezultatima i tako dalje.

Ili stvarno mogu biti samo video ili audio isječci.

Standardna ekstenzija za flash datoteke je SWF. A kada naiđemo na takve videe na web stranicama, ne možemo ih preuzeti tako lako kao slike, desnom tipkom miša. Morat ćete se malo više potruditi.

Preuzmite flash sa stranice

Idite na web stranicu koja sadrži flash datoteku koja vam je potrebna. Nakon toga:

Otvorite kod stranice

Desnom tipkom miša kliknite stranicu i odaberite Pogledajte kod stranice . Još dvije opcije za otvaranje koda stranice: klik Ctrl+U, ili napišite prije adrese stranice pogled-izvor:

Potražite SWF video adresu u kodu

Da biste to učinili, omogućite pretraživanje pomoću prečaca Ctrl+F, i unesite u polje za pretraživanje .swf. Zatim pritisnite Unesi .

Pronađite samu adresu koja će izgledati ovako:

http: //site.ru/papki/rolik.swf
ili ovako:

/papki/rolik.swf

Ako imate drugu opciju, tada je adresa relativna, a ne apsolutna. Mora se postaviti lijevo od adrese početna stranica stranica.

Provjeravam adresu

Zalijepite adresu flash videa u adresnu traku bilo kojeg preglednika u novoj kartici. Trebao bi se pojaviti video.

Učinite adresu poveznicom

Ako se video pojavi, kopirajte adresu u notepad i napravite od nje poveznicu, odnosno dodajte odgovarajući kod.

Kao rezultat toga, natpis u bilježnici izgledat će ovako:

Veza

Preuzmite flash video na svoje računalo

Otvorite spremljenu datoteku u pregledniku. U njemu će biti poveznica. Desnom tipkom miša kliknite na njega, odaberite Spremi vezu kao... ili Spremi putem veze... i spremite flash video na svoje računalo.

Za gledanje, otvorite ga u pregledniku ili upotrijebite npr. flash player Macromedia Flash Player .

Druge opcije

Iako mi se gore opisana opcija čini najzanimljivijom, ipak ću dati druge načine za spremanje bljeskalice na vašem računalu.

  • Korištenje stranice http://save2go.ru. Unesite adresu stranice na kojoj se nalazi vaš flash film i kliknite Spremi sa stranice . Ispod će se pojaviti poveznica na videozapis. Kliknite desnom tipkom miša i odaberite Spremi link kao... ili Spremi putem veze... .
  • Korištenje dodatka za preglednik, npr. Downloadhelper Za Firefox .
  • Korištenje programa za preuzimanje, na primjer, Download Master. Prvo morate pronaći adresu flash videa, a zatim ga umetnuti u downloader.

Detaljnije informacije možete dobiti u odjeljcima “Svi tečajevi” i “Utilities” kojima se može pristupiti putem gornjeg izbornika stranice. U tim su odjeljcima članci grupirani po temama u blokove koji sadrže najdetaljnije (što je više moguće) informacije o različitim temama.

Također se možete pretplatiti na blog i saznati više o svim novim člancima.
Ne oduzima puno vremena. Samo kliknite na donju poveznicu:

Do sada smo gledali Flash filmove koji se reproduciraju bez intervencije gledatelja od početka do kraja. Međutim, Flash također omogućuje stvaranje interaktivnih aplikacija u kojima korisnik može kontrolirati prikaz sadržaja. U ovoj lekciji počet ćemo istraživati ​​elemente skriptnog jezika Action Script i pogledati kako se može koristiti za stvaranje interaktivnih aplikacija. Kao primjer, napravimo foto album s interaktivnim elementima sučelja. Ali prije nego što počnemo opisivati ​​akcijsku skriptu, trebali bismo razgovarati o još jednoj vrsti simbola koju smo dosad ignorirali - simbolima gumba. Za izgradnju interaktivnog sučelja jednostavno su neophodni.

Stvaranje gumba

Gumb je interaktivni filmski isječak s četiri kadra. Kada simbolu dodijelimo vrstu gumba, Flash stvara vremensku crtu od četiri okvira za novi simbol:

Up-state je okvir koji odgovara situaciji kada gumb nije pritisnut i pokazivač miša se ne nalazi iznad gumba;

Okvir iznad stanja koji prikazuje izgled gumba kada je pokazivač miša postavljen iznad gumba, ali gumb nije pritisnut;

U donjem stanju ovaj okvir prikazuje izgled gumba kada se pritisne;

Hit state definira područje u kojem gumb reagira na klik mišem; ovo područje nije vidljivo u isječku.

Za kreiranje gumba pokrenite naredbu Insert => New Symbol (možete upisati tipkovničku prečicu Control+F8). U dijaloškom okviru Stvori novi simbol koji se pojavi unesite naziv za simbol gumba (na primjer, but1) i odaberite vrstu simbola Gumb.

Flash će se prebaciti u način rada za uređivanje znakova, pružajući okvire Gore, Preko, Dolje i Hit. Prvi okvir, Gore, postaje prazan ključni kadar. Nacrtajmo nepritisnuti pogled na gumb u ovom okviru (slika 1).

Riža. 1. Gumb GORE okvira

Odaberimo drugi okvir, označen kao Over i koji odgovara stanju kada je kursor iznad gumba. Umetnimo ključni okvir u ovaj okvir (koristeći naredbu Insert => Keyframe), pri čemu će se pojaviti ključni okvir koji u potpunosti ponavlja sadržaj Up-frame-a. Promijenimo boju gumba, kao što je prikazano na sl. 2.

Slika 2. Gumb iznad okvira

Na sličan način dodajte sljedeći okvir (Donji okvir) i nacrtajte pritisnuto stanje gumba (Sl. 3).

Riža. 3. Gumb za donji okvir

Za sada nećemo crtati ništa u okviru Hit, ali ćemo se vratiti na ovaj okvir malo kasnije.

Idemo na glavnu scenu, pozovimo knjižnicu koristeći naredbu Window => Library i kreirajmo instancu simbola gumba povlačenjem na pozornicu (slika 4.)

Riža. 4. Stvorite instancu gumba povlačenjem iz biblioteke

Kao rezultat toga, dobivamo sljedeći film. Kako se vidi iz ovog filma, pritiskanje gumba događa se ne samo kada mišem kliknemo na središnje (radno) područje gumba, već i kada kliknemo na okvir oko njega. To je zbog činjenice da ako hit okvir nije nacrtan, tada će radna površina gumba odgovarati gore okviru.

Da bi se tipka pritiskala samo u radnom području, potrebno je tu zonu definirati u Hit okviru, odnosno nacrtati tipku bez okvira (vidi sl. 5)

Riža. 5. Gumbi hit-frame

Nakon što dodamo potreban Hit-frame, dobit ćemo sljedeći film, u kojem kada kliknete na okvir, gumb se ne pritisne.

Da bi gumb bio interaktivan, potrebno je povezati činjenicu pritiska na gumb s izvršavanjem određenih naredbi, odnosno opisati određeni scenarij. Za izradu skripti u Flashu postoji poseban jezik koji se zove Action Script. U ovoj lekciji dotaknut ćemo samo mali dio mogućnosti ovog jezika, au budućnosti ćemo se vratiti strukturi i sintaksi Action Scripta kako primjeri stvaranja interaktivnih filmova u Flashu budu postajali sve složeniji.

Razumijevanje akcijske skripte

Action Script je skriptni jezik - skup uputa koje kontroliraju elemente Flash filma. Akcijske skripte mogu se ugraditi u film ili pohraniti izvana tekstualna datoteka s nastavkom AS.

Kada se scenarij ugrađuje u film, može se ugrađivati ​​u različite dijelove filma. Točnije, akcijske skripte mogu sadržavati ključne kadrove, instance gumba i instance filmskog isječka. U skladu s tim, skripte se nazivaju radnje okvira, radnje gumba i radnje filmskog isječka.

Akcijske skripte pokreću se kada se dogode određeni događaji koje pokreće korisnik ili sustav. Mehanizam koji ukazuje Flash program, koja se naredba treba izvršiti kada se dogodi određeni događaj naziva se rukovatelj događajima.

Akcijska skripta ima vlastitu sintaksu, poput JavaScripta. Flash MX 2004 podržava Action Script od svih prethodne verzije Bljesak.

Jedan od glavnih koncepata akcijske skripte su akcije - naredbe koje izdaju upute tijekom izvođenja SWF datoteke. Na primjer, gotoAndStop() šalje playhead na određeni okvir ili znak. Od riječi Actions dolazi naziv jezika - Action Script (doslovno - akcijska skripta). Upoznat ćemo se s većinom koncepata ovog jezika na konkretnim primjerima.

Interaktivni foto album

Pokažimo korištenje gumba za upravljanje fotoalbumom - stvorite skup fotografija i dodajte dva gumba koji će se kretati kroz fotografije naprijed i natrag.

Postavimo prvu fotografiju na glavnu vremensku traku i dodamo gumb iz standardnog skupa. Da biste pristupili željenoj mapi, morate pokrenuti Windows naredba=> Upravljačke ploče Zajedničke knjižnice => Gumbi (Sl. 6).

Riža. 6. Dodajte gumb iz standardne knjižnice

Kao rezultat izvršavanja ove naredbe, pojavit će se ploča koja sadrži veliki skup unaprijed nacrtanih gumba različite vrste. Odaberimo, na primjer, Key Buttons (gumbi slični tipkama na tipkovnici), otvorimo odgovarajuću mapu, odaberemo tipku s lijevom tipkom (slika 7) i stvorimo instancu ovog gumba (povlačenjem na pozornicu).

Riža. 7. Elementi mape Key Buttons

Imajte na umu da kada postavite drugi gumb (tipka-desno) na pozornicu i pomaknete ga da se poravna s prvim gumbom, program daje savjet (isprekidana linija) koji vam omogućuje da točno postavite gumb (Slika 8).

Riža. 8. Automatsko poravnavanje tipki na istoj razini

Kako biste dodali skriptu potrebno je pozvati Action Script editor pomoću naredbe Window => Development Panels => Actions ili pritiskom na tipku F9. Ako planirate često pisati skripte, ovo je tipkovnička naredba koju vrijedi zapamtiti. Kao rezultat, pojavit će se uređivač akcijske skripte (slika 9).

Riža. 9. Ploče uređivača akcijskih skripti

Ako eksperimentirate s isticanjem različitih elemenata u sceni dok nadgledate poruke u uređivačkim pločama skripte akcije, vidjet ćete da će vam program reći na koji element možete "okačiti" kod. Ako odaberete okvir na pozornici, u gornjem lijevom kutu uređivačke ploče pojavljuje se natpis Akcije - Okvir, ako kliknete na gumb, pojavljuje se natpis Akcije - Gumb, odnosno program traži da će uneseni kod; odnose se na skriptu gumba. A ako odaberete fotografiju, pojavit će se poruka u polju za unos skripte: Na trenutni odabir ne mogu se primijeniti akcije (skripta se ne može primijeniti na ovaj odabrani objekt).

Dodijelit ćemo skriptu gumbu. U najnovije verzije ActionScript ima mogućnost pisanja centraliziranog koda, odnosno koda koji se nalazi na jednom mjestu, a ta vam mogućnost omogućuje bolje razumijevanje velikih programa. Međutim, u jednostavni primjeri(što razmatramo) dodjeljivanje skripte gumbu sasvim je prihvatljivo.

Dakle, za gumb sa strelicom lijevo, moramo formalizirati sljedeći scenarij: "Ako se gumb otpusti na određenom okviru, tada iz ovog okvira morate ići na prethodni okvir." U skladu sa sintaksom jezika Action Script (slika 10), to će izgledati ovako:

Prvi redak sadrži rukovatelja događajem gumba on(), koji ima format:

Dodajmo sada nekoliko ključnih okvira tako da se gumbi stvoreni u prvom okviru kopiraju u njih i postavimo potrebne fotografije u novostvorene okvire.

Ako kreirani film pokrenemo na izvršenje, kadrovi će se kontinuirano reproducirati jedan za drugim, te stoga prije svega trebamo dati naredbu “Stop” na prvom kadru. Da biste to učinili, dodajte odgovarajuću naredbu u prvi okvir (slika 11).

Riža. 11. Skripta dodijeljena prvom okviru

Napomena: naredba više nije dodijeljena gumbu, već okviru. Činjenica da je okviru dodijeljen skript zabilježena je u glavnom retku za uređivanje - malo slovo "a" pojavljuje se iznad podebljane točke u oznaci okvira.

Kao rezultat, dobili smo sljedeći film.

Ako imamo samo nekoliko okvira u foto albumu, tada su dva gumba - “Naprijed” i “Natrag” sasvim dovoljna, ali ako je skup fotografija velik, onda je poželjno imati i gumbe koji povezuju na početak i kraj filma. U sljedećem primjeru ćemo dodati odgovarajuće gumbe: “Na prvi okvir” i “Na zadnji okvir”. Možete odabrati gumbe odgovarajuće mnemotehnike iz standardne biblioteke gumba iz mape Circle Buttons (Sl. 12).

Koristeći predloženi primjer, upoznat ćemo se s drugom naredbom, gotoAndStop(), koja vam omogućuje da prijeđete na željeni okvir i zatim se zaustavite.

Riža. 12. Gumbi iz mape Circle Buttons

Stavit ćemo kod na gumb za odlazak na prvi okvir (treći slijeva na slici 13), kao što je prikazano na slici. 13.

Riža. 13. Skripta za gumb “U prvom okviru”.

U slučaju fotoalbuma od pet okvira, dodajte prijelaznu skriptu "Do zadnjeg okvira" na zadnji gumb:

Automatizirano pisanje skripte

Do sada smo sve naredbe upisivali ručno, ali uređivačke ploče ActionScripta pružaju brojne usluge za automatizirano pisanje skripti. Razmotrimo te mogućnosti.

Riža. 14. Automatizirani alati za skriptiranje

Uređivačka ploča Action Script omogućuje odabir, povlačenje, preuređivanje i brisanje naredbi.

Pokažimo kako možete napisati istu skriptu za gumb "Naprijed" na automatizirani način. Odabirom mape Movie Clip Control (gornji lijevi prozor na sl. 14), možete pristupiti on event handler-u, a zatim trebate dvaput kliknuti na odgovarajuću stavku ili povući izraz u polje za pisanje skripte u Drag and Način pada.

Riža. 15. Savjet za dovršavanje izraza

Kao rezultat toga, na radnom polju će se pojaviti traženi izraz i ovakva naznaka (slika 15): odaberete željenu naredbu iz izbornika i izraz se automatski dovršava. Kao što se može vidjeti iz izbornika, možete odabrati ne samo stanje povezano s gumbima na ekranu - također možete odabrati iz izbornika Sl. Pritisak tipke od 15 točaka “ " ili pritisnite tipku " ”, što odgovara pritiskanju tipki na tipkovnici (strelica lijevo, strelica desno), odnosno moguće je kreirati foto album koji će se “prelistavati” pomoću tipki na tipkovnici.

Riža. 16. Pozivi tipkama tipkovnice

Upotrijebimo naredbu keyPress ” (Slika 16), zatim idite u mapu Timeline Control, odaberite naredbu nextFrame i povucite je u radno polje (Slika 17).

Riža. 17. Naredba nextFrame može se pronaći u mapi Timeline Control

Za tipku koja film odvodi na početak fotoalbuma, kao događaj možete odabrati iz izbornika pritiskom na tipku Home, a zatim (Sl. 18) na polje povući naredbu gotoAndStop, čime će se pojaviti još jedna pojavit će se savjet o mogućoj sintaksi ove naredbe.

Strelice u opisu alata omogućuju vam pregled različitih opcija sintakse. Program nudi dvije mogućnosti (sl. 18 i 19), odnosno nudi postavljanje scene i okvira ili samo okvira. U našem slučaju dovoljno je navesti samo Frame. Ako je naziv scene izostavljen, zadano je skočiti na kadar trenutne scene.

Riža. 18. Savjet o mogućoj sintaksi naredbi

Riža. 19. Trokutasta strelica omogućuje pregled opcija sintakse

Nakon što svim gumbima dodijelimo odgovarajuće gumbi tipkovnice, dobit ćemo sljedeći film, gdje će se listanje fotografija odvijati s tipkovnice, a klik mišem na tipke na ekranu neće uzrokovati nikakve posljedice.

Je li moguće dati scenarij u kojem će različiti događaji dovesti do istih radnji? Ispostavilo se da možete - da biste to učinili, trebate ispisati popis naziva događaja u on rukovatelju događajima. Ako u popisu događaja iza prvog događaja stavite zarez, program će vam sam ponuditi izbornik (Slika 20).

Riža. 20. Kada u listu događaja unesete zarez, automatski se pojavljuje izbornik dodatnih naredbi

Dodajmo prvom događaju (pritisak tipke na tipkovnici) drugi događaj (otpuštanje tipke na ekranu):

uključeno (pritisnite tipku" ", pusti)

Ponovimo postupak za preostale gumbe i kao rezultat ćemo dobiti foto album u kojem će se fotografije pomicati i mišem i tipkovnicom (originalnu FLA datoteku možete dobiti na poveznici).

U razmatranom primjeru koristili smo prijelaz prema broju okvira, ali ova metoda nije uvijek prikladna: ako se numeriranje okvira promijeni tijekom procesa uređivanja filma, logika se može pokvariti. Pogodnije je koristiti prijelaz pomoću oznake okvira. Pogledajmo primjer koji zahtijeva ne samo listanje albuma, već i prelazak na različite odjeljke, odnosno složeniju navigaciju.

Neka se album sastoji od crteža, računalna grafika i fotografije.

Označimo prvi okvir odjeljka "crteži" Slike; slično ćemo dodijeliti oznake "grafika" i "fotografija" prvim okvirima ostalih odjeljaka.

Kreirajmo sloj za postavljanje naljepnica i nazovimo ga Lables. Da biste označili okvir, u panelu Svojstva potrebno je odabrati vrstu oznake Naziv i zapisati njen naziv. U našem slučaju, Slike (Sl. 21). Slično ćemo postaviti markere u okvire 5 i 10 (slika 22).

Riža. 21. Primjer dodjele oznake okviru

Dodajmo sada novi sloj i nazovimo ga Radnje. U prvom ključnom okviru sloja radnji pozovite panel radnji okvir (pritiskom na tipku F9) i unesite naredbu stop () (vidi sl. 22)

Riža. 22. Skripta prvog okvira

Dodajmo još jedan sloj pod nazivom Subjects (predmeti), u kojem ćemo dati naslove odgovarajućim okvirima: “Drawings” (Sl. 23), “Graphics” i “Photos”.

Riža. 23. Naslov za okvire odjeljka "Crteži".

Sada dodamo gumbe izbornika sa sličnim nazivima sa strane, koje ćemo postaviti na novi sloj pod nazivom Izbornik.

Ispišimo prvu stavku izbornika "Slike" s lijevog ruba i pretvorimo je u simbol gumba. Pomoću alata strelice odaberite tekstualni blok “Slike” i izvršite naredbu Modify => Convert to Symbol (ovu naredbu možete izvršiti i pomoću tipke F8), u panelu Convert to Symbol postavite tip simbola Button i definirajte njegov ime kao pictureButton (Sl. 24).

Riža. 24. Dodijelite naziv pictureButton gumbu za odlazak na odjeljak sa slikama

Kreirajmo četiri okvira za gumb "Crteži": prvi će jednostavno predstavljati izvorni tekst (Sl. 25), drugi će predstavljati isti tekst samo u plavoj boji, treći ćemo okvir preskočiti (u ovom slučaju okvir prema dolje bit će isto što i okvir Over ), au okviru Hit nacrtat ćemo pravokutno područje koje će definirati područje u kojem je pritisnuta tipka (Sl. 26).

Riža. 25. Gornji okvir slike Button

Riža. 26. Hit-okvir gumba pictureButton

Sada moramo priložiti skriptu novostvorenom gumbu. Da biste to učinili, odaberite gumb u Sceni 1 i pritiskom na F9 pozovite panel Actions, a zatim unesite kod prikazan na sl. 27.

Riža. 27. Skripta za prelazak na okvir s oznakom


Rad s okvirima u više slojeva
Postavke odjeljka okvira

Početak rada


Prvi okvir sloja označen je praznim krugom. To znači da su i okvir 1 i sloj 1 prazni - na sloju nema umetnutih objekata.

Zalijepimo bilo koji objekt na sloj "Layer 1".
Na primjer, uvozimo rasterska slika(pogledajte Import) i zalijepite ga na sloj "Layer 1".
Slika je prikazana lijevo.

Izrađenu animaciju možete pogledati pritiskom na tipku Enter.

Obično je pozadinski sloj zaključan kako bi se spriječilo njegovo mijenjanje dodavanjem ikone lokota.




Primjer 4:

Možete dodati ili ukloniti jednostavne okvire.

Uklanjanje okvira:
Da biste izbrisali okvir, morate ga odabrati kontekstni izbornik odaberite Ukloni okvire.
Za odabir više okvira držite pritisnutu tipku Ctrl.
Na primjer, moramo smanjiti broj okvira za pozadinu za 5 okvira. Odaberemo 5 okvira i izbrišemo ih - umjesto 30 okvira ostaje 25.

Dodavanje okvira:
Na primjer, moramo dodati nekoliko okvira na sloj "Pozadina". Da biste to učinili, možete kliknuti okvir 30 i, kada se pored pokazivača pojavi mali pravokutnik, jednostavno povucite okvir 30 udesno na vremenskoj traci.

Ili možete kliknuti bilo koji okvir između 1. i 30. okvira i odabrati Umetni okvir iz kontekstnog izbornika.

Zadnje ažuriranje: prosinac 2014



reci prijateljima
Pročitajte također