Crearea artei generatoare cu HYPE

În timpul acestui tutorial vom lega matematica și designul împreună. Vom explora cadrul lui Branden Hall și a lui Joshua Davis HYPE și vom crea arta generatoare din cod.


Rezultatul final al rezultatelor

Să aruncăm o privire asupra rezultatului final pe care îl vom strădui:


Pasul 1: Structura proiectului

Înainte de scufundări cap la cap în cod, să facem un scurt moment pentru a ne familiariza cu fișierele proiectului.

În interiorul fișierului sursă .zip veți găsi un dosar pentru fiecare pas semnificativ, astfel încât să puteți vedea exact ce modificări au fost făcute. De asemenea, veți găsi un dosar numit Base, faceți o copie a acestui dosar, deoarece acesta va servi ca punct de plecare.

În interiorul dosarului de bază avem a cos unde SWF-ul nostru va fi publicat. A src care conține fișierele noastre ActionScript 3 și Flash și, în sfârșit, a lib în care vom stoca fișierele SWC din cadrul HYPE.


Pasul 2: Obținerea HYPE

În continuare, trebuie să luăm cea mai recentă versiune a cadrului HYPE de la domiciliu la www.hypeframework.org.

După terminarea descărcării, deschideți fișierul .zip. Veți găsi două fișiere SWC numite hype-framework.swc și hype-extended.swc. Copiați ambele acestea în folderul Base \ lib.

Aceste fișiere SWC sunt, în esență, o colecție de fișiere sursă pentru cadrul, toate rulate într-un fișier pentru ușurință.


Pasul 3: Adăugarea SWCS în Flash

Ultimul pas necesar pentru a face totul în desfășurare este să-i spuneți lui Flash să caute cele două noi fișiere SWC atunci când compilam filmul, altfel se va arunca o grămadă de erori în felul nostru, nu frumos!

Deschide Main.fla în interiorul Baza \ src apoi selectați File (Fișier), Publish Settings (Setări publicare). Selectați fila Flash așa cum se arată, în noua fereastră care se deschide, selectați fila Cărți bibliotecă.

Apăsați butonul "Navigare în SWC" și continuați să adăugați ambele fișiere SWC în fișierul Flash. Odată ce acest lucru este complet, este timpul să începeți adăugarea unui cod!


Pasul 4: Init HYPE

Deschideți fișierul sursă Main.as în editorul ales. Adăugați următoarele proprietăți private și initHype () metodă:

 clasa publică Extensie principală MovieClip // private privat privat var bitmapCanvas: BitmapCanvas; clip privat varContainer: Sprite; privat var objectPool: ObjectPool; / ** * constructor * / funcția publică Main () // introduce in Hype framework initHype ();  / ** * inițierea membrilor Hype pe care vi-l vom folosi și configurarea lor înainte de a rula animația * / funcția privată initHype (): void // clipContainer este folosit ca părinte pentru toate obiectele noastre clipContainer = new Sprite (); addChild (clipContainer); 

În următorii pași vom examina fiecare dintre aceste obiecte pe care le-am adăugat ca proprietăți private, începând cu clipContainer Sprite.

Deoarece designul nostru va avea peste o sută de obiecte care se mișcă în jurul ecranului imediat, vom avea nevoie de ceva pentru a le adăposti pe toți - doar adăugându-le Etapă va deveni problematică în continuare pe linie. Răspunsul este de a crea un AS3 regulat spiriduș să acționeze ca părinte.


Pasul 5: BitmapCanvas

Prima parte reală a HYPE, BitmapCanvas poate fi considerat a spiriduș sau mai bine, a Bitmap / BitmapData la care ne vom picta obiectele, fiecare cadru, ca o pânză de pictori.

