Displaying a dynamically loaded MP3 file’s ID3 information in Flex using the SoundEffect class
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.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
-
Add Widgets (Content Sidebar)
This is your Content Sidebar. Edit this content that appears here in the widgets panel by adding or removing widgets in the Content Sidebar area.
0 Responses to Displaying a dynamically loaded MP3 file’s ID3 information in Flex using the SoundEffect class
Leave a Reply Cancel reply
-
Categories
- Accordion
- AccordionHeader
- ActionScript
- AddChild
- AdvancedDataGrid
- Alert
- alpha
- Animate
- AnimateProperties
- Application
- Application (Spark)
- ArrayCollection
- BarChart
- baseColor
- beta
- beta1
- beta2
- Bitmap
- Bitmap/BitmapData
- BitmapData
- BitmapFill
- BitmapFill (Spark)
- BitmapGraphic
- BitmapImage
- BitmapImage (Spark)
- BitmapImageResizeMode
- Border (Spark)
- BorderContainer (Spark)
- Box
- BuildInfo
- Button
- Button (Spark)
- ButtonBar
- ButtonBar (Spark)
- ByteArray
- Camera
- Charting
- CheckBox
- CheckBox (Spark)
- ClassFactory
- CollectionEvent
- Color
- ColorPicker
- ColorUtil
- ComboBox
- ComboBoxArrowSkin
- Compiler
- Component
- Component (Spark)
- Configuration
- Container
- ContextMenu
- ContextMenuEvent
- ContextMenuItem
- CSSCondition
- CSSSelector
- CSSStyleDeclaration
- CurrencyFormatter
- CursorManager
- Data Binding
- DataGrid
- DataGrid (Spark)
- DataGridColumn
- Date
- DateBase
- DateChooser
- DateField
- DateFormatter
- Debugging
- DefaultComplexItemRenderer
- DefaultTileListEffect
- DropDownList
- DropDownList (Spark)
- DropDownListButtonSkin
- DropDownListSkin
- DropShadowFilter
- E4X
- Effects
- Ellipse
- EmailValidator
- Embed
- Event
- Fade
- FileFilter
- FileReference
- fill
- Filters
- Flash
- Flash Integration
- FlashVars
- Flex 3 SDK
- Flex Builder
- Flex Builder 3
- Flex SDK
- Flex4
- FLVPlayback
- FocusManager
- FontLookup
- Fonts
- Form
- Form (Spark)
- FormHeading (Spark)
- FormItem
- FormItem (Spark)
- Forms
- FTETextField (Spark)
- FullScreen
- FullScreenEvent
- FxAnimateColor
- FxButtonBar
- FxCheckBox
- FXG
- FxHScrollBar
- FxHSlider
- FxList
- FxNumericStepper
- FxRadioButton
- FxRotate3D
- FxScroller
- FxTextArea
- FxTextInput
- FxToggleButton
- FxVScrollBar
- FxVSlider
- getStyleDeclaration()
- GradientEntry
- Graphic (Spark)
- HBox
- HDividedBox
- HGroup (Spark)
- HorizontalLayout
- HorizontalList
- HSBColor (Spark)
- HScrollBar (Spark)
- HSlider
- HSlider (Spark)
- HTML template
- ID3Info
- Image
- Image (Spark)
- ImageSnapshot
- itemRenderer
- JointStyle
- Label
- Label (Spark)
- Legend
- LegendItem
- LigatureLevel
- Line
- LinearGradientStroke
- LineScaleMode
- LinkBar
- LinkButton
- List
- List (Spark)
- Menu
- MenuBar
- Metadata
- MetadataEvent
- Model
- Mouse
- MouseCursor
- MouseEvent
- Move
- Namespace
- NavigatorContent (Spark)
- needsSWF
- NetConnection
- NetStream
- Nightly Builds
- NumberBaseRoundType
- NumberFormatter
- NumberValidator
- NumericCompare
- NumericStepper
- NumericStepper (Spark)
- ObjectProxy
- ObjectUtil
- paddingLeft
- paddingRight
- Panel
- Panel (Spark)
- Parallel
- Path
- PieChart
- PieSeries
- PieSeriesItem
- PopUpAnchor (Spark)
- PopUpButton
- PopUpManager
- ProgrammaticSkin
- ProgressBar
- PropertyChangeEvent
- QName
- RadialGradient
- RadioButton
- RadioButton (Spark)
- RadioButtonGroup
- RadioButtonGroup (Spark)
- Rect
- RegExp
- Regular Expressions
- Repeater
- RichEditableText
- RichText
- RichText (Spark)
- RichTextEditor
- Rotate
- Rotate3D (Spark)
- Scroller (Spark)
- Sequence
- setStyle()
- SimpleText
- SimpleText (Spark)
- skinClass
- Slider
- SliderEvent
- SolidColor
- SolidColorStroke
- Sort
- SortField
- Sound
- SoundEffect
- Spinner (Spark)
- SpriteVisualElement (Spark)
- StageDisplayState
- States
- StringUtil
- StringValidator
- StyleManager
- Styles
- SWFLoader
- SWFObject
- System
- SystemManager
- TabBar
- TabBar (Spark)
- TabNavigator
- TabStopFormat
- Text
- Text Layout Framework (TLF)
- TextArea
- TextArea (Spark)
- TextBox
- TextConverter
- TextEvent
- TextFlow
- TextFlowUtil
- TextFormat
- TextGraphic
- TextInput
- TextInput (Spark)
- TextLayoutFormat
- TextView
- Themes
- TileLayout
- TileList
- TileOrientation
- Timer
- TitleWindow
- TitleWindow (Spark)
- TLF
- ToggleButton (Spark)
- ToggleButtonBar
- ToolTip
- Transition
- Tree
- TruncationOptions
- UIComponent
- UIFTETextField
- Updater
- URLLoader
- URLRequest
- URLUtil
- URLVariables
- ValidationResultEvent
- Validator
- Validators
- VBox
- VDividedBox
- Vector
- VerticalLayout
- VerticalLayout (Spark)
- VGroup (Spark)
- Video
- VideoDisplay
- VideoElement
- VideoElement (Spark)
- VideoEvent
- VideoPlayer (Spark)
- VideoPlayerScrubBar
- ViewStack
- VScrollBar (Spark)
- VSlider
- VSlider (Spark)
- XML
- XMLList
- XMLListCollection
- ZipCodeValidator
- ZipCodeValidatorDomainType
- Zoom
-
Articles
- December 2010
- November 2010
- October 2010
- September 2010
- August 2010
- July 2010
- June 2010
- May 2010
- April 2010
- March 2010
- February 2010
- January 2010
- December 2009
- November 2009
- October 2009
- September 2009
- August 2009
- July 2009
- June 2009
- May 2009
- April 2009
- March 2009
- February 2009
- January 2009
- December 2008
- November 2008
- October 2008
- September 2008
- August 2008
- July 2008
- June 2008
- May 2008
- April 2008
- March 2008
- February 2008
- January 2008
- December 2007
- November 2007
- October 2007
- September 2007
- August 2007
- July 2007
-
Meta


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); }