Как мне создать музыкальный проигрыватель во Flash, который создает волновую форму аудиофайла? - PullRequest
0 голосов
/ 16 января 2010

У меня есть три скриншота ниже аудиоплееров на основе Flash на различных веб-сайтах, которые рисуют форму волны клипа, который он собирается воспроизвести, и перемещаются во время его воспроизведения, а также позволяют пользователю нажимать на точку на аудио файл, и он переходит к этой точке.

DJ Скачать музыкальный проигрыватель с http://www.djdownload.com

DJ Скачать музыкальный плеер http://img13.imageshack.us/img13/6739/djdownloadmusicplayer.png

Музыкальный проигрыватель SoundCloud от http://www.soundcloud.com

Музыкальный проигрыватель SoundCloud http://img5.imageshack.us/img5/6336/soundcloudmusicplayer.png

TrackItDown музыкальный проигрыватель с http://www.trackitdown.net

Музыкальный проигрыватель TrackItDown http://img697.imageshack.us/img697/7392/trackitdownmusicplayer.png

У меня очень мало знаний о Flash, но это легко сделать? Я хотел бы просто показать файл Flash mp3, и он рисует форму волны. Я понимаю, что это может быть довольно интенсивно на процессоре, поэтому будет ли способ кэширования данных формы сигнала, чтобы он не перерисовывался при каждой загрузке файла?

Ответы [ 5 ]

3 голосов
/ 16 января 2010

Я никогда раньше этим не занимался, но, насколько я знаю, ситуация такова.

Если вы работаете с Flash Player 10, вам повезло, иначе может показаться, что вам придется вычислять спектр во время воспроизведения звука. Как и в ссылке Криса, вы можете получить звуковые данные из звукового объекта в ByteArray с Sound.extract() (только FP10). Затем вы читаете ByteArray, читаете значения и рисуете что-то на экране в соответствии со значениями.

На FP9 вам придется воспроизводить звук на SoundChannel и читать левый и правый пики канала во время его воспроизведения. Я нашел этот пример кода для этой ( ссылка )

var snd:Sound = new Sound();
var req:URLRequest = new URLRequest("your track url");
var channel:SoundChannel;
var bytes:ByteArray = new ByteArray();

snd.load(req);
this.addEventListener(Event.ENTER_FRAME, enterFrameEvent);
channel = snd.play(0,3);    

function enterFrameEvent(event:Event):void  {
    SoundMixer.computeSpectrum(bytes, true,0);
    // bytes has 512 values 0-255 leftchannel 256-512 right channel
    for (var i:Number = 0; i < 256; i++) {
        val = bytes.readFloat();
    }
}

Короче, попробуйте придерживаться FP10, и если вы сможете это сделать (без ограничений клиента), вы сможете извлечь класс Waveform прямо из ссылки Криса и использовать его. Похоже, что класс также рисует фактическую форму волны (поверх извлечения аудиоданных), но вы можете либо переместить чертеж в его собственный класс, либо изменить код, чтобы получить собственный вид формы волны.

0 голосов
/ 23 июля 2010

Крис - спасибо за ссылку на мой блог, и вот источник для этого класса (просто, чтобы было легче). Я не совсем уверен, в каком состоянии находится код, так как я написал его 2 года назад во время написания этой статьи, но он должен выполнить работу для всех, кому это нужно. http://efnx.com/lab/WavePlotter/src/WavePlotter_Main_081024.src.tar.gz

0 голосов
/ 18 января 2010

То, как генерируются иллюстрации в ваших примерах, более или менее выглядит следующим образом:

Определите, сколько секунд звука на пиксель дисплея ширины.

Для каждого пикселя, идущего слева направо, рассчитайте среднюю среднеквадратичную амплитуду соответствующего сегмента файла.

Это дает вам высоту пика для этого пикселя. На некоторых дисплеях он отображается симметрично (т. Е. Отражается сверху вниз), а на других представлен стиль гистограммы.

(кстати, по амплитудным дисплеям легко увидеть, что это цифровая музыка, скорее всего, техно)

0 голосов
/ 16 января 2010

Эта запись на доске Flashkit также содержит ряд очень интересных ресурсов:

0 голосов
/ 16 января 2010

Не пробовал, но поиск в Google по запросу "as3 waveform" обнаружил этот пост в блоге (содержит ссылку на некоторый исходный код)

http://blog.efnx.com/flash-actionscript-3-waveform-generation-class/

...