Îl creăm chiar sub codul clipContainer și îl definim cu o lățime și înălțime care să se potrivească cu Etapă. Adăugăm-o la Etapă dar, de asemenea, spune-le startCapture (clipContainer, true), acest lucru spune pur și simplu BitmapCanvas pentru a face un instantaneu al clipContainer fiecare cadru. Pentru moment, însă, păstrați acest comentariu!

 / ** * initierea membrilor Hype pe care vi le vom folosi si configurarea inainte * pentru rularea functiei animatie * / private initHype (): void // clipContainer este folosit ca parinte pentru toate obiectele noastre clipContainer = new Sprite ( ); addChild (clipContainer); // gândiți-vă la BitmapCanvas ca spațiu gol pe care îl vom "picta" // fiecare cadru cu date noi de imagine bitmapCanvas = nou BitmapCanvas (stage.stageWidth, stage.stageHeight); //bitmapCanvas.startCapture(clipContainer, true); addChild (bitmapCanvas); 

Pasul 6: ObjectPool

Dacă ați lucrat cu jocuri, ați întâmpinat, probabil, conceptul de ObjectPool. Deoarece crearea de obiecte noi este prea mult de o lovitură pe procesor, vom crea o piscină cu o anumită cantitate de obiecte înainte ca jocul sau aplicația să înceapă. Apoi vom folosi obiectele din această piscină și, după ce vom ieși afară, le vom recicla și reutiliza din nou, ceea ce evită crearea de noi obiecte. Acest lucru este folosit în mod obișnuit pentru gloanțe / lasere în jocuri și aceeași logică este folosită în HYPE.

Dacă te uiți la Biblioteca Main.fla în Flash vei vedea că am creat o MovieClip denumit circleShape și având în vedere identificatorul de legătură al lui circleShape astfel încât putem crea mai multe copii ale acestui obiect cu cod; aceasta este ceea ce noastră ObjectPool va găzdui.

Adăugați ObjectPool sub codul BitmapCanvas, după cum urmează:

 / ** * initierea membrilor Hype pe care vi le vom folosi si configurarea inainte * pentru rularea functiei animatie * / private initHype (): void // clipContainer este folosit ca parinte pentru toate obiectele noastre clipContainer = new Sprite ( ); addChild (clipContainer); // gândiți-vă la BitmapCanvas ca spațiu gol pe care îl vom "picta" // fiecare cadru cu date noi de imagine bitmapCanvas = nou BitmapCanvas (stage.stageWidth, stage.stageHeight); //bitmapCanvas.startCapture(clipContainer, true); addChild (bitmapCanvas); // creați o colecție de 10 obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 10); 

Pasul 7: Crearea obiectelor utilizând ObjectPool.request ();

Acum avem setarea jucătorilor noștri de bază clipContainer, BitmapCanvas si ObjectPool cu cele 10 clipuri, e timpul să începem să facem lucrurile să se miște.

Pentru a obține un element din ObjectPool putem folosi objectPool.request (); care ne va da a circleShape MovieClip de la Biblioteca Flash pentru a lucra cu.

ObjectPool ne oferă și objectPool.onRequestObject () metodă care este o modalitate la îndemână de a atribui proprietățile unui clip de fiecare dată când o cerem. Adăugați următoarele mai jos unde ați instanțiat ObjectPool:

 // creați o colecție de 10 obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 10); // de fiecare dată când solicităm o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = Math.random () * stage.stageWidth; clip.y = Math.random () * stage.stageHeight; clipContainer.addChild (clip); 

Pasul 8: Consultați Rezultatul

Cu noul cod adăugat, de fiecare dată când cerem un obiect din bazin folosind objectPool.request () va crea o circleShape. Adăugați-l la clipContainer și poziționați-l aleator pe ecran. Puteți testa acest lucru prin modificarea constructorului pentru a arăta astfel:

 / ** * constructor * / funcția publică Main () // introduce in Hype framework initHype (); objectPool.request (); 

Dacă totul a mers bine ar trebui să aveți un singur cerc singur pe ecran.


Pasul 9: Solicitarea tuturor obiectelor o dată

Vă amintiți că am setat ObjectPool dimensiunea la 10? Ei bine, vom merge la ante și vom crește la 100 de obiecte schimbând următoarele:

 // creați o colecție de 10 obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 100);

Putem modifica declarația de solicitare anterioară ca fiind citită ca cere tot() asa:

 / ** * constructor * / funcția publică Main () // introduce in Hype framework initHype (); objectPool.requestAll (); 

