Kako napraviti animaciju u flashu. O najjednostavnijoj animaciji u Flashu. Automatsko pisanje skripte

Korišćenje scena

Kao što znate, Flash vam omogućava da kreirate prilično složene filmove koji mogu sadržavati interaktivne elemente, animacije, klipove itd. Naravno, postoji potreba za pohranjivanjem i pretraživanjem različitih elemenata filma. Ako radite na velikom, složenom projektu, ima smisla podijeliti ga na nekoliko dijelova kojima se može upravljati, od kojih svaki sadrži određeni slijed događaja (animacija, interakcija korisnika, itd.). Ovo će znatno olakšati rad. Ulogu takvih fragmenata u Flash filmovima igraju scene. To su logično završeni minijaturni filmovi, koji zajedno čine jedan Flash film. Kada kreirate velike projekte, korištenje scena može značajno uštedjeti vrijeme.

Šta je pozornica

Kreiranje scene je efikasna tehnika koja omogućava podjelu određenog projekta na zasebne dijelove kojima se može upravljati. Svaka scena, kao što je već spomenuto, je minijaturni film. Broj korišćenih scena Flash filma ograničen je samo kapacitetom memorije računara. Scene se reproduciraju uzastopno, redoslijedom navedenim u panelu Scene i, budući da su nezavisne, u isto vrijeme su međusobno blisko povezane. Nikada ne postoji primetno kašnjenje između njih tokom reprodukcije. Mogućnosti korištenja scena su raznolike i gotovo neograničene. Na primjer, kada radite na projektu web stranice, možete implementirati odjeljke i pododjeljke kao scene. IN u poslednje vreme Kratki animirani Flash filmovi, čiji se sadržaj može podijeliti na logične dijelove kroz scene, postaju sve popularniji na internetu.

Panel scene

Listi scena sadržanih u filmu se pristupa pomoću panela Scene.

uključen), koji se otvara kada pozovete naredbu Window\u003e Design Panels\u003e Scene (Window\u003e Design Panels\u003e Scene). Ovaj panel vam omogućava da vidite listu dostupnih scena

i utvrditi redoslijed njihove reprodukcije u filmu - on je određen redoslijedom scena u listi. Osim toga, pomoću panela Scene, možete duplicirati, dodavati, brisati i premještati scene unutar liste.

Meni Opcije na panelu Scene sadrži samo tri komande: Uvećaj panel, Zatvori panel i Pomoć.

Panel scene

Panel za uređivanje

Panel za uređivanje se nalazi iznad vremenske linije, ispod glavnog menija programa. Da biste otvorili panel, koristite naredbu Window > Toolbars > Edit. Već ste koristili ovaj panel kada radite u prozoru Symbol Editor da biste izašli iz moda za uređivanje simbola (pogledajte Poglavlje 6). IN ovaj odeljak razgovaraćemo o tome funkcionalnost Uređivanje panela koji se odnose na rad sa scenama.

Panel za uređivanje sadrži naziv trenutne scene (na slici, trenutna scena je Scena 2). Možete se prebaciti na drugu scenu koristeći tipku Uredi scenu koja se nalazi na desnoj strani Edit panela, a naziv odabrane scene će biti prikazan u liniji. Funkcionalnost dugmeta Uredi scenu opisana je u odjeljku "Prebacivanje između scena".

Edit Scene Button Menu

Kreiranje i manipulacija scenama

Kao što je već spomenuto, panel Scene, koji se otvara pomoću naredbe Window > Design Panels > Scene, dizajniran je za rad sa scenama. U ovom odjeljku ćete naučiti kako možete koristiti ovaj panel za dodavanje, dupliciranje, preimenovanje scena i promjenu njihovog redoslijeda.

Dodavanje scene

Kako se kompleksnost projekta povećava, stalno ćete morati dodavati nove scene kako biste distribuirali logične dijelove njegovog sadržaja. To možete učiniti pomoću panela Scene. Da dodate scenu, slijedite ove korake:

Budite sigurni potreban dokument otvoren. Odaberite Window > Design Panels > Scene da otvorite panel Scene.

Kliknite na dugme Dodaj scenu, koje se nalazi u donjem desnom uglu panela, ili pozovite naredbu Scene iz menija Insert. Nakon ovih radnji, naziv nove scene će se pojaviti u prozoru panela Scene. Prema zadanim postavkama, svakoj novoj sceni se dodjeljuje naziv s brojem sekvence, koji je jedan više od naziva scene odabrane na trenutno(npr. scena 1, scena 2, itd.). Ime se shodno tome stavlja na listu.

Odaberite novu scenu na panelu Scene i kreirajte njen sadržaj. Kada kreirate novu scenu, Flash se automatski prebacuje na nju.

