L'esempio seguente utilizza il metodo
SoundMixer.computeSpectrum()
per mostrare un grafico della forma d'onda audio che si anima in corrispondenza di ogni fotogramma:
import flash.display.Graphics;
import flash.events.Event;
import flash.media.Sound;
import flash.media.SoundChannel;
import flash.media.SoundMixer;
import flash.net.URLRequest;
const PLOT_HEIGHT:int = 200;
const CHANNEL_LENGTH:int = 256;
var snd:Sound = new Sound();
var req:URLRequest = new URLRequest("bigSound.mp3");
snd.load(req);
var channel:SoundChannel;
channel = snd.play();
addEventListener(Event.ENTER_FRAME, onEnterFrame);
snd.addEventListener(Event.SOUND_COMPLETE, onPlaybackComplete);
var bytes:ByteArray = new ByteArray();
function onEnterFrame(event:Event):void
{
SoundMixer.computeSpectrum(bytes, false, 0);
var g:Graphics = this.graphics;
g.clear();
g.lineStyle(0, 0x6600CC);
g.beginFill(0x6600CC);
g.moveTo(0, PLOT_HEIGHT);
var n:Number = 0;
// left channel
for (var i:int = 0; i < CHANNEL_LENGTH; i++)
{
n = (bytes.readFloat() * PLOT_HEIGHT);
g.lineTo(i * 2, PLOT_HEIGHT - n);
}
g.lineTo(CHANNEL_LENGTH * 2, PLOT_HEIGHT);
g.endFill();
// right channel
g.lineStyle(0, 0xCC0066);
g.beginFill(0xCC0066, 0.5);
g.moveTo(CHANNEL_LENGTH * 2, PLOT_HEIGHT);
for (i = CHANNEL_LENGTH; i > 0; i--)
{
n = (bytes.readFloat() * PLOT_HEIGHT);
g.lineTo(i * 2, PLOT_HEIGHT - n);
}
g.lineTo(0, PLOT_HEIGHT);
g.endFill();
}
function onPlaybackComplete(event:Event)
{
removeEventListener(Event.ENTER_FRAME, onEnterFrame);
}
Innanzi tutto, questo esempio carica e riproduce un file audio, quindi intercetta l'evento
Event.ENTER_FRAME
, il quale attiva il metodo
onEnterFrame()
durante la riproduzione dell'audio. Il metodo
onEnterFrame()
comincia chiamando il metodo
SoundMixer.computeSpectrum()
, che memorizza i dati della forma d'onda audio nell'oggetto
bytes
di ByteArray.
L'immagine della forma d'onda viene formata mediante l'API di disegno vettoriale. Un ciclo
for
accede in sequenza ai primi 256 valori di dati, che rappresentano il canale stereo sinistro, e disegna una linea da un punto a quello successivo mediante il metodo
Graphics.lineTo()
. Un secondo ciclo
for
accede in sequenza alla serie di 256 valori successiva, ma formandone l'immagine in ordine inverso, da destra a sinistra. Le immagini delle forme d'onda risultanti possono produrre un effetto speculare molto suggestivo, come mostrato nell'immagine seguente.