Acum ar trebui să avem 100 de cercuri împrăștiate pe suprafața ecranului.


Pasul 10: Adăugarea vibrațiilor fixe

Acum avem 100 circleShapes distribuit în jurul ecranului este timpul să facem designul să vină la viață prin adăugarea de mișcare.

Să începem prin aplicarea a FixedVibration la alfa și scară proprietățile fiecărui clip. Putem folosi ObjectPools onRequestObject metoda de implementare a acesteia, după cum se arată:

 // creați o colecție de 10 obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 100); // de fiecare dată când solicităm o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = Math.random () * stage.stageWidth; clip.y = Math.random () * stage.stageHeight; // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); clipContainer.addChild (clip); 

Să aruncăm o privire mai atentă la FixedVibration obiecte pe care le-am creat. Fiecare FixedVibration Obiectul pe care îl creăm are 7 parametri, respectiv ei sunt după cum urmează:

  • Obiectul care trebuie aplicat FixedVibration în cazul nostru circleShape numit "clip".
  • Proprietatea care trebuie aplicată FixedVibration de data aceasta lucram cu alfa și scară proprietăţi.
  • Al treilea parametru este Primăvară din FixedVibration, cu cât este mai mare numărul de mișcare mai "elastic". O valoare între 0 și 1 va funcționa cel mai bine.
  • Următorul este Uşura din vibrație, cu cât valoarea este mai mică cu atât mai rapid va aluneca între următoarele două valori. O valoare între 0 și 1 va funcționa cel mai bine.
  • Valoarea minimă este în continuare, aceasta va fi cea mai mică vibrație care va afecta.
  • În mod similar, valoarea maximă va fi valoarea maximă pe care va vibra vibrația.
  • În cele din urmă, ultimul parametru este relativ, implicit acest lucru fals.

Deci, cum se potrivesc toate acestea? Să ne uităm la cum scară proprietatea este afectată de FixedVibration. Este dat min și Max valorile de 0,05 și 0,8, Primăvară valoarea este destul de ridicată la 0.9 și Uşura este destul de scăzut la 0,05 ceea ce face scara erratically și rapid.

Faceți o joacă în jurul valorii de aceste valori pentru a vă simți cum influențează mișcarea.

Când testez fișierul nostru Flash, ar trebui să obținem ceva de genul:


Pasul 11: Adăugarea unei vibrații variabile

Foarte similar cu FixedVibration, VariableVibration va ajusta o proprietate a unui obiect cu o valoare care fluctuează. Diferența fiind că VariableVibration nu este liniară așa cum sugerează și numele.

Modificați codul după cum urmează pentru a plasa clipurile în centrul ecranului Etapă, numai de data aceasta vom aplica o VariableVibration la X și y valorile pentru a începe să vedeți o anumită mișcare!

 // de fiecare dată când cerem o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = stage.stageWidth / 2; clip.y = stage.stageHeight / 2; // adăugați o vibrație variabilă pentru mișcarea x / y a fiecărui cercSeta var varVVib: VariabilVibration = vibrație variabilă nouă (clip, "x", 0.97, 0.03, 40); var yVib: Variație vibrație = Variație nouă variabilă (clip, "y", 0.97, 0.03, 40); xVib.start (); yVib.start (); // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); clipContainer.addChild (clip); 

Să aruncăm o privire mai atentă la VariableVibration obiecte pe care le-am creat. Fiecare VariableVibration Obiectul pe care îl creăm are doar 5 parametri, respectiv ei sunt după cum urmează:

  • Obiectul care trebuie aplicat VariableVibration în cazul nostru circleShape numit "clip".
  • Proprietatea care trebuie aplicată VariableVibration , de data aceasta lucrăm cu proprietățile x și y.
  • Al treilea parametru este Primăvară a vibrației.
  • Următorul este Uşura a vibrației.
  • Parametrul final este Gamă din valorile produse. Cu cât numărul este mai mare cu atât efectul este mai neregulat.

Fișierul nostru Flash ar trebui să arate așa ceva când este publicat:


Pasul 12: Adăugarea unor Wow

