formă de animație (morphing)

Material de fond privind limbajele de programare majore și dispunerea de site-uri.

Tehnica Gata pentru crearea de ambele site-uri dinamice simple și complexe folosind PHP si MySQL.

dezvoltarea de site-uri web sub „cheie“.

Dezvoltarea de site-uri fragmente individuale, sfaturi cu privire la aspectul paginilor web și programare web.

instrument web

magazin web

servicii web

grafica web

Resurse web

formă de animație (morphing)

Doriți să fiți la curent cu evoluțiile care au loc pe site-ul? Inscrie-te pentru a primi cele mai recente știri și articole.

Uita-te pe Google

Formularul de animație (Morph). instrument de text

formă de animație (morphing)

Știm deja că o astfel de mișcare Tween. Acest tip de animație este cu siguranță liderul de Flash-animație. Dar, în Flash, nu putem muta doar obiecte, dar, de asemenea, pentru a schimba forma lor. Astfel, de exemplu, poate deveni un zatsem lup și urs iepure de câmp. O astfel de transformare poate fi realizată cu ajutorul unor forme de animație, sau orice altceva este numit, morph sau de rulare.

Morph, sau sub formă de animație

Animation permite forma prin setarea două keyframes cu diferite modele pentru a obține o tranziție lină (overflow) de la o imagine la alta, de la o formă la a doua. Mai mult decât atât, este posibil să se pună în aplicare o tranziție lină de la o culoare, dimensiune, locație la alta. Am folosit acest tip de animație pentru a crea un flash. Și acum avem de a face un lup iepure, elefant iepure de câmp de la Ursul de elefant și Ursul de a face o pisică.

Crearea morphing

Pentru a crea animație, am sozdadaim - keyframes începutul și sfârșitul animației, umplerea lor cu continut, definim parametrii. Iar restul este o chestiune de tehnică.

Pentru animalele de desen utiliza instrumentele de desen și de a crea o aparență de ceea ce este prezentat în figură.

Și aici vom trage privitorul.

La crearea unui nou obiect de la vechi de a folosi instrumente Spetsvydelenie și stilou.