Lista scena na panelu Scene

Brisanje scene

Na ovaj način možete izbrisati scenu.

Otvorite panel Scene tako što ćete pozvati Window > Design Panels > Scene. Odaberite scenu koju želite da izbrišete.

Kliknite na dugme Delete Scene koje se nalazi u donjem desnom uglu panela. Da biste potvrdili brisanje scene, kliknite na dugme OK u dijaloškom okviru koji se otvara.

Dupliciranje scene

U prethodnim poglavljima smo već govorili o stvaranju duplikata različitih elemenata. Što se tiče kopiranja animacije, a posebno kompleksnog projekta sa veliki broj scene, ovaj proces bi bio prilično težak bez funkcije dupliranja, koja vam omogućava da kreirate tačne kopije bilo koje scene pritiskom na samo jedno dugme.

Otvorite panel Scene aktiviranjem naredbe Window > Design Panels > Scene (Window > Design Panels > Scene) i odaberite scenu koju želite duplicirati.

Kliknite na dugme Duplicate Scene koje se nalazi u donjem desnom uglu panela Scene.

Naziv duplirane scene pojavljuje se u prozoru panela Scene. Imajte na umu da se sastoji od imena originalne scene i riječi soru (kopija).

Duplicirana scena

Preimenovanje scena

Budući da se zadani nazivi dodijeljeni dupliranim i novim scenama razlikuju samo po svom redoslijedu, teško je identificirati scenu prilikom traženja određenog sadržaja. Stoga je u velikim projektima preporučljivo dodijeliti posebna imena scenama koje karakteriziraju njihov sadržaj. Proces preimenovanja scene neće vam oduzeti mnogo vremena.

Otvorite panel Scene tako što ćete izabrati Window > Design Panels > Scene i dvaput kliknite na naziv scene koju želite promijeniti. Ovo će vam omogućiti da uredite naziv scene.

Unesite novo ime i pritisnite Returt/Enter ili dvaput kliknite izvan panela Scene.

Preimenovanje scene u panelu Scene

Promjena redoslijeda scena

Redosled kojim se imena scena postavljaju u panel Scene određuje redosled kojim se scene reproduciraju u filmu. Nazivi scena u ovom panelu mogu se pomicati, postavljajući redoslijed u kojem se scene reproduciraju bez obzira na redoslijed kojim su kreirane.

Otvorite panel Scene odabirom Prozor > Dizajnerske ploče > Scena.

Postavite pokazivač miša preko naziva scene koju želite preurediti, kliknite lijevo dugme miša i, držeći ga, pomaknite pokazivač na željenu lokaciju na ploči. Primijetite da se dok pomičete pokazivač pojavljuje plava linija koja označava moguću novu poziciju naziva scene na listi.

Premještanje scene u panelu Scene

Prebacivanje između scena

Možete koristiti sljedeće alate za navigaciju za prebacivanje između različitih filmskih scena dok radite na Flash projektu.

Panel scene. Da biste prešli na željenu filmsku scenu, kliknite na naziv scene u panelu Scene. Zapamtite da je ime odabrane scene prikazano na panelu za uređivanje.

Dugme Uredi scenu. Kada kliknete na ovo dugme, koje se nalazi na desnoj strani panela za uređivanje, dobijate pristup meniju sa nazivima svih scena u filmu. Da biste otišli na željenu scenu, izaberite odgovarajuću stavku menija.

Panel Movie Explorer. Ovaj panel, koji se može otvoriti pomoću naredbe Window > Other Panels > Movie Explorer, prikazuje hijerarhijsku strukturu filma (pogledajte Poglavlje 8) i omogućava vam da pretražujete scene, likove i instance karaktera, kao i da zamijenite tekst i fontove.

Scene su predstavljene na panelu Movie Explorer kao hijerarhijski elementi višeg reda. Da biste prešli na određenu scenu, pronađite njeno ime na panelu Movie Explorer i kliknite na nju. Podrazumevano, ovaj panel prikazuje sadržaj samo odabrane scene. Da biste videli sadržaj svih scena istovremeno, aktivirajte komandu Prikaži sve scene u meniju Opcije ovog panela.

Panel Movie Explorer sa listom scena

Testiranje scene

Da biste testirali kreirani film direktno u Flash razvojnom okruženju, potrebno je da pritisnete Return/Enter, ali u tom slučaju opcije gledanja će biti ograničene na odabranu scenu. Sekvencijalna reprodukcija svih scena je moguća tek nakon što je film objavljen; Za testiranje slijedite ove korake:

Da biste testirali pojedinačnu scenu, odaberite je na panelu Scene i pritisnite Return/Enter, ili nakon odabira scene, otvorite kontrolni meni i aktivirajte komandu Test Scene.

