In a previous example, “Displaying a dynamically loaded MP3 file’s ID3 information in Flex”, we saw how to load an MP3 into Flex using the Sound class.
The following example shows you how you can dynamically load and play an MP3 in Flex using the SoundEffect class, and access the Sound object and it’s ID3 information.
Full code after the jump.
I didn’t include all the MP3 files in the source code ZIP. You can download the MP3s from http://ghosts.nin.com/main/order_options. Hooray for free Nine Inch Nails songs and Creative Commons licensing!
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/03/05/displaying-a-dynamically-loaded-mp3-files-id3-information-in-flex-using-the-soundeffect-class/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.utils.ObjectUtil;
private const NIN_URL:String = "http://ghosts.nin.com/";
private function playSoundEffect(src:String):void {
textArea.text = "";
if (soundEffect.isPlaying) {
soundEffect.stop();
}
soundEffect.source = src;
soundEffect.play([soundEffect]);
}
private function soundEffect_id3(evt:Event):void {
var id3Info:ID3Info = Sound(soundEffect.sound).id3;
textArea.text += ObjectUtil.toString(id3Info);
textArea.text += "\\n\\n-------------------\\n\\n";
}
private function comboBox_change(evt:Event):void {
var cb:ComboBox = evt.currentTarget as ComboBox;
playSoundEffect(cb.selectedItem.@source);
}
]]>
</mx:Script>
<mx:XML id="playlist" source="data/playlist.xml" />
<mx:SoundEffect id="soundEffect"
duration="10000"
useDuration="true"
id3="soundEffect_id3(event);" />
<mx:ApplicationControlBar dock="true">
<mx:ComboBox id="comboBox"
prompt="Please select a song..."
dataProvider="{playlist.song}"
labelField="@title"
change="comboBox_change(event);" />
</mx:ApplicationControlBar>
<mx:TextArea id="textArea"
editable="false"
width="100%"
height="100%" />
<mx:LinkButton id="linkButton"
label="All songs copyright Nine Inch Nails (2008)"
click="navigateToURL(new URLRequest(NIN_URL), '_blank');" />
</mx:Application>
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/03/05/displaying-a-dynamically-loaded-mp3-files-id3-information-in-flex-using-the-soundeffect-class/ -->
<playlist>
<song title="Track 1" source="assets/01 Ghosts I.mp3" />
<song title="Track 2" source="assets/02 Ghosts I.mp3" />
<song title="Track 3" source="assets/03 Ghosts I.mp3" />
<song title="Track 4" source="assets/04 Ghosts I.mp3" />
<song title="Track 5" source="assets/05 Ghosts I.mp3" />
<song title="Track 6" source="assets/06 Ghosts I.mp3" />
<song title="Track 7" source="assets/07 Ghosts I.mp3" />
<song title="Track 8" source="assets/08 Ghosts I.mp3" />
<song title="Track 9" source="assets/09 Ghosts I.mp3" />
</playlist>
View source is enabled in the following example.
Note that the SoundEffect only plays the first 10 seconds of each song. If you wanted to play the full song, simply omit the duration property in the <mx:SoundEffect /> tag, and set the useDuration property to false.
{ 6 comments… read them below or add one }
its give an error , soundEffect.stop(); is not property(stop) of soundEffect
abhishek,
Are you using Flex 2 or Flex 3? I probably only tested Flex 3.
Peter
its give an error , soundEffect.stop(); is not property(stop) of soundEffect me as well
Hi Peter,
your blog is really one of the best on the web and I have been able to find the examples I need so far. But not this time.
I have mp3 urls in XML and I am using this XML as dataProvider of a DataGrid.
My problem is getting the labelFunction to display id3.songName instead of the url or filename.
Any ideas?
Best,
Linko
Linko,
I believe the problem would be that (as far as I know) you need to _load_ the MP3 in order to access their ID3 metadata. So for your code to work you would need to have the label function try to load the MP3 and get the ID3 information. Or perhaps you could use a custom item renderer to do the same thing, but still, I don’t know that I’d try loading X number of MP3s simultaneously to get their ID3 information.
Peter
I used your code above, and when I trace the songName in
soundEffect_id3()it shows names of all mp3s.However, since this is not my labelFunction I cannot return the name.
private function trackLabel(item:Object, column:DataGridColumn):String { var url:String = pathString + item.@name; var sound:Sound; var soundLoaderContext:SoundLoaderContext; var urlRequest:URLRequest = new URLRequest(url); // Check policy file soundLoaderContext = new SoundLoaderContext(1000, true); sound = new Sound(); sound.addEventListener(Event.ID3, sound_id3); sound.load(urlRequest, soundLoaderContext); return sLabel; } private function sound_id3(evt:Event):void { sLabel = Sound(evt.currentTarget).id3.songName; trace(sLabel); }