Am finalizat lucrările de pregătire. Acum, pentru transformarea formei.

  1. Pentru a face acest lucru, creați două straturi de fiare și publicul meu. -Le prin apăsarea , a crea la fiecare 10 cadre, cadrele cheie.
  2. Propunem următorul scenariu: în timp ce schimbarea fața fiarei, privitorul este staționar, atunci este rândul lui să se schimbe expresiile faciale și fiara să fie fixată. Și așa de câteva ori. Schimbarea are loc scene de patru ori.
  • Acum, că avem o serie de keyframes, se introduce recoltate animale mai devreme pe un strat de fiare miniere, după cum urmează: în primul cadru cheie a pus lupul, al doilea și al treilea - un iepure, al patrulea și al cincilea - elefantul în al șaselea și al șaptelea urs și al optulea - cat.
  • Pentru un strat fiarelor my alege Proprietăți animații tip panou - formular cadre cheie: 1 (primul cadru), 3 (frame 20), 5 (40 frame), 7 (frame 60). Ca urmare a acestor acțiuni imagini evidențiate în verde, iar între ele întinse mâna.

  • Verificați clema prin apăsarea combinației de taste +.

    În browser-ul web ar arăta.

    probleme de morphing

    În cazul în care, în timpul testului video, ceva a mers prost, așa cum a fost planificat, formularul nu a respectat planul, și se întinde pe ecran, atunci aici sunt cateva reguli care te vor ajuta în viitor, pentru a evita astfel de erori.

    • Nu abuza labirintul de formă, mai ales în prezența unei varietăți de culori, detalii fine, care vor fi transformate în cunoscute numai pentru a le algoritmi, ignorând dorințele.
    • În organizarea mișcării, utilizează formularul punctele de întrerupere (acest lucru va fi discutat mai târziu). Dar, chiar și cu punctele de control stabilite într-o formă complexă, obiecte de morphing poate merge prost.
    • Dacă nu se formează complicate nu, apoi a crea un cadru cheie cu cifrele provizorii.
    • formă de animație este posibilă numai în cazul în care obiectele sunt degrupate. Pentru a degrupa obiecte, utilizați tastele +.

    parametrii morphing

    Dacă vom izola orice cadru intermediar morphing în panoul Properties va fi un grup de control (vezi. Fig. De mai sus). Cu ajutorul lor, putem seta unii parametri am creat morphing.

    Cele mai multe dintre aceste elemente sunt deja familiare pentru noi. Prin urmare, discuția se concentrează numai pe comenzile care definesc parametrii specifici pentru morphing.

    Acest element singur - aceasta drop-down lista Mix. În această listă de două elemente:

    • Distribuție - este setat implicit și permite pieselor intermediare netede între începutul și se termină cadrele cheie. Obiectele într-un cadru care generează Flash obținut în mod independent netedă.
    • Corner - algoritm de distribuție opus. proiectat pentru intermediar pentru a descoperi o mai simplificată: unghiulară, tinzând la utilizarea liniilor drepte. Cel mai bine este de a utiliza atunci când avem de-a face cu o cifră constând din linii drepte.

    Marcatorii dezlănțuite și utilizarea acestora

    Când vom crea un morphing, acest program poruncitor creează adesea ceea ce El vrea, ignorând ideile noastre creative. Una dintre modalitățile de a obține Flash pentru a face ceea ce vrem sunt markeri. morphing marcator ne permite să selectați un punct de pe fragmentul animat și ferm stabilit locația sa la începutul și sfârșitul animației. Astfel de markeri pot crea până la 26 de bucăți. Fiecare simbol este marcat cu caractere mici, de la o la z. Primele cheie Markerii cadru morphing sunt colorate în galben și verde final. Roșu indică faptul că punctul de control nu este în acest moment pe curba.

    Etichetati ochii animalelor noastre, care nu le va confunda cu animația de ansamblu.

    • Ne întoarcem acum la primul cadru cheie strat meu fiare. Deschideți meniul Edit -> Shape -> Adăugați un punct de control sau apăsați Ctrl + ++.
    • Un lup, care corespunde primului cadru, punctul de referință inițial apare ca un cerc roșu cu litera a. Peredvinte acest cerc pe ochi de lup, și veți vedea că marcatorul este schimbat în galben.
    • Selectați a doua keyframe cu imaginea unui iepure de câmp. Vă rugăm să rețineți că marcatorul finală a apărut pe ochiul unui iepure ca un cerc verde cu o literă toyzhe.
  • Se repetă cele de mai sus pentru al doilea ochi lup iepurele și alte animale ochi cadrele cheie, care utilizează sub formă de mișcare.
  • Verificați clema prin apăsarea combinației de taste +.

    Dacă ceva nu a mers bine, vă rugăm să rețineți următoarele:

    • De exemplu, în cazul în care ochiul, ochiul drept al fiarei stabilit punctul de referință cu litera a. ochiul drept, iar a doua fiară trebuie să respecte aceeași literă, și nu în literă.
    • Cel mai bine este de a plasa un punct de control invers acelor de ceasornic, pornind de la colțul din stânga sus.

    Eticheta de pe stratul

    Ați observat că pe straturile până când textul este situat direct pe cadre. Acest nume de imagine. În colțul din stânga sus al panoului Proprietăți este cadrul caseta de intrare. Folositi-l pentru a crea un nume unic sau o notă pentru oricare din cadru. nume de imagine va fi util mai ales pentru script-ul de programare și alte caracteristici. Cadrul conține numele este marcat cu un steag roșu. Cadrul conține Nota are două simboluri verzi - /. Notă nu este exportat în fișierul rezultat Shockwave / Flash, astfel încât să poată fi făcut suficient dislocate și nu afectează dimensiunea fișierului.

    Sub cadrul câmpului de intrare este o listă derulantă de tip etichetă. Acesta este dat de tipul de valoare în cadrul caseta de intrare. nume de imagine. Notă. Binding (Anchor).

    Ce este Anchor. Deci, numit cadru, care este un fel de cârlig pentru player-ul Flash. În cazul în care filmul este jucat într-un browser web, utilizatorul poate folosi iar butoanele acestui program, utilizatorul poate sari de la o ancoră la alta. Ancora este marcată cu o pictogramă galbenă.

    instrument de text

    Textul - aceeași parte nezamenisaya a rolei, precum și mișcarea. De multe ori, este mai bine să scrie câteva cuvinte, remiză megaocteți grafică inteligent. Textul este adesea o parte integrantă a imaginii, site-ul antet sau titlul unui film. Fără textul nu instituie un site web, complet realizat în Flash.

    Pentru a crea un text în programul furnizat instrumentul Text. În multe feluri, cum să lucreze cu text coincide cu lucrarea în orice alt program, cum ar fi Adobe Fireworks.

    Înainte de a modifica video, uita-te la principalele caracteristici ale lucrării cu text static în Flash. Mai jos sunt principalii parametri ai panoului Text Properties. Pentru apariția panoului, selectați blocul de text.

    Parametrii unității de testare:

    • Font (A) - o fereastră pentru a selecta setul de caractere.
    • Mărime font - Setați dimensiunea fontului.
    • -Windows text color pentru a selecta culoarea textului. Disponibil culoare solida umple. Selecția culorilor este efectuată selectorul deschis de culoare.
    • Stilul Bold (B) - dă textul cu caractere aldine.
    • Italic (I) - oferă un text marca oblică.
    • Aliniere - aliniază textul de pe unul dintre algoritmii selectați.
    • Schimbarea orientarea textului - vă permite să schimbați orientarea textului, selectați dintr-o listă derulantă una din opțiunile: orizontală. Vertically de la stânga la dreapta. Vertically de la dreapta la stânga.
    • spațiul dintre litere - o fereastra pentru instalarea parametrilor de urmărire (mări sau micșora distanțele interalphabetic).
    • Poziția de caractere - ajută la stabilirea poziției caracterului pe linie: Normal. Exponent. Subscript.
    • Tehnica netezirea font - din lista drop-down pentru a alege una dintre agoritmov textului anti-aliased.
    • kerning automată - tic include avtokerninga modul care permite egalizarea interalphabetic distanțe.

    Sarcina noastră este de a crea o etichetă statică. Alte caracteristici de lucru cu text vor fi discutate în detaliu mai târziu. Și, în sfârșit, creați o etichetă pentru a crea un film.

    Cele Flash-Animatorii, atât pentru începători cât și cu experiență ca efect: un fragment al imaginii dispare sau naobotrot apare pe ecran. Vom folosi un tween de mișcare pentru a crea acest efect. Animație va include nu numai mișcarea, dar, de asemenea, transformarea și efectele de culoare. Odată cu stabilirea transparenței efect de culoare textul nostru va dispărea de pe ecran.

    Și așa vom proceda. Creați un nou layer și atribuiți un nume - nume. Scrieți textul blocului de text - „Bestia mea - transformare uimitoare“ și luând-l în afara foaia de lucru (caseta gri).

    Există o mică problemă. Faptul că vă puteți seta efectele de culoare sunt doar copii. Și avem o casetă de text normal.

    Selectăm primul nume strat cadru cheie și de a converti blocul de text la probă. Pentru a face acest lucru de presă . În caseta de dialog care rezultă, da numele modelului - numele și atribuiți tipul „Drawing“

    După aceea Flash creează modelul și convertește blocul de text într-o instanță (un simbol)

    Acum a crea un cadru de 40 pe al doilea cadru cheie și al treilea cadru 80 pe rama cheie. Selectați a doua keyframe și ștergeți caseta de text. Intinsa a cadrelor cheie va arăta ca în imagine, săgeata care indică animație, să devină o linie punctată. Acest lucru înseamnă că animația noastră nu mai are doua keyframe (animație zdrențăroși), și Flash nu știe cum să-l termine.

    Pentru a pune capăt acest lucru, este necesar să se pună pe o bucată de-a doua keyframe numele instanței create de probă. Acesta este aliniat pe centrul foii de lucru.

    Acum să părăsească numele dispare de pe ecran. Alocați un al treilea cadru cheie și a pus în eșantion a creat numele foii de lucru exemplu. Panoul Timeline ia formularul de mai jos.

    Acum selectați 3 (cadru 80). În panoul Proprietăți în lista derulantă Color, selectați Alpha. În câmpul de intrare cu control amplasate în partea dreaptă a listei, introduceți o valoare de 0% - transparență totală. Numele Roller a devenit invizibil.

    Verificați clema prin apăsarea combinației de taste +.

    În browser-ul web ar arăta.

    clip publicare

    Acum, uita-te în directorul pentru a în cazul în care Flash-documente, și să acorde o atenție la faptul că a adăugat un alt document cu același nume ca și originalul Flash-fișier, dar cu extensia html. Rularea-l vom ajunge la clipul HTML-stranitsus.

    // player instalat unele revizuire 6.0
    // GetVariable ( "$ versiune") se blochează pentru versiunile 6.0.22 prin 6.0.29.
    // deci trebuie să fim atenți.

    // implicit la prima versiune publică
    Versiune = "WIN 6. 0. 21. 0";
    // aruncările dacă AllowScripAccess nu există (introdus în 6.0r47)
    axo.AllowScriptAccess = "întotdeauna";
    // în condiții de siguranță pentru a apela pentru 6.0r47 sau mai mare
    Versiune = AXO. GetVariable ( "$ versiune");
    > Captura (e) <
    >
    >
    if (! versiune)
    <
    încerca <
    // versiune va fi setat pentru 4.X sau 5.X jucător
    AXO = new ActiveXObject ( "ShockwaveFlash.ShockwaveFlash.3");
    Versiune = AXO. GetVariable ( "$ versiune");
    > Captura (e) <
    >
    >
    if (! versiune)
    <
    încerca <
    // versiune va fi setat pentru 3.x jucător
    AXO = new ActiveXObject ( "ShockwaveFlash.ShockwaveFlash.3");
    Versiune = "WIN 3. 0. 18. 0";
    > Captura (e) <
    >
    >
    if (! versiune)
    <
    încerca <
    // versiune va fi setat pentru 2.X jucător
    AXO = new ActiveXObject ( "ShockwaveFlash.ShockwaveFlash");
    Versiune = "WIN 2. 0. 0. 11";
    > Captura (e) <
    Versiune = - 1;
    >
    >

    În browser-ul web ar arăta.

    articole similare