Da biste testirali film, pozovite naredbu Test Movie iz Control menija ili koristite kombinaciju tipki Cmd/Ctrl+Return/Enter. Ovo će otvoriti novi prozor u kojem će se sve scene filma reproducirati u sekvenci definiranoj u panelu Scene.

Također možete reproducirati sve scene u filmu odabirom Play All Scenes iz menija Control.

Upravljanje scenama pomoću ActionScript-a

Scene mogu uvelike pojednostaviti cjelokupnu organizaciju filmskog sadržaja. Unaprijed određena sekvenca reprodukcije scena određuje linearnost filmova. Ali pored prednosti (na primjer, isključena je istovremena reprodukcija dvije scene), linearni filmovi imaju i nedostatke povezane s nemogućnošću promjene redoslijeda reprodukcije scena. Da biste riješili ovaj problem, koristite ActionScript skripte (posebno akcije okvira) za kontrolu scena.

Naučit ćete više o ActionScript-u i korištenju radnji okvira u 13. poglavlju. Ovaj odjeljak predstavlja neke od radnji koje možete koristiti za kontrolu scena.

gotoAndStopO - kada se ova radnja pozove, ona ide na određenu scenu i kadar i zaustavlja reprodukciju filma.

gotoAndPlay() - Pozivanje ove akcije uzrokuje da se glava reprodukcije pomakne na određenu scenu i kadar (reprodukcija filma se nastavlja od tog kadra).

pusti O - ova radnja vam omogućava da nastavite sa reprodukcijom filma nakon zaustavljanja.

stop O - pomoću ove akcije možete zaustaviti reprodukciju filma.

Do sada smo gledali Flash filmove koji se prikazuju bez intervencije gledalaca od početka do kraja. Međutim, Flash vam također omogućava kreiranje interaktivnih aplikacija u kojima korisnik može kontrolirati prikaz sadržaja. U ovoj lekciji ćemo početi da istražujemo elemente skriptnog jezika Action Script i pogledamo kako se on može koristiti za kreiranje interaktivnih aplikacija.

Kao primjer, napravimo foto album sa interaktivnim elementima interfejsa.

Dugme je interaktivni filmski isječak sa četiri kadra. Kada simbolu damo tip Button, Flash kreira vremensku liniju od četiri okvira za novi simbol:

Up-state je okvir koji odgovara situaciji kada dugme nije pritisnuto, a pokazivač miša nije lociran iznad dugmeta;

Okvir prekomernog stanja koji ilustruje izgled dugmeta kada je pokazivač miša postavljen preko dugmeta, ali dugme nije pritisnuto;

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

Stanje pogotka definiše oblast u kojoj dugme odgovara na klik mišem;

ovo područje se ne vidi na klipu.

Da biste kreirali dugme, pokrenite naredbu Insert => New Symbol (možete otkucati prečicu na tastaturi Control+F8). U dijaloškom okviru Kreiraj novi simbol koji se pojavi unesite naziv za simbol gumba (na primjer, but1) i odaberite tip simbola Dugme.

Bljesak će se prebaciti u mod za uređivanje karaktera, pružajući okvire Gore, Preko, Dolje i Hit. Prvi okvir, Up, postaje prazan ključni kadar. Nacrtajmo nepritisnuti prikaz dugmeta u ovom okviru (slika 1).

Rice. 1. Dugme UP-frame

Odaberimo drugi okvir, označen kao Over i koji odgovara stanju kada je kursor iznad dugmeta. Ubacimo ključni okvir u ovaj okvir (koristeći naredbu Insert => Keyframe), kao rezultat toga će se pojaviti ključni okvir koji u potpunosti ponavlja sadržaj gornjeg okvira. Promenimo boju dugmeta, kao što je prikazano na sl. 2.

Slika 2. Dugme iznad okvira

Slično tome, dodajte sljedeći okvir (Donji okvir) i nacrtajte pritisnuto stanje gumba (slika 3).

Rice. 3. Dugme za donji okvir

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

Idemo na glavnu scenu, pozovimo biblioteku pomoću naredbe Window => Library i kreiramo instancu simbola dugmeta prevlačenjem na pozornicu (slika 4.)

Rice. 4. Kreirajte instancu dugmeta prevlačenjem iz biblioteke Kao rezultat, dobijamo sledeći film. Kao što se vidi iz ovog filma, do pritiska na dugme dolazi ne samo kada kliknemo mišem na centralnu (radnu) oblast dugmeta, već i kada kliknemo na okvir oko njega. To je zbog činjenice da ako okvir Hit nije nacrtan, onda radni prostor

Dugme će odgovarati gornjem okviru.