Începe să arate bine, dar putem face mult mai bine! Sa nu uiti asta bitmapCanvas.startCapture () te-am rugat să rămâi necondiționat în pasul 6? Continuați și dezactivați-o, apoi testați din nou filmul.

Acest lucru este mai mult ca acesta!


Pasul 13: Un truc rapid pentru rotire

Un truc foarte simplu pentru a adăuga o mișcare spirală este adăugarea unei alte vibrații la proprietatea de rotație a clipului, așa cum este cazul:

 // de fiecare dată când cerem o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = stage.stageWidth / 2; clip.y = stage.stageHeight / 2; // adăugați o vibrație variabilă pentru mișcarea x / y a fiecărui cercSeta var varVVib: VariabilVibration = vibrație variabilă nouă (clip, "x", 0.97, 0.03, 40); var yVib: Variație vibrație = Variație nouă variabilă (clip, "y", 0.97, 0.03, 40); xVib.start (); yVib.start (); // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); // adăugați un FixedVibration la rotația cerculuiSchip var rotationVib: FixedVibration = FixedVibration nou (clip, "rotație", 0.9, 0.05, 0, 360, false); rotationVib.start (); clipContainer.addChild (clip); 

Pasul 14: Un truc rapid pentru rotire

Înainte de a testa acest salt peste Flash și deschideți-l circleShape MovieClip in biblioteca.

Așa cum este arătat, trageți cercul chiar din centru în orice direcție. Cu cât o mutați mai departe din centru, cu atât mai multe spirale vor apărea în design atunci când publicați:


Pasul 15: ExitShapes

O problemă cu animația noastră actuală este că odată ce clipurile se deplasează de pe ecran, foarte rar se întorc. Putem rezolva această mică problemă prin crearea unui ExitShapeTrigger.

Un ExitShapeTrigger este o zonă considerată sigură pentru clip. Atunci când clipul părăsește această zonă, trebuie să efectuăm un fel de funcție, cum ar fi solicitarea unui nou clip de la ObjectPool.

Definim un ExitShapeTrigger ca mai jos:

 // de fiecare dată când cerem o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = stage.stageWidth / 2; clip.y = stage.stageHeight / 2; // adăugați o vibrație variabilă pentru mișcarea x / y a fiecărui cercSeta var varVVib: VariabilVibration = vibrație variabilă nouă (clip, "x", 0.97, 0.03, 40); var yVib: Variație vibrație = Variație nouă variabilă (clip, "y", 0.97, 0.03, 40); xVib.start (); yVib.start (); // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); // adăugați un FixedVibration la rotația cerculuiSchip var rotationVib: FixedVibration = FixedVibration nou (clip, "rotație", 0.9, 0.05, 0, 360, false); rotationVib.start (); // definiți o ieșire ExitShape var: ExitShapeTrigger = nou ExitShapeTrigger (onExitShape, clip, exitShape, true); exit.start (); clipContainer.addChild (clip);  // reciclarea obiectelor private function onExitShape (clip: MovieClip): void trace ("circleShape a părăsit ecranul!"); 

Acest lucru va crea un ExitShapeTrigger cu următorii parametri:

  • Metoda de declanșare în momentul producerii evenimentului.
  • MovieClip pentru a testa dacă nu se află în zona dată.
  • MovieClip folosit pentru a defini zona de siguranță, s-ar putea să fi observat deja am creat deja acest lucru, numit-o exitShape și a pus-o pe Etapă în Flash.
  • Ultimul parametru este Introduceți o dată pavilionul, tocmai a stabilit acest lucru Adevărat deocamdata.

Pasul 16: Eliberarea ObjectPool

În continuare de la ExitShape am introdus în ultimul pas, vom edita pur și simplu onExitShape astfel încât ori de câte ori un clip să se îndepărteze de pe ecran, îl ștergem și îl solicităm pe cel nou ObjectPool.

Până acum am lucrat cu cerere() și cere tot() metode ale ObjectPool, când vrem să ștergem vechea pe care o folosim eliberare (clip) metodă:

 // reciclarea obiectelor private function onExitShape (clip: MovieClip): void // elimina din ObjectPool si clipContainer objectPool.release (clip); clipContainer.removeChild (clip); // a obține un nou clip din ObjectPool objectPool.request (); 

