Everyday3d
Posted on 2008-03-26

Classic ‘Sound Equalizer’ in Flash/AS3

Got a background music on your Flash website? It would be nice to add a tiny equalizer in the footer. Or maybe you're developing an AS3 application that features MP3 playback? An equalizer will surely be useful in there too...

During the long years I spent on creating campaign sites in Flash, the need for an equalizer kept coming back. However, with a tight deadline (all dealines are tight, aren't they?) there isn't always enough time to develop such 'sweet candy' elements. If you've ever been there, search no more and check this out:

I developed this classic sound equalizer, while I was playing with the BitmapData object in AS3. Now, it surely ain't a breakthrough or a milestone in actionscript development, and lots of really cool sound visualizations are already out there [1] [2]. The way I see it, this classic equalizer is a ready-to-use, easy-to-use (even for the non-gurus) and highly customizable component. Thanks to the usage of BitmapData rather then vector graphics it is also pretty fast.

Feel free to play around with the demo above, and if you like it, you can get all the SOURCE HERE. I publish it under the MIT license which means that you are free to use it for anything you want.

Inside the source ZIP you will find a few AS3 classes, a FLA cointaining an example and a READ_FIRST text file, which you should… well, read first. The equalizer is pure code, so there are no assets. Just add the packages to your classpath and you are ready to go. The basic class that is responsible for drawing the equalizer is the com.everydayflash.equalizer.Equalizer. Since it extends the Sprite class, just create an instance of it and add it to your DisplayObject like this:

import com.everydayflash.equalizer.Equalizer; var eq:Equalizer = new Equalizer(); addChild(eq);

...and that's all folks, you should see an equalizer by now. Of course for the equalizer to work there must be SOME sound playing in your Flash application… I leave this to you, but in case you do not know how to play a sound in Flash, here's a simple tutorial I googled for you.

In order to customize the way it looks, the Equalizer class constructor takes an optional argument, which is an instance of com.everydayflash.equalizer.EqualizerSettings class. Check the source of this class to see all the options that can be set in there (more or less everything that is available in the demo above). Also check the example Main.as class to see how to use it – it is merely a few extra lines of code.

Have fun and email me if you have any questions!

Back
More posts

Everyday3D is a blog by Bartek Drozdz

I started Everyday3d in 2007 with a focus web development. Over the years, I wrote about technology, graphics programming, Virtual Reality and 360 photography. In 2016, I co-founded Kuula - a virtual tour software and I work on it ever since.

Recently, I post about my travels and other topics that I am curious about. If you want to be notified about future posts, subscribe via Substack below.