Da bi dugme bilo pritisnuto samo u radnoj zoni, potrebno je ovu zonu definisati u okviru Hit, odnosno nacrtati dugme bez okvira (vidi sl. 5)

Rice. 5. Pritisnite dugme za okvir

Da bi dugme bilo interaktivno, potrebno je da povežete činjenicu pritiska na dugme sa izvršavanjem određenih komandi, odnosno opišete određeni scenario. Za kreiranje skripti u Flash-u postoji poseban jezik koji se zove Action Script. U ovoj lekciji ćemo se dotaknuti samo malog dijela mogućnosti ovog jezika, a u budućnosti ćemo se vratiti strukturi i sintaksi Action Script-a jer primjeri kreiranja interaktivnih filmova u Flashu postaju sve složeniji.

Razumijevanje akcionog skripta

Action Script je skriptni jezik – skup instrukcija koje kontrolišu elemente Flash filma. Akcione skripte mogu biti ugrađene u film ili pohranjene eksterno tekstualnu datoteku sa ekstenzijom AS.

Prilikom ugrađivanja scenarija u film, on se može ugraditi u različite dijelove filma. Preciznije, akcione skripte mogu sadržati ključne kadrove, instance dugmadi i instance filmskih isječaka. U skladu s tim, skripte se nazivaju Frame Actions, Button Actions i MovieClip Actions.

Akcione skripte se pokreću kada se dogode određeni događaji koje je pokrenuo korisnik ili sistem. Mehanizam koji ukazuje Flash program, koji izraz treba da se izvrši kada se dogodi određeni događaj naziva se rukovalac događajem.

Akciona skripta ima svoju sintaksu, slično kao i JavaScript. Flash MX 2004 podržava Action Script od svih prethodne verzije

Flash.

Jedan od glavnih koncepata Action Script su Akcije - naredbe koje izdaju instrukcije tokom izvršavanja SWF datoteke. Na primjer, gotoAndStop() šalje zaglavlje za reprodukciju na određeni okvir ili oznaku. Od riječi Actions dolazi naziv jezika - Action Script (doslovno - akcijska skripta).

Upoznat ćemo se sa većinom koncepata ovog jezika koristeći konkretne primjere.

Interaktivni foto album

Hajde da demonstriramo upotrebu dugmadi za upravljanje foto albumom - kreirajte skup fotografija i dodajte dva dugmeta koja će se pomerati kroz fotografije unapred i unazad.

Postavimo prvu fotografiju na glavnu vremensku liniju i dodamo dugme iz standardnog seta. Da biste pristupili željenoj fascikli, pokrenite naredbu Windows => Control Panels Common Libraries => Buttons (Slika 6). Rice. 6. Dodajte dugme iz standardne biblioteke. Odaberimo, na primjer, Key Buttons (dugmad slična tipkama tastature), otvorimo odgovarajuću mapu, selektujemo tipku lijevo (slika 7) i kreiramo instancu ovog gumba (prevlačenjem na pozornicu).

Rice. 7. Elementi foldera Key Buttons

Imajte na umu da kada postavite drugo dugme (taster-desno) na pozornicu i pomerite ga da se poravna sa prvim dugmetom, program daje nagoveštaj (isprekidanu liniju) koji vam omogućava da tačno pozicionirate dugme (slika 8).

Rice. 8. Automatsko poravnanje dugmadi na istom nivou

Da biste dodali skriptu, potrebno je da pozovete uređivač Action Script koristeći komandu Window => Development Panels => Actions ili pritiskom na taster F9.

Ako planirate da često pišete skripte, ovo je komanda na tastaturi koju vrijedi zapamtiti. Kao rezultat, pojavit će se editor Action Script (slika 9).

Rice. 9. Paneli uređivača akcijske skripte

Ako eksperimentišete sa isticanjem različitih elemenata u sceni dok nadgledate poruke u panelima uređivača Action Script, otkrićete da će vam program reći na koji element možete da "okačite" kod. Ako odaberete okvir na pozornici, u gornjem lijevom kutu uređivača pojavljuje se natpis Akcije - Okvir ako kliknete na dugme, pojavljuje se natpis Akcije - Dugme, odnosno program traži da će uneti kod; odnose se na skriptu dugmeta. A ako odaberete fotografiju, u polju namijenjenom unosu skripte pojavit će se poruka: Trenutni odabir ne može imati primijenjene radnje na njega (skripta se ne može primijeniti na ovaj odabrani objekt). Dodijelit ćemo skriptu gumbu. IN najnovije verzije ActionScript ima mogućnost pisanja centraliziranog koda, odnosno koda koji se nalazi na jednom mjestu, a ta mogućnost vam omogućava bolje razumijevanje velikih programa. Međutim, u