Pasul 17: Adăugarea unei neclare

HYPE dispune de capacitatea de a adăuga foarte ușor filtre, cum ar fi estomparea și strălucirea obiectelor. Pentru a adăuga o notă mai pizzazz la designul pe care îl vom adăuga a BlurFilter la proiectul care utilizează FilterCanvasRhythm:

 // gândiți-vă la BitmapCanvas ca spațiu gol pe care îl vom "picta" // fiecare cadru cu date noi de imagine bitmapCanvas = nou BitmapCanvas (stage.stageWidth, stage.stageHeight); bitmapCanvas.startCapture (clipContainer, true); addChild (bitmapCanvas); // adăugarea unui blur neclar: FilterCanvasRhythm = noul FilterCanvasRhythm ([new BlurFilter (1.1, 1.1, 1)], bitmapCanvas); blur.start (TimeType.TIME, 100); // creați o colecție de obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 100);

Codul de mai sus creează o FilterCanvasRhythm care ia un filtru ca parametru și îl aplică pe bitmapCanvas am declarat mai devreme.

Testați proiectul, începe să se întâlnească acum!


Pasul 18: Adăugarea unor diferențe

Putem adăuga cu ușurință o mică adâncime la compoziție adăugând mai multe forme în amestec. Mai degrabă decât să creeze și să gestioneze mai multe ObjectPools, putem adăuga cadre în cercul original pe care l-am folosit și alegem aleator cadrul pe care să-l jucăm.

Încearcă acum, editează circleShape obiect în biblioteca Flash. Creați un nou Cadru cheie, selectați o culoare nouă și desenați o nouă formă. Continuați și creați câteva propriile dvs. cadre cheie, în următorul pas ne vom uita la punerea lor în aplicare cu cod. Aceasta este noua noastră formă:

? în comparație cu vechea noastră formă:


Pasul 19: Alegerea cadrelor aleatoare pentru forma de cerc

Cu cercul nostru de caractere, care are acum câteva noi keyframe, putem introduce această singură linie de cod pentru a alege un cadru de utilizat de fiecare dată când sunăm objectPool.request ():

 // de fiecare dată când cerem o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = stage.stageWidth / 2; clip.y = stage.stageHeight / 2; // alege un cadru aleatoriu clip.gotoAndStop (Math.ceil (Math.random () * 3)); // adăugați o vibrație variabilă pentru mișcarea x / y a fiecărui cercSeta var varVVib: VariabilVibration = vibrație variabilă nouă (clip, "x", 0.97, 0.03, 40); var yVib: Variație vibrație = Variație nouă variabilă (clip, "y", 0.97, 0.03, 40); xVib.start (); yVib.start (); // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); // adăugați un FixedVibration la rotația cerculuiSchip var rotationVib: FixedVibration = FixedVibration nou (clip, "rotație", 0.9, 0.05, 0, 360, false); rotationVib.start (); // definiți o ieșire ExitShape var: ExitShapeTrigger = nou ExitShapeTrigger (onExitShape, clip, exitShape, true); exit.start (); clipContainer.addChild (clip); 

Ca o notă rapidă, codul de cadru aleatoriu de mai sus va comuta între cadrele 1, 2 și 3. Poate fi necesar să ajustați această valoare la numărul de cadre din circleShape.


Pasul 20: Finalizați

Este timpul să vă testați filmul și să vă bucurați de amestecul dintre modelele și culorile funky, deoarece cadrul HYPE ia codul dvs. și îl amestecă într-o piesă de artă generativă.

