Mp3 плеер и видео плеер

[mycoding]

Пожскажите, пожалуйста как научится делать на flex 4
mp3 плеер как вконтатке.
И видео плеер как
http://strana.ru/
http://mercator.ru/works/index.php?workID=530

Добавлено через 19 часов 16 минут
Вот что у меня получилось
http://vreshenie.ru/work/flex/learnf...ideoplayer.swf
Вот код

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx" width="631" height="392">
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
 
			protected function button1_clickHandler(event:MouseEvent):void{
				if(myVid.muted==true){					
					myVid.muted=false;
					muted.label="Sound On";
				}else{
					myVid.muted=true;
					muted.label="Sound Off";
				}
			}
			[Bindable]public var video:ArrayCollection = new ArrayCollection(
				[{label:"Погода Москва", url:"http://vreshenie.ru/work/flex/learnflex/3video/mercator.mp4"}, 
					{label:"Orange защищает от DDos аттак", url:"http://mercator.ru/base/video/1146.flv"},
					{label:"Электронное Правительство", url:"http://mercator.ru/base/video/1148.flv"}]);
 
			private function changeHandler(event:Event):void {				
				myVid.source = ComboBox(event.target).selectedItem.url;				 
			}     
		]]>
	</fx:Script>
 
	<fx:Declarations>
		<fx:String id="TitleText"><![CDATA["<b>VideoDisplay Control:</b><br />Use the buttons to control the video."]]></fx:String>
	</fx:Declarations>  
	<s:Panel x="22" y="10" width="250" height="31" title="Меркатор Видео"/>
	<s:Button label="Play" color="0x00000" click="myVid.play();" x="28" y="311"/>
	<s:Button label="Pause" color="0x00000" click="myVid.pause();" x="119" y="311"/>
	<s:Button label="Stop" color="0x00000" click="myVid.stop();" x="197" y="311"/>
 
	<mx:HSlider id="slider"
				minimum="0.0"
				maximum="1.0"
				value="0.1"
				snapInterval="0.01"
				tickInterval="0.1"
				liveDragging="true"  x="291" y="311" borderColor="#22A3D9" themeColor="#0F87C5"/>   
	<s:VideoDisplay id="myVid" height="221" width="296" source="http://vreshenie.ru/work/flex/learnflex/3video/mercator.mp4" autoPlay="false" x="42" y="43"
					volume="{slider.value}"/>  
	<s:HSlider id="timeSider" x="42" y="271" width="296" minimum="0" maximum="{myVid.duration}" value="{myVid.currentTime}" liveDragging="true"
			   />
	<s:Button id="muted" x="28" y="352" label="Sound On" click="button1_clickHandler(event)"/>
	<mx:ComboBox x="358" y="94" width="233"
				 dataProvider="{video}"
				 change="changeHandler(event);" 
				 selectedIndex="0"/>
 
</s:Application>

Подскажите пожалуйста как из этого сделать вот это
http://mercator.ru/works/index.php?workID=532

Добавлено через 20 часов 49 минут
Можете подсказать, как изменить skin у VideoPlayer.
Например изменить картинку кнопки "во весь экран"

[alatar]

Можете подсказать, как изменить skin у VideoPlayer.
Например изменить картинку кнопки "во весь экран"

Например так

[mycoding]

Спасибо, попробую