jednostavni primjeri

(što razmatramo) dodeljivanje skripte dugmetu je sasvim prihvatljivo.

Dakle, za dugme sa strelicom ulijevo, moramo formalizirati sljedeći scenario: „Ako je dugme otpušteno na određenom okviru, onda iz ovog okvira morate ići na prethodni okvir.“ U skladu sa sintaksom jezika Action Script (slika 10), to će izgledati ovako:

Ako kreirani film pokrenemo za izvršenje, kadrovi će se kontinuirano reprodukovati jedan za drugim, te je stoga prije svega potrebno da na prvom kadru damo komandu “Stop”. Da biste to učinili, dodajte odgovarajuću naredbu prvom okviru (slika 11).

Rice. 11. Skripta dodijeljena prvom kadru

Napomena: komanda više nije dodijeljena gumbu, već okviru. Činjenica da je okviru dodijeljena skripta zabilježena je na glavnoj liniji za uređivanje - malo slovo “a” se pojavljuje iznad podebljane tačke u oznaci okvira.

Kao rezultat, dobili smo sljedeći film.

Ako imamo samo nekoliko okvira u foto albumu, onda su dva dugmeta - "Naprijed" i "Nazad" - sasvim dovoljna, ali ako je skup fotografija velik, onda je preporučljivo imati i dugmad koji povezuju na početak i kraj filma. U sljedećem primjeru dodaćemo odgovarajuća dugmad: “Na prvi kadar” i “Na zadnji okvir”. Možete odabrati dugmad odgovarajuće mnemonike iz standardne biblioteke dugmadi iz foldera Dugmad kruga (Sl. 12).

Koristeći predloženi primjer, upoznaćemo se sa drugom komandom, gotoAndStop(), koja vam omogućava da odete do željenog okvira i da se zatim zaustavite.

Rice. 12. Dugmad iz foldera Dugmad kruga

Stavićemo kod na dugme za prelazak na prvi okvir (treći s leva na sl. 13), kao što je prikazano na sl. 13.

Rice. 13. Skripta za dugme “U prvom kadru”.

U slučaju foto albuma od pet okvira, dodajte prijelaznu skriptu "Do posljednjeg kadra" na posljednje dugme:

Automatsko pisanje skripte

Do sada smo sve komande upisivali ručno, ali paneli uređivača ActionScript pružaju brojne usluge za automatsko pisanje skripte.

Hajde da razmotrimo ove mogućnosti.

Rice. 14. Automatski alati za skriptiranje

Panel uređivača Action Script vam omogućava da odaberete, prevučete, preuredite i izbrišete komande.

Hajde da pokažemo kako možete da napišete istu skriptu za dugme "Prosledi" na automatizovan način. Odabirom foldera Movie Clip Control (gornji lijevi prozor na slici 14), možete pristupiti on event handleru, a zatim trebate ili dvaput kliknuti na odgovarajuću stavku ili prevući izraz na polje za pisanje skripte u Povuci i Način ispuštanja.

Rice. 15. Savjet za popunjavanje izraza ", ili pritisnite tipku " “, što odgovara pritiskanju tastera na tastaturi (strelica levo, desno), odnosno moguće je kreirati foto album koji će se „prelistati” pomoću tastera na tastaturi.

Rice. 16. Pozivanje tastera tastature

Koristimo naredbu keyPress ” (Sl. 16), zatim idite u mapu Timeline Control, odaberite naredbu nextFrame i prevucite je na radno polje (Sl. 17).

Rice. 17. NextFrame komanda se može naći u mapi Timeline Control

Za dugme koje vodi film na početak foto-albuma, možete izabrati pritiskom na taster Home iz menija kao događaj, a zatim (Sl. 18) prevući naredbu gotoAndStop na polje, usled čega druga hint će se pojaviti o mogućoj sintaksi ove naredbe.

Strelice u opisu alata vam omogućavaju da vidite različite opcije sintakse. Program nudi dvije opcije (sl. 18 i 19), odnosno nudi postavljanje scene i kadra ili samo okvira. U našem slučaju, dovoljno je navesti samo okvir.

Ako je naziv scene izostavljen, podrazumevano je preskakanje na okvir trenutne scene.

Rice. 18. Nagoveštaj o mogućoj sintaksi komande

Rice. 19. Strelica trougla vam omogućava da vidite opcije sintakse Nakon što svim dugmadima dodijelimo odgovarajuće dugmad na tastaturi

, dobićemo sledeći film, gde će se listanje fotografija odvijati sa tastature, a klikanje miša na tastere na ekranu neće izazvati nikakve posledice.