Aici este codul final de referință:

 pachet import hype.extended.behavior.FixedVibration; import flash.display.Sprite; import flash.display.MovieClip; import flash.filters.BlurFilter; import hype.extended.behavior.VariableVibration; import hype.extended.rhythm.FilterCanvasRhythm; import hype.extended.trigger.ExitShapeTrigger; import hype.framework.core.ObjectPool; import hype.framework.core.TimeType; import hype.framework.display.BitmapCanvas; / ** * Un tutorial pentru a introduce HYPE. Un cadru vizual * de Branden Hall și Joshua David pentru crearea * de design generativ / iterativ cu cod. * * @author Anton Mills * @version 06/02/2011 * / public class Main extinde MovieClip // proprietăți private priv var bitmapCanvas: BitmapCanvas; clip privat varContainer: Sprite; privat var objectPool: ObjectPool; / ** * constructor * / funcția publică Main () // introduce in Hype framework initHype (); // începe secvența objectPool.requestAll ();  / ** * inițierea membrilor Hype pe care vi-l vom folosi și configurarea lor înainte * pentru rularea funcției animație * / private initHype (): void // clipContainer este folosit ca părinte pentru toate spritele noastre clipContainer = new Sprite (); addChild (clipContainer); // gândiți-vă la BitmapCanvas ca spațiu gol pe care îl vom "picta" // fiecare cadru cu date noi de imagine bitmapCanvas = nou BitmapCanvas (stage.stageWidth, stage.stageHeight); bitmapCanvas.startCapture (clipContainer, true); addChild (bitmapCanvas); // adăugarea unui blur neclar: FilterCanvasRhythm = noul FilterCanvasRhythm ([new BlurFilter (1.1, 1.1, 1)], bitmapCanvas); blur.start (TimeType.TIME, 100); // creați o colecție de obiecte și păstrați-le într-un ObjectPool // pentru a fi utilizate în animația objectPool = ObjectPool nou (circleShape, 100); // de fiecare dată când cerem o nouă formă din piscină // va efectua următoarea objectPool.onRequestObject = funcție (clip: MovieClip): void clip.x = stage.stageWidth / 2; clip.y = stage.stageHeight / 2; // alege un cadru aleatoriu clip.gotoAndStop (Math.ceil (Math.random () * 3)); // adăugați o vibrație variabilă pentru mișcarea x / y a fiecărui cercSeta var varVVib: VariabilVibration = vibrație variabilă nouă (clip, "x", 0.97, 0.03, 40); var yVib: Variație vibrație = Variație nouă variabilă (clip, "y", 0.97, 0.03, 40); xVib.start (); yVib.start (); // adăugați un FixedVibration la proprietățile alpha și la scară ale fiecărui cercFormul atunci când este cerut var alphaVib: FixedVibration = FixedVibration nou (clip, "alpha", 0.9, 0.05, 0.5, 1.5, false); var scaleVib: FixedVibration = vibrație fixă ​​nouă (clip, "scale", 0.9, 0.05, 0.05, 0.8, false); alphaVib.start (); scaleVib.start (); // adăugați un FixedVibration la rotația cerculuiSchip var rotationVib: FixedVibration = FixedVibration nou (clip, "rotație", 0.9, 0.05, 0, 360, false); rotationVib.start (); // definiți o ieșire ExitShape var: ExitShapeTrigger = nou ExitShapeTrigger (onExitShape, clip, exitShape, true); exit.start (); clipContainer.addChild (clip); ;  // reciclarea obiectelor private function onExitShape (clip: MovieClip): void objectPool.release (clip); clipContainer.removeChild (clip); objectPool.request (); 

Concluzie

Este vorba doar despre încheierea introducerii cadrului HYPE, mulțumită foarte mult pentru timpul acordat. Sper că v-ați bucurat și vă amintiți că am zgâriat doar suprafața unor efecte fantastice care pot fi făcute cu cadrul. Vă rugăm să verificați site-ul web al HYPE la adresa www.hypeframework.org pentru câteva exemple fantastice ale cadrului și cum au ajuns alții la nivelul următor cu integrarea Away3D / Papervision!


Mai multe resurse HYPE pe Activetuts+

  • Codificați o compoziție haotică inspirată de Joshua Davis de Bruno Crociquia
  • Introducere în cadrul HYPE ActionScript 3.0 de către Tom Green
  • Sfat rapid: Cum să exportați Flash în PNG cu HYPE de Daniel Apt
  • Creați un vizualizator de muzică Mesmeric cu HYPE de Franci Zidar
Cod