This example shows that it is possible to modify the playlist to create a highly-customized and fully-functional player with minimal space and bandwidth usage (57 kb SWF). This example utilizes a MP3 player component (250x24 pixels) with play, pause, next, previous, volume, progress controls, and playlist component (text only example); as well as play position, title, volume, and duration text (chocolate-brown mint-green theme). FlashVars in the embed scripts are used to specify the path to the XML file that is loaded upon pageload.
- Using your Flash 8/CS3/CS4 authoring software, open an existing FLA that includes the MP3 component, or install the MXP and open a new document and add the MP3 and Playlist components to the stage. Make sure to give the MP3 component the instance name "myMP3".
- Select the Playlist component on the stage and open the Component Inspector to view a list of configurable parameters, which you can use to disable features and alter the colors of the list items and scroll system (note: text colors colors are modified using the textstyles.css file). You should add the instance name "myMP3" to the "MP3 Instance" parameter field.
- Select the MP3 component on the stage and open the Component Inspector to view a list of configurable parameters, which you can use to disable features, change playback settings, and alter the colors of the button symbols and slider tracks (note: text colors colors are modified using the textstyles.css file).
- You can adjust the size and location of the components using the Properties Inspector.
- You can delete or modify any existing graphics on the stage (e.g. border), and you can use the various tools within Flash to create custom graphical skinning elements (e.g. custom background and logo).
- You should change the color of the background and resize it to fit all of the objects on the stage (note: the background color of the SWF can also be set using "bgcolor" parameters in the embed scripts).
- Once you are finished modifying the FLA you should save your project, publish or export a network ready SWF, and embed it in your webpge.