Da li je moguće dati scenario u kojem će različiti događaji dovesti do istih radnji? Ispostavilo se da možete - da biste to učinili, morate navesti listu imena događaja u on event handler. Ako stavite zarez u listu događaja nakon prvog događaja, sam program će vam ponuditi meni (Sl. 20).

Rice. 20. Kada unesete zarez u listu događaja, automatski se pojavljuje meni dodatnih komandi

Dodajmo prvom događaju (pritiskom na dugme na tastaturi) drugi događaj (otpuštanje dugmeta na ekranu): uključeno (pritisnite tipku"

", izdanje)

U razmatranom primjeru koristili smo prijelaz po broju kadra, ali ovaj metod nije uvijek prikladan: ako se broj okvira promijeni tokom procesa montaže filma, logika se može pokvariti. Pogodnije je koristiti prijelaz po oznaci okvira.

Pogledajmo primjer koji zahtijeva ne samo listanje albuma, već i pomicanje u različite odjeljke, odnosno složeniju navigaciju. Neka se album sastoji od crteža, kompjuterska grafika

i fotografije.

Označimo prvi okvir odjeljka "crteži" Slike na sličan način, dodijelit ćemo oznake "grafika" i "fotografija" prvim okvirima drugih sekcija.

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

Rice. 21. Primjer dodjeljivanja oznake okviru Sada dodajmo novi sloj

i nazovimo to Akcije. U prvom ključnom okviru sloja Akcije pozovite panel Actions Frame (pritiskom na dugme F9) i unesite komandu stop () (vidi sliku 22)

Rice. 22. Scenario za prvi snimak

Dodajmo još jedan sloj pod nazivom Subjects (subjects), u kojem ćemo dati naslove odgovarajućim okvirima: “Crteži” (Sl. 23), “Grafika” i “Fotografije”.

Rice. 23. Naslov za okvire sekcije “Crteži”.

Sada dodajmo dugmad menija sa sličnim imenima sa strane, koje ćemo postaviti na novi sloj pod nazivom Menu.

Odštampajmo prvu stavku menija "Slike" sa leve ivice i pretvorimo je u simbol dugmeta. Pomoću alata sa strelicom odaberite tekstualni blok “Slike” i izvršite naredbu Modify => Convert to Symbol (ova naredba se može izvršiti i pomoću tipke F8), u panelu Convert to Symbol postavite tip simbola Button i definišite njegovu ime kao pictureButton (sl. 24).

Rice. 24. Dodijelite naziv pictureButton dugmetu za odlazak u odeljak sa slikama Kreirajmo četiri okvira za dugme "Crteži": prvi će jednostavno predstavljati izvor

(Sl. 25), drugi je isti tekst samo plavom bojom, treći okvir ćemo preskočiti (u ovom slučaju okvir dolje će biti isti kao okvir Over), au okviru Hit nacrtaćemo pravokutnu površinu koji će definisati dugmad oblasti za klik (Sl. 26).

Rice. 25. Gore-okvir slike Dugme

Rice. 26. Pritisnite okvir dugmeta za sliku

Sada moramo priložiti skriptu novokreiranom dugmetu. Da biste to uradili, izaberite dugme u Sceni 1 i pritiskom na F9 pozovite panel Akcije, a zatim unesite kod prikazan na Sl. 27.

Da li ste se ikada zapitali šta se krije iza prelepe animacije banera na internetu? Ili novonastali crtani filmovi stvoreni uz pomoć kompjuterske tehnologije? Najčešće se zasnivaju na "mesu", tačnije, ovako se prevodi naziv Flash tehnologije sa engleskog. Danas ćemo pričati o flash animaciji za web stranicu:

Flash tehnologija

Multimedijalni okvir je razvio Macromedia. Ali nakon njegove apsorpcije (spajanja), sva prava na tehnologiju su preneta na novog vlasnika - Adobe Systems.

Područje moderne primjene Adobe Flash :

  • Kreiranje web aplikacija je prilično nov smjer. Podrazumijeva potpunu ili djelomičnu upotrebu Flash-a za kreiranje web stranica. Kada se delimično primeni, ova tehnologija stvara pojedinačne elemente dizajna: različite interaktivne menije, animirane tastere itd.

U poređenju sa konvencionalnim resursima html baziran Flash stranice imaju neke funkcije koje ograničavaju njihovu upotrebu. To uključuje visoku cijenu razvoja, zahtjeve za serverskim resursima, dugo vrijeme učitavanja uz sporu internetsku vezu i neke druge aspekte:

  • Implementacija multimedijalnih mogućnosti - za slušanje zvuka i reprodukciju videa na web stranicama često se koriste media playeri kreirani na bazi Flasha. Njihov razvoj uključuje upotrebu jednog od skriptnih jezika (obično JavaScript):
  • U online oglašavanju tehnologija se najčešće koristi za izradu animiranih banera. Oni ne podrazumijevaju samo igranje multimedijalnog oglašavanja, već i neku vrstu interakcije s korisnikom na bazi igre.

Osnove i alati Flash razvoja

Za kreiranje flash animacije najčešće se koriste tradicionalni Adobe alati:

  • Adobe Flash Professional – program za kreiranje interaktivne animacije (animator);
  • Adobe Flash Builder – okruženje za kreiranje interfejsa web aplikacija;
  • Adobe Flash Player– plejer integrisan u pretraživač za igranje Flasha.

Osim toga, veliki broj uređaja može reproducirati multimedijalni sadržaj ovog tipa. aplikacije trećih strana. Najpopularniji su Gnash, QuickTime i neki drugi:

Ova tehnologija vam omogućava da prikažete bilo koju vrstu grafike ( raster, vektor, 3D). Također podržava prijenos audio i video podataka. Posebno za mobilnih uređaja lagana Flash verzija Lite.

Glavni standard za Flash datoteke je ekstenzija SWF. Skraćenica je skraćenica od Small Web Format. Video snimljen u Flash-u ima ekstenzije datoteka FLV, F4V.

Razvoj interaktivne animacije u Flashu baziran je na vektorskoj grafici. Zahvaljujući tome bilo je moguće implementirati podršku za multimedijalnu platformu i neovisnost kvalitete animacije od rezolucije ekrana.

Veličina datoteke flash aplikacije je ista za sve korisnike, bez obzira na tehničke karakteristike ekran (rezolucija).

Interaktivna animacija u Flashu zasnovana je na morfiranju (vektorski tip), u kojem postoji spor protok između ključnih kadrova. Za reprodukciju podataka koristi se flash player, čiji je rad na mnogo načina sličan onome virtuelna mašina JavaScript. Softverska komponenta tehnologije implementirana je korištenjem ActionScript jezika.

Nedostaci tehnologije uključuju sljedeće točke:

  • Veliko opterećenje centralnog procesora klijentske mašine. To je zbog niske efikasnosti Flash virtuelne mašine, koja je ugrađena u pretraživač korisnika zajedno sa plejerom;
  • Velika vjerovatnoća grešaka - reprodukcija Flash animacije može se pojaviti sa velikom vjerovatnoćom grešaka. Štaviše, kvarovi u Flash reprodukciji negativno utiču na rad cele klijentske aplikacije (pretraživača). To je zbog nedovoljne kontrole tolerancije na greške programskog koda prilikom kreiranja Flash aplikacija;
  • Neuspješno indeksiranje - Sav tekstualni sadržaj prikazan u Flash sadržaju nije indeksiran. Ovo ograničenje To je posebno problematično za one resurse koji su stvoreni na bazi ove tehnologije.

Pregled softvera za kreiranje Flasha treće strane

Sothink SWF Quicker je uzet kao prototip aplikacije na kojoj ćemo demonstrirati osnove kreiranja Flash-a. Prema mišljenju mnogih stručnjaka, program je najrazumljiviji i najlakši za učenje.

Osim kreiranja i uređivanja, flash editor "može" raditi sa svim drugim vrstama web animacija (GIF, HTML i drugi standardi):

Nakon instalacije idite na korisničko sučelje programa. Nažalost, nakon lutanja kroz sve kutke i rupe, nismo pronašli prekidač za jezik interfejsa.

Da bismo razumjeli kako napraviti flash animaciju u ovoj aplikaciji, koristit ćemo ugrađene šablone. Dijaloški okvir „Novo iz predloška“ pojavljuje se odmah nakon pokretanja programa. Osim toga, može se pozvati putem stavke glavnog izbornika "Datoteka". Među ponuđenim opcijama odabrali smo izradu banera:

U sljedećem prozoru čarobnjaka iz padajuće liste morate odabrati predložak na osnovu kojeg će se kreirati animacija. Ispod je mali okvir u kojem se reproducira odabrani šablon:

U sljedećim koracima potrebno je podesiti dimenzije banera i unijeti 5 fraza teksta koje će se reproducirati u animaciji. Osim toga, potrebno je navesti adresu resursa na koji će korisnik biti odveden klikom na baner:

Nakon kompajliranja projekta i zatvaranja prozora čarobnjaka, možete pogledati rezultirajući video u ugrađenom playeru. Da biste to učinili potrebno je da kliknete na zelena strelica gore:

Nakon što zatvorite plejer, pogledajmo bliže interfejs aplikacije. Imajte na umu da se sastoji od dva glavna prozora: gornji je za uređivanje vremenskog perioda videa, a donji je običan grafički editor. Svaki od elemenata nalazi se na zasebnom sloju, koji se može modificirati pomoću standardnih alata koji se nalaze na bočnoj traci.

Preuzmite flash sa stranice Može na različite načine. Ali neki od njih su prilično glomazni, neki zahtijevaju korištenje dodataka, programa i web stranica. U međuvremenu, postoji vrlo elegantna i jednostavna metoda, čija implementacija ne oduzima mnogo vremena.

Prvo, hajde da definišemo zašto nam je uopšte potrebno ispiranje i šta je to. Flash je multimedijalna prezentacija napravljena pomoću programa Adobe Flash ili . Ove datoteke se nazivaju flash filmovi, iako mogu biti mnogo više od filma.

To mogu biti cijeli mini programi: baneri koji reagiraju na pokret miša posjetitelja, male igrice, tzv. flash igre, testovi sa rezultatima i tako dalje.

Ili mogu biti samo video ili audio snimci.

Standardna ekstenzija za flash datoteke je SWF. A kada naiđemo na takve video zapise 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 stranicu web stranice koja sadrži flash datoteku koja vam je potrebna. nakon ovoga:

Otvorite kod stranice

Kliknite desnim tasterom miša na stranicu i izaberite Pogledajte kod stranice . Još dvije opcije za otvaranje koda stranice: kliknite Ctrl+U, ili napišite prije adrese stranice view-source:

Potražite SWF video adresu u kodu

Da biste to učinili, omogućite pretragu pomoću interventnih tipki Ctrl+F, i unesite u polje za pretragu .swf. Zatim pritisnite Enter .

Pronađite samu adresu koja će izgledati ovako:

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

/papki/rolik.swf

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

Provjeravam adresu

Zalijepite adresu flash videa u adresnu traku bilo kojeg pretraživača na novoj kartici. Video bi se trebao pojaviti.

Neka adresa bude link

Ako se pojavi video, kopirajte adresu u notepad i napravite vezu, odnosno dodajte joj odgovarajući kod.

Kao rezultat toga, natpis u notesu će izgledati ovako:

Link

Preuzmite flash video na svoj računar

Otvorite sačuvani fajl u pretraživaču. Unutar njega će biti veza. Kliknite desnim tasterom miša na njega, izaberite Sačuvaj vezu kao... ili Sačuvaj putem veze... i sačuvajte fleš video na svom računaru.

Za gledanje, otvorite ga u pretraživaču ili koristite flash player, na primjer Macromedia Flash Player .

Druge opcije

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

  • Korištenje stranice http://save2go.ru. Unesite adresu stranice na kojoj se nalazi vaš flash film i kliknite Sačuvaj sa sajta . Link do videa će se pojaviti ispod. Kliknite desnim tasterom miša i izaberite Sačuvaj link kao... ili Sačuvaj preko linka... .
  • Korištenje dodatka za pretraživač, npr. Downloadhelper Za Firefox .
  • Koristeći programe za preuzimanje, npr. Preuzmite Master. Prvo morate pronaći adresu flash videa, a zatim ga umetnuti u program za preuzimanje.

Detaljnije informacije možete dobiti u odjeljcima “Svi kursevi” i “Uslužni programi”, kojima se može pristupiti preko gornjeg menija stranice. U ovim odjeljcima, članci su grupirani po temama u blokove koji sadrže najdetaljnije (koliko je moguće) informacije o različitim temama.

Također se možete pretplatiti na blog i saznati više o svim novim člancima.
Neće dugo trajati. Samo kliknite na link ispod:


Rad sa okvirima u više slojeva
Postavke odjeljka okvira

Početak


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

Zalijepimo bilo koji objekt na sloj "Layer 1".
Na primjer, hajde da uvezemo rasterska slika(pogledajte Uvoz) i zalijepite ga na sloj "Layer 1".
Slika je prikazana na lijevoj strani.

Kreiranu animaciju možete pogledati pritiskom na tipku Enter.

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




Primjer 4:

Možete dodati ili ukloniti jednostavne okvire.

Uklanjanje okvira:
Da biste izbrisali okvir, morate ga odabrati kontekstni meni izaberite Ukloni okvire.
Da biste odabrali više okvira, držite pritisnutu tipku Ctrl.
Na primjer, trebamo smanjiti broj okvira za pozadinu za 5 okvira. Odaberimo 5 kadrova i izbrišemo ih - umjesto 30 kadrova ostaje 25.

Dodavanje okvira:
Na primjer, trebamo dodati nekoliko okvira na sloj “Background”. Da biste to učinili, možete kliknuti na okvir 30 i, kada se pored kursora pojavi mali pravougaonik, jednostavno prevucite okvir 30 udesno na vremenskoj liniji.

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

Posljednje ažurirano: decembar 2014