5

scris de:
Peter

Tutorial AS 3.0 ComputeSpectrum

30.01.09

Flash TutorialPentru acest exemplu aveti nevoie de Adobe Flash si cunostiinte de baza in Action Script 3.0 .

Pornim prin a creea un nou document flash ActionScript 3.0. Salvam acest document cu numele de Spectrum.fla, apoi selectăm primul keyframe al acestui document si apasam tasta F9 pentru a ne aduce in fata fereastra de programare.

Pasul 1

Pasul 1

In fereastra de programare introducem urmatoarea linie de cod:

var muzica=new Sound(new URLRequest(“song.mp3”));

Pasul 3

Pasul 3

Aici declaram variabila muzica fiind de tipul Sound, iar pentru a incarca melodia noastra,song.mp3,(care se afla an acelasi director cu Spectrum.fla) folosim comanda new URLRequest.

Apoi adaugam o noua variabila ce va tine toată informatia de care avem nevoie pentru a creea Spectrumul.

var ba:ByteArray= new ByteArray();

Pasul 3

Pasul 3

Dupa care adaugam o noua variabila de tip Sprite ce va contine toata grafica necesara si o adaugam pe scena principala.

var grafica:Sprite=new Sprite();

addChild(grafica);

Pasul 4

Pasul 4

Urmeaza sa construim o noua functie numita loop care ne va procesa toata informatia

function loop(e:Event):void{

}

Pasul 5

Pasul 5

In interiorul functiei loop adaugam urmatoarele linii de cod:

grafica.graphics.clear();
grafica.graphics.lineStyle(1,0×000000);
grafica.graphics.beginFill(0x000000);

Pasul 6

Pasul 6

Aceasta linie de cod ne sterge orice am “desenat” in pasii anteriori

grafica.graphics.clear();

Aceasta linie de cod defineste stilul liniei, cifra 1 reprezentand grosimea liniei, iar 0x000000 reprezinta culoarea neagra in sistem hexadecimal

grafica.graphics.lineStyle(1,0×000000);

Aceasta linie de cod ne defineste culoarea care va “umple” Spectrumul, in cazul nostru folosim tot culoarea neagra

grafica.graphics.beginFill(0x000000);

Acum vom folosi functia din flash ,SoundMixer.computeSpectrum , ce ne va oferi informatii legate de melodie

SoundMixer.computeSpectrum(ba,true);

Pasul 7

Pasul 7

Dupa care vom creea un ciclu for care ne va “desena” spectrumul prin functia drawRect

for(var i:uint=0; i<512;i++){

var num:Number=-ba.readFloat()*100-10;

sp.graphics.drawRect(i,200,1,num);

}

Pasul 8

Pasul 8

Iar acum adaugam un event listener pentru scena

addEventListener(Event.ENTER_FRAME, loop);

Si apelam functia play

muzica.play();

Pasul 9

Pasul 9

Apoi testam aplicatia cu tastele CTRL+Enter si obtinem urmatorul rezultat:

Rezultat

Rezultat

Acum puteti experimenta cu acest cod pentru a obtine mai multe rezultate. De exemplu daca schimam urmatoarea linie de cod

SoundMixer.computeSpectrum(ba,false);

Vom obtine

Rezultat 2

Rezultat 2

Daca schimbati in ciclul for

for(var i:uint=0; i<256;i++)

veti obtine un spectrum calculat doar pentru un canal audio.Putem seta pozitia pe orizontala a elementului grafica

grafica.x=20;

iar apoi facem urmatoarele modificari in ciclul for

for(var i:uint=0; i<256;i=i+4){

var num:Number=-ba.readFloat()*100-1;

grafica.graphics.drawRect(i,200,1,num);

}

Pentru a obtine urmatorul rezultat:

Get Adobe Flash player


Apasa aici pentru a descarca sursele.

3 comentarii        legatura permanenta, flux RSS comentarii
  1. Tabita says:

    Hello again, multumesc pentru raspunsul rapid! Am incercat spectrumul si functioneaza perfect spre surprinderea mea. Nu am fost observat ca ai atasat si sursa 🙂
    Chiar imi este de mare ajutor! Un timp superb in continuare si la cat mai mlte tutoriale de acest gen!

  2. Peter says:

    Buna, raspunsul este relativ simplu: deoarece functia care deseneaza spectrumul este apelata la EnterFrame poti face un buton normal de play/stop deoarece spectrumul va analiza mereu sunetul din variabila “s” in cazul tutorialului. Poti descarca de aici sursa cu tot cu buton de play/pause

  3. Tabita says:

    Buna, iti multumesc pentru acest spectrum si as vrea sa te intreb cum il atasez la butonul play (de exemplu cand apas pe play sa porneasca iar cand apas pe pauza sau stop sa se opreasca cum ai facut tu in imaginea de mai sus). Sunt incepatoare in as3 si am cautat mult tutoriale despre spectrum deoarece vreu sa fac si eu unul la playerul meu. Un timp superb!

Comentarii

Email-ul tau nu va fi publicat. Numele si email-ul sunt obligatorii.