<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Kudos Ltda. - Blog &#187; Tutorial</title>
	<atom:link href="http://blog.gkudos.com/tag/tutorial/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.gkudos.com</link>
	<description>.: Open Systems, Open Ideas :.</description>
	<lastBuildDate>Thu, 29 Apr 2010 23:25:26 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Creando un lector de GeoRSS con Adobe Flex 3</title>
		<link>http://blog.gkudos.com/2009/09/06/creando-un-lector-de-georss-con-adobe-flex-3/</link>
		<comments>http://blog.gkudos.com/2009/09/06/creando-un-lector-de-georss-con-adobe-flex-3/#comments</comments>
		<pubDate>Sun, 06 Sep 2009 18:21:57 +0000</pubDate>
		<dc:creator>juanmendez</dc:creator>
				<category><![CDATA[Adobe Flex]]></category>
		<category><![CDATA[Datos Geográficos]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[adobe flex 3]]></category>
		<category><![CDATA[mashup]]></category>
		<category><![CDATA[Rich Internet Applications]]></category>

		<guid isPermaLink="false">http://blog.gkudos.com/?p=188</guid>
		<description><![CDATA[Uno de los ejemplos tradicionales que se desarrollan durante el aprendizaje de Flex 3 y Actionscript 3 es el de la creación de un lector de RSS. En el presente artículo se presenta una extensión de dicho ejemplo adicionando la capacidad de interpretar infomación publicada en el formato GeoRSS.


Qué es un RSS?

RSS es una familia [...]]]></description>
			<content:encoded><![CDATA[<p>Uno de los ejemplos tradicionales que se desarrollan durante el aprendizaje de Flex 3 y Actionscript 3 es el de la creación de un lector de RSS. En el presente artículo se presenta una extensión de dicho ejemplo adicionando la capacidad de interpretar infomación publicada en el formato GeoRSS.<br />
<a href="http://blog.gkudos.com/wp-content/uploads/georss.jpg"><img src="http://blog.gkudos.com/wp-content/uploads/georss.jpg" alt="" width="80%" heigth="80%" title="georss"  class="aligncenter size-medium wp-image-189" /></a></p>
<ul>
<li><strong>Qué es un RSS?</strong></li>
</ul>
<p><strong>RSS</strong> es una familia de formatos de <a title="Fuente web" href="http://es.wikipedia.org/wiki/Fuente_web">fuentes web</a> codificados en <a class="mw-redirect" title="XML" href="http://es.wikipedia.org/wiki/XML">XML</a>. Se utiliza para suministrar a suscriptores de <a title="Información" href="http://es.wikipedia.org/wiki/Informaci%C3%B3n">información</a> <a class="mw-redirect" title="Actualidad" href="http://es.wikipedia.org/wiki/Actualidad">actualizada</a> frecuentemente. El formato permite distribuir contenido sin necesidad de un navegador, utilizando un software diseñado para leer estos contenidos RSS (<a title="Agregador" href="http://es.wikipedia.org/wiki/Agregador">agregador</a>).</p>
<ul>
<li><strong>Qué es un GeoRSS?</strong></li>
</ul>
<p><strong>GeoRSS</strong> es un conjunto de estándares para representar información geográfica mediante el uso de capas y está construido dentro de la familia de estándares <a title="RSS" href="http://es.wikipedia.org/wiki/RSS">RSS</a>.</p>
<ul>
<li><strong>Cómo convertir un RSS en GeoRSS?</strong></li>
</ul>
<p>Si usted no dispone de una aplicación para convertir sus RSS en GeoRSS puede utilizar Geonames para realizar dicha traducción de formato.<br />
El &#8220;<a href="http://www.geonames.org/rss-to-georss-converter.html">RSS to GeoRSS Converter</a>&#8221; de Geonames busca posibles ubicaciones (sitios geogràficos) en el texto del  rss.  Si alguna ubicación geográfica relevante es encontrada, adiciona la latitud y longitud al RSS durante la codificación a GeoRSS.</p>
<ul>
<li><strong>Que requiero para implementar el lector de GeoRSS utilizando Adobe Flex 3?</strong></li>
</ul>
<p>- <a href="http://opensource.adobe.com/wiki/display/flexsdk/Flex+SDK">Flex SDK</a></p>
<p>- <a href="http://code.google.com/intl/es-ES/apis/maps/documentation/flash/">Google Maps Flash API</a></p>
<ul>
<li><strong>Donde puedo descargar el código fuente del ejemplo?</strong></li>
</ul>
<p>Puede descargar el código fuente desde <a href="http://pwp.007mundo.com/jcmendez/kudos/georss/src.zip">esta ubicación.</a></p>
<ul>
<li><strong>Que ejemplos de programación flex / actionscript  puedo encontrar en el código? </strong></li>
</ul>
<p>- Carga de datos en XML utilizando el objeto HTTPService</p>
<p>- Despliegue de datos utilizando componentes ComboBox, Datagrid e Image</p>
<p>- Formatear etiquetas de un ComboBox utilizando labelFunction.</p>
<p>- Despliegue de información HTML en el tooltip de la aplicación.</p>
<p>- Ejemplo básico de carga de Markers en Google Maps para Adobe Flex.</p>
<p>- Procesamiento de datos publicados en formatos XML, RSS y GeoRSS.</p>
<p>- Utilizar el servicio &#8220;Rss to GeoRSS&#8221; de Geonames con Flex y Actionscript.</p>
<ul>
<li><strong>Puedo ver en línea el código fuente del ejemplo y la aplicación resultante?</strong></li>
</ul>
<p>A continuación puede ver tanto la aplicación como el código fuente relacionado.<br/><br/><br />
<iframe src ="http://pwp.007mundo.com/jcmendez/kudos/georss/index.html" width="100%" height="400" frameborder="0"><br />
</iframe><br />
<br/><br/><br />
<strong>Código fuente del archivo Rss.mxml:</strong></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
</pre></td><td class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span> </span>
<span style="color: #000000;">	layout=<span style="color: #ff0000;">&quot;vertical&quot;</span></span>
<span style="color: #000000;">	applicationComplete=<span style="color: #ff0000;">&quot;onComplete();&quot;</span> </span>
<span style="color: #000000;">	creationComplete=<span style="color: #ff0000;">&quot;loadSourcesService.send();&quot;</span><span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Style</span><span style="color: #7400FF;">&gt;</span></span>
	Application{
		background-color:#ffffff;
		paddingBottom:5; 
		paddingLeft:5;
		paddingRight:5; 
		paddingTop:5;
	}
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Style</span><span style="color: #7400FF;">&gt;</span></span>	
<span style="color: #339933;">&lt;mx:Script&gt;</span>
<span style="color: #339933;">	&lt;![CDATA[</span>
<span style="color: #339933;">		import com.google.maps.controls.ZoomControlOptions;</span>
<span style="color: #339933;">		import mx.collections.ArrayCollection;</span>
<span style="color: #339933;">		import com.google.maps.overlays.MarkerOptions;</span>
<span style="color: #339933;">		import com.google.maps.overlays.Marker;</span>
<span style="color: #339933;">		import ejemplo.HTMLToolTip;</span>
<span style="color: #339933;">		import mx.managers.ToolTipManager;</span>
<span style="color: #339933;">		import flash.net.navigateToURL;</span>
<span style="color: #339933;">		import mx.controls.List;</span>
<span style="color: #339933;">		import mx.controls.Alert;</span>
<span style="color: #339933;">		import mx.events.ListEvent;</span>
<span style="color: #339933;">		import mx.rpc.events.FaultEvent;</span>
<span style="color: #339933;">		import mx.rpc.events.ResultEvent;</span>
<span style="color: #339933;">		import com.google.maps.MapType;</span>
<span style="color: #339933;">		import com.google.maps.LatLng;</span>
<span style="color: #339933;">		import com.google.maps.controls.PositionControl;</span>
<span style="color: #339933;">		import com.google.maps.controls.MapTypeControl;</span>
<span style="color: #339933;">		import com.google.maps.controls.ZoomControl;</span>
<span style="color: #339933;">		import com.google.maps.Map;</span>
<span style="color: #339933;">		import com.google.maps.MapEvent;</span>
&nbsp;
<span style="color: #339933;">		public var map:Map;</span>
&nbsp;
<span style="color: #339933;">	    //se invoca en el evento 'creationComplete' </span>
<span style="color: #339933;">		private function onComplete() :void{</span>
<span style="color: #339933;">			//configuración del tooltip para despliegue de HTML</span>
<span style="color: #339933;">			ToolTipManager.toolTipClass = HTMLToolTip; </span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		//Manejo de la respuesta del HTTPService loadSourcesService</span>
<span style="color: #339933;">		private function loadSourcesService_result(evt:ResultEvent):void {</span>
<span style="color: #339933;">		    var resultObj:Object = evt.result;</span>
<span style="color: #339933;">		    sourcesCb.dataProvider = resultObj.xml.lista.item;</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		//Iniciar el Mapa</span>
<span style="color: #339933;">		private function startMap(event:Event):void {</span>
<span style="color: #339933;">			map = new Map();</span>
<span style="color: #339933;">			//Key de google Maps: http://code.google.com/intl/es-ES/apis/maps/documentation/flash/</span>
<span style="color: #339933;">			map.key = map.key = &quot;ABQIAAAAzP_X84EVzii7yEPHkonPNRRMdub8RYo7ePgaMtJOPXtU0LG1eBQz8J6xJi_XxLQ80ti-WlGkph7kVw&quot;;</span>
<span style="color: #339933;">			map.addEventListener(MapEvent.MAP_READY, onMapReady);</span>
&nbsp;
<span style="color: #339933;">			var zoomopts:ZoomControlOptions = new ZoomControlOptions();</span>
<span style="color: #339933;">			zoomopts.hasScrollTrack = false;</span>
<span style="color: #339933;">			var zoomCtrl:ZoomControl = new ZoomControl(zoomopts);</span>
<span style="color: #339933;">			map.addControl(zoomCtrl);</span>
&nbsp;
<span style="color: #339933;">			// add MapType Controller</span>
<span style="color: #339933;">			var mapTypeCtrl:MapTypeControl = new MapTypeControl();</span>
<span style="color: #339933;">			map.addControl(mapTypeCtrl);</span>
&nbsp;
<span style="color: #339933;">			// add Position Controller</span>
<span style="color: #339933;">			var posCtrl:PositionControl = new PositionControl();</span>
<span style="color: #339933;">			map.addControl(posCtrl);</span>
<span style="color: #339933;">			mapContainer.addChild(map);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function resizeMap(event:Event):void {</span>
<span style="color: #339933;">			map.setSize(new Point(mapContainer.width, mapContainer.height));</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function onMapReady(event:MapEvent):void {</span>
<span style="color: #339933;">			//setCenter:  Parámetros: Coordenada Punto Central, Nivel de Zoom, Tipo de Mapa</span>
<span style="color: #339933;">			map.setCenter(new LatLng(4,-73),3, MapType.NORMAL_MAP_TYPE);</span>
<span style="color: #339933;">			//Habilita el Zoom Continuo</span>
<span style="color: #339933;">			map.enableContinuousZoom();</span>
<span style="color: #339933;">			//Habilita el Scroll del mapa utilizando el Mouse </span>
<span style="color: #339933;">			map.enableScrollWheelZoom();</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		// Se invoca cuando el usuario cambia de opcion en el combo box</span>
<span style="color: #339933;">		// se obtiene el rss y se pasa al HTTPService 'loadRssService'</span>
<span style="color: #339933;">		private function getFuenteNombre ( event: ListEvent) : void{					</span>
<span style="color: #339933;">			if(sourcesCb.selectedItem){</span>
<span style="color: #339933;">				//configura la llamada al servicio geonames que recibe como parámetro</span>
<span style="color: #339933;">				//la url del rss que se va a georreferenciar</span>
<span style="color: #339933;">				//http://www.geonames.org/rss-to-georss-converter.html</span>
<span style="color: #339933;">				loadRssService.url= &quot;http://ws.geonames.org/rssToGeoRSS?feedUrl=&quot;+sourcesCb.selectedItem.url;</span>
<span style="color: #339933;">				loadRssService.send();</span>
<span style="color: #339933;">				//elimina todos los markers del mapa</span>
<span style="color: #339933;">				map.clearOverlays();</span>
<span style="color: #339933;">				rssList.dataProvider = new ArrayCollection();</span>
<span style="color: #339933;">			}</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		//Esta funcion se llama cuando cambia el DataGrid, tiene como objetivo</span>
<span style="color: #339933;">		//establecer el contenido a desplegar en la descripcion, tomandolo del xml.</span>
<span style="color: #339933;">		private function getPage(event: ListEvent) : void{</span>
<span style="color: #339933;">			var selectedEq:Object = rssList.selectedItem;</span>
<span style="color: #339933;">			titulo.text = rssList.selectedItem.title;</span>
<span style="color: #339933;">			contenido.htmlText=rssList.selectedItem.description;</span>
<span style="color: #339933;">			//Alert.show(rssList.selectedItem[&quot;encoded&quot;])</span>
<span style="color: #339933;">			mas.visible=true;</span>
<span style="color: #339933;">			var latlng:LatLng = new LatLng(Number(rssList.selectedItem.lat),Number(rssList.selectedItem.long));</span>
<span style="color: #339933;">			//lo hace solo cuando geonames devuelva la latitud y la longitud</span>
<span style="color: #339933;">			if(rssList.selectedItem.lat!=undefined||rssList.selectedItem.long!=undefined){</span>
<span style="color: #339933;">				var marker:Marker = generateMarker(selectedEq); </span>
<span style="color: #339933;">				map.setCenter(latlng , 3);	</span>
<span style="color: #339933;">				map.addOverlay(marker);</span>
<span style="color: #339933;">			}</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function generateMarker(item:Object ):Marker{</span>
<span style="color: #339933;">			//crea un objeto de tipo LatLng</span>
<span style="color: #339933;">				var latlng:LatLng = new LatLng(Number(item.lat),Number(item.long));				</span>
<span style="color: #339933;">				//tooltip del Marker  </span>
<span style="color: #339933;">				var markerOptions : MarkerOptions= new MarkerOptions();</span>
<span style="color: #339933;">			    markerOptions.tooltip = item.title;</span>
<span style="color: #339933;">			    var marker : Marker = new Marker( latlng, markerOptions );</span>
<span style="color: #339933;">				return marker;</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		//Esta funcion se llama cuando se hace click en el enlace </span>
<span style="color: #339933;">		//que me envia a la pagina de la fuente, coge el campo link del xml.</span>
<span style="color: #339933;">		private function getUrl() : void{</span>
<span style="color: #339933;">			//configura el request del LinkButton con el objeto link del xml </span>
<span style="color: #339933;">			var u:URLRequest = new URLRequest(rssList.selectedItem.link);</span>
<span style="color: #339933;">        	navigateToURL(u,&quot;_blank&quot;);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		//Se llama cuando hay un resultado en HTTPService loadRssService</span>
<span style="color: #339933;">		protected function onServiceResult(event:ResultEvent):void {</span>
<span style="color: #339933;">			rssList.dataProvider = event.result.rss.channel.item;</span>
<span style="color: #339933;">			//configura la ubicacion de la imagen con el campo image.url</span>
<span style="color: #339933;">			imagen.source=event.result.rss.channel.image.url;</span>
<span style="color: #339933;">			titulo.text = &quot;&quot;;</span>
<span style="color: #339933;">			contenido.htmlText='Seleccione una Noticia';</span>
<span style="color: #339933;">			mas.visible=false;</span>
<span style="color: #339933;">		}</span>
&nbsp;
&nbsp;
&nbsp;
<span style="color: #339933;">		//Se llama cuando hay un fault HTTPService loadEQService y en HTTPService loadRssService</span>
<span style="color: #339933;">		private function load_fault(evt:FaultEvent):void {</span>
<span style="color: #339933;">			Alert.show('Ocurrió un Error en el Servidor', evt.fault.faultString);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function  sourcesCbLabelFunction(item:Object):String{</span>
<span style="color: #339933;">			return item.nombre + &quot; (&quot;+item.pais+&quot;)&quot;;</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">	]]&gt;</span>
<span style="color: #339933;">&lt;/mx:Script&gt;</span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HTTPService</span> id=<span style="color: #ff0000;">&quot;loadSourcesService&quot;</span></span>
<span style="color: #000000;">	            url=<span style="color: #ff0000;">&quot;sources.xml&quot;</span></span>
<span style="color: #000000;">	            resultFormat=<span style="color: #ff0000;">&quot;object&quot;</span></span>
<span style="color: #000000;">	            result=<span style="color: #ff0000;">&quot;{loadSourcesService_result(event);}&quot;</span></span>
<span style="color: #000000;">	            fault=<span style="color: #ff0000;">&quot;load_fault(event);&quot;</span></span>
<span style="color: #000000;">	            showBusyCursor=<span style="color: #ff0000;">&quot;true&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HTTPService</span> id=<span style="color: #ff0000;">&quot;loadRssService&quot;</span></span>
<span style="color: #000000;">	            resultFormat=<span style="color: #ff0000;">&quot;object&quot;</span></span>
<span style="color: #000000;">	            result=<span style="color: #ff0000;">&quot;onServiceResult(event);&quot;</span></span>
<span style="color: #000000;">	            fault=<span style="color: #ff0000;">&quot;load_fault(event);&quot;</span></span>
<span style="color: #000000;">	            showBusyCursor=<span style="color: #ff0000;">&quot;true&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HDividedBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Panel</span> id=<span style="color: #ff0000;">&quot;panel1&quot;</span> width=<span style="color: #ff0000;">&quot;50%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span> title=<span style="color: #ff0000;">&quot;Lector de GeoRSS&quot;</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span> id=<span style="color: #ff0000;">&quot;box&quot;</span>  height=<span style="color: #ff0000;">&quot;100%&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>			
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:ComboBox</span> id=<span style="color: #ff0000;">&quot;sourcesCb&quot;</span>  textAlign=<span style="color: #ff0000;">&quot;left&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span>  </span>
<span style="color: #000000;">						labelFunction=<span style="color: #ff0000;">&quot;sourcesCbLabelFunction&quot;</span></span>
<span style="color: #000000;">						change=<span style="color: #ff0000;">&quot;getFuenteNombre(event)&quot;</span> rowCount=<span style="color: #ff0000;">&quot;10&quot;</span></span>
<span style="color: #000000;">						prompt=<span style="color: #ff0000;">&quot;Seleccione una opción...&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HBox</span><span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:DataGrid</span> id=<span style="color: #ff0000;">&quot;rssList&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span>  change=<span style="color: #ff0000;">&quot;getPage(event)&quot;</span><span style="color: #7400FF;">&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:columns</span><span style="color: #7400FF;">&gt;</span></span>
						<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:DataGridColumn</span> dataField=<span style="color: #ff0000;">&quot;title&quot;</span> headerText=<span style="color: #ff0000;">&quot;Titular&quot;</span> </span>
<span style="color: #000000;">							dataTipField=<span style="color: #ff0000;">&quot;description&quot;</span> showDataTips=<span style="color: #ff0000;">&quot;true&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:columns</span><span style="color: #7400FF;">&gt;</span></span>		
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:DataGrid</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Panel</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Panel</span>  width=<span style="color: #ff0000;">&quot;50%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span> title=<span style="color: #ff0000;">&quot;Detalle de la Noticia&quot;</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VDividedBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;30%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> <span style="color: #7400FF;">&gt;</span></span>
						<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Image</span> id=<span style="color: #ff0000;">&quot;imagen&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
						<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:LinkButton</span> id=<span style="color: #ff0000;">&quot;mas&quot;</span> visible=<span style="color: #ff0000;">&quot;false&quot;</span> label=<span style="color: #ff0000;">&quot;Ver mas...&quot;</span> click=<span style="color: #ff0000;">&quot;{getUrl()}&quot;</span><span style="color: #7400FF;">/&gt;</span></span>	
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HBox</span><span style="color: #7400FF;">&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Text</span> id=<span style="color: #ff0000;">&quot;titulo&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> fontWeight=<span style="color: #ff0000;">&quot;bold&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Text</span> id=<span style="color: #ff0000;">&quot;contenido&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;70%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
					<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:UIComponent</span> id=<span style="color: #ff0000;">&quot;mapContainer&quot;</span> </span>
<span style="color: #000000;">			        initialize=<span style="color: #ff0000;">&quot;startMap(event);&quot;</span> </span>
<span style="color: #000000;">			        resize=<span style="color: #ff0000;">&quot;resizeMap(event)&quot;</span> </span>
<span style="color: #000000;">			        width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VDividedBox</span><span style="color: #7400FF;">&gt;</span></span>	
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Panel</span><span style="color: #7400FF;">&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HDividedBox</span><span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></td></tr></table></div>

<p><strong>Código fuente del archivo ejemplo/HTMLToolTip.as:</strong></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
</pre></td><td class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #9900cc; font-weight: bold;">package</span> ejemplo
<span style="color: #000000;">&#123;</span>
<span style="color: #009900;">//Esta es la clase que maneja el tooltip para que muestre el contenido</span>
<span style="color: #009900;">//que esta en html y no como un string.</span>
     <span style="color: #0033ff; font-weight: bold;">import</span> mx.containers.<span style="color: #000000; font-weight: bold;">*</span>;  
     <span style="color: #0033ff; font-weight: bold;">import</span> mx.controls.Text;  
     <span style="color: #0033ff; font-weight: bold;">import</span> mx.controls.ToolTip;  
     <span style="color: #0033ff; font-weight: bold;">import</span> mx.core.<span style="color: #000000; font-weight: bold;">*</span>;  
&nbsp;
     <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #9900cc; font-weight: bold;">class</span> HTMLToolTip extends ToolTip  
     <span style="color: #000000;">&#123;</span>  
         <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> HTMLToolTip<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>  
         <span style="color: #000000;">&#123;</span>    <span style="color: #0033ff; font-weight: bold;">super</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>; <span style="color: #000000;">&#125;</span>  
&nbsp;
         override <span style="color: #0033ff; font-weight: bold;">protected</span> <span style="color: #339966; font-weight: bold;">function</span> commitProperties<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span><span style="color: #000000;">&#123;</span>  
             <span style="color: #0033ff; font-weight: bold;">super</span>.commitProperties<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;  
             textField.<span style="color: #004993;">htmlText</span> = <span style="color: #004993;">text</span>;  
         <span style="color: #000000;">&#125;</span>  
     <span style="color: #000000;">&#125;</span> 
<span style="color: #000000;">&#125;</span></pre></td></tr></table></div>

<p><strong>Archivo sources.xml:</strong></p>

<div class="wp_syntax"><div class="code"><pre class="xml" style="font-family:monospace;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;xml<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;lista<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>El Tiempo - Mundo<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.eltiempo.com/mundo/rss.xml<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Colombia<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>El Tiempo - Colombia<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.eltiempo.com/colombia/rss.xml<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Colombia<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>El Espectador<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.elespectador.com/rss.xml <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Colombia<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>El Pais - America Latina<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.elpais.com/rss/feed.html?feedId=17041<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>España<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>ABC - Portada<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.abc.es/rss/feeds/abcPortada.xml<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>España<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>BBC Mundo<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://www.bbc.co.uk/mundo/index.xml<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Inglaterra<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>CNN - World<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://rss.cnn.com/rss/edition_world.rss<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Estados Unidos<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Reuters - World News<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://feeds.reuters.com/reuters/worldNews<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Estados Unidos<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>BusinessWeek.com<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://rss.businessweek.com/bw_rss/bwdaily<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Estados Unidos<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Google News<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/nombre<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>http://news.google.com/news?output=rss<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/url<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Alemania<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/pais<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/item<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/lista<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/xml<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://blog.gkudos.com/2009/09/06/creando-un-lector-de-georss-con-adobe-flex-3/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Crear un Lector de Podcasts con Adobe Flex 3</title>
		<link>http://blog.gkudos.com/2009/08/29/crear-un-lector-de-podcasts-con-flex/</link>
		<comments>http://blog.gkudos.com/2009/08/29/crear-un-lector-de-podcasts-con-flex/#comments</comments>
		<pubDate>Sat, 29 Aug 2009 20:04:27 +0000</pubDate>
		<dc:creator>juanmendez</dc:creator>
				<category><![CDATA[Adobe Flex]]></category>
		<category><![CDATA[adobe flex 3]]></category>
		<category><![CDATA[Tutorial]]></category>

		<guid isPermaLink="false">http://blog.gkudos.com/?p=168</guid>
		<description><![CDATA[El código fuente publicado en esta entrada muestra una aplicación flex que permite la consulta y descarga de archivos podcast publicados en internet. A continuación una imagen de muestra del aplicativo:

Básicamente el usuario selecciona un canal del ComboBox superior y las entradas de podcast se cargan en la lista que tiene un botón de reproducción [...]]]></description>
			<content:encoded><![CDATA[<p>El código fuente publicado en esta entrada muestra una aplicación flex que permite la consulta y descarga de archivos podcast publicados en internet. A continuación una imagen de muestra del aplicativo:</p>
<p><img class="aligncenter" src="http://blog.gkudos.com/wp-content/uploads/podcast_reader.jpg" alt="" /><br />
Básicamente el usuario selecciona un canal del ComboBox superior y las entradas de podcast se cargan en la lista que tiene un botón de reproducción y descarga para cada uno de los items.<br />
Cuando el usuario selecciona el botón de reproducción de una de las entradas, el componente de audio carga el mp3 relacionado en el componente del  &#8220;player&#8221; que se encuentra en la parte inferior de la pantalla.</p>
<p><a href="http://static.gkudos.com/blog/podcast/podcast.html" target="_blank">Ver aplicación en Línea </a>(*)</p>
<p><a href="http://static.gkudos.com/blog/podcast/podcast_player.rar" target="_blank">Descargar Código Fuente</a></p>
<p><strong> Notas (*) :</strong></p>
<ul>
<li>La carga de algunos RSS y el analizador de espectro solo funcionan ejecutando el aplicativo en forma local.</li>
<li>La descarga de archivos funciona únicamente si el usuario tiene instalado el  Flash Player versión 10</li>
</ul>
<p><center><strong>Código Fuente:</strong></center></p>
<p><strong>Mp3Player.mxml</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span> </span>
<span style="color: #000000;">	creationComplete=<span style="color: #ff0000;">&quot;{init();}&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span></span>
<span style="color: #000000;">	xmlns:fx=<span style="color: #ff0000;">&quot;com.fusiox.ui.*&quot;</span> </span>
<span style="color: #000000;">	layout=<span style="color: #ff0000;">&quot;vertical&quot;</span><span style="color: #7400FF;">&gt;</span></span>
<span style="color: #339933;">&lt;mx:Script&gt;</span>
<span style="color: #339933;">	&lt;![CDATA[</span>
<span style="color: #339933;">		import mx.rpc.events.ResultEvent;</span>
<span style="color: #339933;">		import mx.collections.ArrayCollection;</span>
<span style="color: #339933;">		import mx.controls.Alert;</span>
<span style="color: #339933;">		import mx.utils.ObjectUtil;</span>
<span style="color: #339933;">        // Play &amp; Pause Icons</span>
<span style="color: #339933;">		[Embed(source=&quot;assets/Pause.png&quot;)] 	[Bindable] public var iconPause:Class;</span>
<span style="color: #339933;">		[Embed(source=&quot;assets/Play.png&quot;)] 	[Bindable] public var iconPlay:Class;</span>
<span style="color: #339933;">		[Embed(source=&quot;assets/Next.png&quot;)] 	[Bindable] public var iconNext:Class;</span>
&nbsp;
&nbsp;
<span style="color: #339933;">		private var sound:Sound;						// Mp3 File </span>
<span style="color: #339933;">		private var soundChannel:SoundChannel;			// Reference to playing channel </span>
<span style="color: #339933;">		private var pausePosition:Number;				// Current play position (time)</span>
<span style="color: #339933;">		private var percent:Number;						// Current played percentage</span>
<span style="color: #339933;">		private var isPlaying:Boolean = false;			// Is the mp3 playing?</span>
<span style="color: #339933;">		private var isLoaded:Boolean = false;			// Is the mp3 loaded?</span>
<span style="color: #339933;">		private var updateSeek:Timer = new Timer(500);	// Timer for updating the seek bar</span>
&nbsp;
<span style="color: #339933;">		[Bindable]</span>
<span style="color: #339933;">        public var podcastChannels:ArrayCollection = new ArrayCollection(</span>
<span style="color: #339933;">            [ {label:&quot;Music - Free Music Everywhere Podcast&quot;, data:'http://feeds2.feedburner.com/FreeMusicEverywhere'}, </span>
<span style="color: #339933;">              {label:&quot;Music - Last.fm Free Mp3 - Electronic &quot;, data:'http://ws.audioscrobbler.com/2.0/tag/Electronic/podcast.rss'},</span>
<span style="color: #339933;">              {label:&quot;Music - Last.fm Free Mp3 - Metal &quot;, data:'http://ws.audioscrobbler.com/2.0/tag/Metal/podcast.rss'},</span>
<span style="color: #339933;">              {label:&quot;Music - Last.fm Free Mp3 - Jazz &quot;, data:'http://ws.audioscrobbler.com/2.0/tag/Jazz/podcast.rss'},</span>
<span style="color: #339933;">              {label:&quot;Music - Last.fm Free Mp3 - Rock &quot;, data:'http://ws.audioscrobbler.com/2.0/tag/Rock/podcast.rss'},</span>
<span style="color: #339933;">              {label:&quot;Music - Last.fm Free Mp3 - Classical &quot;, data:'http://ws.audioscrobbler.com/2.0/tag/Classical/podcast.rss'},</span>
<span style="color: #339933;">              {label:&quot;News - Guardian Daily&quot;, data:'http://www.guardian.co.uk/news/series/guardiandaily/podcast.xml'},</span>
<span style="color: #339933;">              {label:&quot;News - Tech Weekly&quot;, data:'http://www.guardian.co.uk/technology/series/techweekly/podcast.xml'},</span>
<span style="color: #339933;">              {label:&quot;News - Business Weekly&quot;, data:'http://downloads.bbc.co.uk/podcasts/worldservice/bizweekly/rss.xml'},</span>
<span style="color: #339933;">              {label:&quot;News - BBC Global News&quot;, data:'http://downloads.bbc.co.uk/podcasts/worldservice/globalnews/rss.xml'},</span>
<span style="color: #339933;">              {label:&quot;News - La Historia del Mundo con Diana Uribe&quot;, data:'http://www.caracol.com.co/feed.aspx?id=PROG_320899'}, </span>
<span style="color: #339933;">              {label:&quot;News - Hora de Negocios con Paola Ochoa&quot;, data:'http://www.caracol.com.co/feed.aspx?id=PROG_555605'} </span>
<span style="color: #339933;">            ]);</span>
&nbsp;
<span style="color: #339933;">		private function init():void { </span>
<span style="color: #339933;">			// Add event listener for seek bar updater &amp; start timer							</span>
<span style="color: #339933;">            updateSeek.addEventListener(TimerEvent.TIMER, updatePosition);</span>
<span style="color: #339933;">            updateSeek.start();</span>
<span style="color: #339933;">            // Add mouse click listener for the seek bar</span>
<span style="color: #339933;">            seekAudioBar.addEventListener(MouseEvent.CLICK, seek);</span>
<span style="color: #339933;">			// Add event listener that blurs the visualization</span>
<span style="color: #339933;">			viz.addEventListener(&quot;beforeVisualization&quot;, vizFade);</span>
<span style="color: #339933;">			selectChannel();</span>
<span style="color: #339933;">			//Add Events that come from each renderer. </span>
<span style="color: #339933;">			rssList.addEventListener('playPodcast', playPodcast);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function selectChannel():void {</span>
<span style="color: #339933;">            rssService.url = channelsCb.selectedItem.data;</span>
<span style="color: #339933;">			rssService.send();</span>
<span style="color: #339933;">        } </span>
&nbsp;
<span style="color: #339933;">        protected function onServiceResult(event:ResultEvent):void {</span>
<span style="color: #339933;">			rssList.dataProvider = event.result.rss.channel.item;</span>
<span style="color: #339933;">			next();</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		protected function playPodcast(event:Event):void {</span>
<span style="color: #339933;">			var selection:Object = rssList.selectedItem ; </span>
<span style="color: #339933;">			loadSound(selection.enclosure.url);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function loadSound(mp3Url:String):void{</span>
<span style="color: #339933;">			// If the song isn't loaded yet, set up a new sound load request</span>
<span style="color: #339933;">			sound = new Sound();</span>
<span style="color: #339933;">			sound.load(new URLRequest(mp3Url));</span>
<span style="color: #339933;">			// Add an event listener to check for song load complete event</span>
<span style="color: #339933;">			sound.addEventListener(Event.COMPLETE, songLoaded);</span>
<span style="color: #339933;">			// Show text for loading song and add event listener for updating</span>
<span style="color: #339933;">			sound.addEventListener(ProgressEvent.PROGRESS, updateStatus);</span>
<span style="color: #339933;">			sound.addEventListener(IOErrorEvent.IO_ERROR, onIOError);</span>
<span style="color: #339933;">			loadProgressBar.visible=true;</span>
<span style="color: #339933;">			loadProgressBar.text = &quot;0 %&quot;</span>
<span style="color: #339933;">		}</span>
<span style="color: #339933;">		private function updateStatus(e:ProgressEvent):void {</span>
<span style="color: #339933;">			var loadPercent:Number = Math.round((e.bytesLoaded / e.bytesTotal) * 100);</span>
<span style="color: #339933;">			loadProgressBar.text = loadPercent+&quot; %&quot;;</span>
<span style="color: #339933;">		}</span>
<span style="color: #339933;">		private function onIOError(event:IOErrorEvent):void{</span>
<span style="color: #339933;">		    Alert.show(&quot;The sound could not be loaded: &quot; + event.text, &quot;Error&quot;);</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		// Once the song is loaded...</span>
<span style="color: #339933;">		private function songLoaded(e:Event):void {</span>
<span style="color: #339933;">			if(soundChannel){</span>
<span style="color: #339933;">				soundChannel.stop()</span>
<span style="color: #339933;">			}</span>
&nbsp;
<span style="color: #339933;">			var selection:Object = rssList.selectedItem ; </span>
<span style="color: #339933;">			podTitle.text = selection.title;</span>
&nbsp;
<span style="color: #339933;">			// Hide status text</span>
<span style="color: #339933;">			loadProgressBar.visible = false;</span>
<span style="color: #339933;">			// Remove load event listener</span>
<span style="color: #339933;">			sound.removeEventListener(Event.COMPLETE, songLoaded);</span>
<span style="color: #339933;">			// Turn on seek bar</span>
<span style="color: #339933;">			enableSeek();</span>
<span style="color: #339933;">			// Play the song</span>
<span style="color: #339933;">			soundChannel = sound.play(0);</span>
<span style="color: #339933;">            // Pull the title/artist/album from the ID3 tags and display</span>
<span style="color: #339933;">            theArtistAlbum.text  = &quot;&quot;;</span>
<span style="color: #339933;">            if(sound.id3.TIT2){</span>
<span style="color: #339933;">            	theArtistAlbum.text += sound.id3.TIT2;</span>
<span style="color: #339933;">            }</span>
<span style="color: #339933;">            if(sound.id3.artist){</span>
<span style="color: #339933;">            	theArtistAlbum.text += &quot;, &quot;+ sound.id3.artist;</span>
<span style="color: #339933;">            }</span>
<span style="color: #339933;">			// Song is loaded</span>
<span style="color: #339933;">			isLoaded = true;</span>
<span style="color: #339933;">			seekAudioBar.visible = isLoaded;</span>
<span style="color: #339933;">			isPlaying = true;</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		// Play or Pause button has been clicked</span>
<span style="color: #339933;">		private function playPause(e:Event = null):void  {</span>
<span style="color: #339933;">			// Song playing?</span>
<span style="color: #339933;">			if(isPlaying) {</span>
<span style="color: #339933;">				// Save the current position in the track, stop playback, change button icon</span>
<span style="color: #339933;">				pausePosition = soundChannel.position;</span>
<span style="color: #339933;">				soundChannel.stop();</span>
<span style="color: #339933;">				playPauseBtn.setStyle(&quot;icon&quot;, iconPlay);</span>
<span style="color: #339933;">			// Song is not playing?</span>
<span style="color: #339933;">			} else {</span>
<span style="color: #339933;">				// The song IS loaded, so play it</span>
<span style="color: #339933;">				soundChannel = sound.play(pausePosition);</span>
<span style="color: #339933;">				// Change the button icon to the pause style</span>
<span style="color: #339933;">				playPauseBtn.setStyle(&quot;icon&quot;, iconPause);</span>
<span style="color: #339933;">			}</span>
<span style="color: #339933;">			// Regardless of playing state, change it now to the opposite</span>
<span style="color: #339933;">			isPlaying = !isPlaying;</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		// Enabled the seek (progress) bar</span>
<span style="color: #339933;">		public function enableSeek():void {</span>
<span style="color: #339933;">			seekAudioBar.enabled = true;</span>
<span style="color: #339933;">			seekAudioBar.visible = true;</span>
<span style="color: #339933;">		}			</span>
&nbsp;
<span style="color: #339933;">		// Add a color transform to the visulization to create the fade effect</span>
<span style="color: #339933;">		private function vizFade(e:Event):void {</span>
<span style="color: #339933;">			e.target.bitmapData.colorTransform(</span>
<span style="color: #339933;">				e.target.bitmapData.rect, new ColorTransform(0.75,0.75,0.75,.75));</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		// Called when the seek (progress) bar needs updating</span>
<span style="color: #339933;">		private function updatePosition(e:Event):void {</span>
<span style="color: #339933;"> 			// Is a song playing?</span>
<span style="color: #339933;"> 			if(isPlaying &amp;&amp; soundChannel) { </span>
<span style="color: #339933;"> 				// If the position is beyond the song start, calculate &amp; set the percentage</span>
<span style="color: #339933;"> 				percent = soundChannel.position &gt; 0 ? (soundChannel.position/sound.length)*100 : 0;</span>
<span style="color: #339933;">				seekAudioBar.setProgress(percent,100);</span>
<span style="color: #339933;">	   			// Tell the seekbar to redraw itself</span>
<span style="color: #339933;">	   			seekAudioBar.validateNow();</span>
<span style="color: #339933;">	   		}</span>
<span style="color: #339933;">		}</span>
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
<span style="color: #339933;">		// Mouse click event on the seekbar calls this function</span>
<span style="color: #339933;">		private function seek(e:MouseEvent):void {</span>
<span style="color: #339933;">			// Is the song playing AND is the seekbar enabled and visible?</span>
<span style="color: #339933;">			if(isPlaying &amp;&amp; seekAudioBar.enabled) { </span>
<span style="color: #339933;">				// Stop playing at current position, change to new location, continue playing</span>
<span style="color: #339933;">				soundChannel.stop();</span>
<span style="color: #339933;">				pausePosition = (seekAudioBar.contentMouseX/seekAudioBar.width)*sound.length;</span>
<span style="color: #339933;">				soundChannel = sound.play(pausePosition);</span>
<span style="color: #339933;">				setVolume(this.volumeControl.value)</span>
<span style="color: #339933;">			}</span>
<span style="color: #339933;">		}</span>
&nbsp;
<span style="color: #339933;">		private function setVolume(volume:Number):void {</span>
<span style="color: #339933;">            if(soundChannel){</span>
<span style="color: #339933;">	            var transform:SoundTransform = soundChannel.soundTransform;</span>
<span style="color: #339933;">	            transform.volume = volume;</span>
<span style="color: #339933;">            	soundChannel.soundTransform = transform;</span>
<span style="color: #339933;">            }</span>
<span style="color: #339933;">        }</span>
&nbsp;
<span style="color: #339933;">        private function next():void{</span>
<span style="color: #339933;">        	var selectedIdx:int = rssList.selectedIndex;</span>
<span style="color: #339933;">        	if(selectedIdx &lt; rssList.dataProvider.length){</span>
<span style="color: #339933;">        		rssList.selectedIndex = ++selectedIdx;</span>
<span style="color: #339933;">        		playPodcast(null);</span>
<span style="color: #339933;">        	}</span>
<span style="color: #339933;">        }</span>
&nbsp;
<span style="color: #339933;">	]]&gt;</span>
<span style="color: #339933;">&lt;/mx:Script&gt;</span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Style</span> source=<span style="color: #ff0000;">&quot;style.css&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HTTPService</span> id=<span style="color: #ff0000;">&quot;rssService&quot;</span> result=<span style="color: #ff0000;">&quot;{onServiceResult(event)}&quot;</span> resultFormat=<span style="color: #ff0000;">&quot;object&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Fade</span> id=<span style="color: #ff0000;">&quot;FadeIn&quot;</span> duration=<span style="color: #ff0000;">&quot;3000&quot;</span> alphaFrom=<span style="color: #ff0000;">&quot;0.0&quot;</span> alphaTo=<span style="color: #ff0000;">&quot;1.0&quot;</span><span style="color: #7400FF;">/&gt;</span></span>	
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Fade</span> id=<span style="color: #ff0000;">&quot;FadeOut&quot;</span> duration=<span style="color: #ff0000;">&quot;3000&quot;</span> alphaFrom=<span style="color: #ff0000;">&quot;1.0&quot;</span> alphaTo=<span style="color: #ff0000;">&quot;0.0&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VDividedBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;50%&quot;</span>  <span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Label</span> text=<span style="color: #ff0000;">&quot;My Flex Based Podcast Reader&quot;</span> fontWeight=<span style="color: #ff0000;">&quot;bold&quot;</span> fontSize=<span style="color: #ff0000;">&quot;16&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span><span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Label</span> text=<span style="color: #ff0000;">&quot;Available Podcasts:&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:ComboBox</span> id=<span style="color: #ff0000;">&quot;channelsCb&quot;</span> dataProvider=<span style="color: #ff0000;">&quot;{podcastChannels}&quot;</span> width=<span style="color: #ff0000;">&quot;90%&quot;</span> close=<span style="color: #ff0000;">&quot;selectChannel();&quot;</span><span style="color: #7400FF;">/&gt;</span></span>	
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HBox</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:List</span> id=<span style="color: #ff0000;">&quot;rssList&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100%&quot;</span> itemRenderer=<span style="color: #ff0000;">&quot;RSSRenderer&quot;</span> labelField=<span style="color: #ff0000;">&quot;title&quot;</span>  <span style="color: #7400FF;">/&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VBox</span> id=<span style="color: #ff0000;">&quot;podBox&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;50%&quot;</span> horizontalAlign=<span style="color: #ff0000;">&quot;center&quot;</span>  <span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Text</span> id=<span style="color: #ff0000;">&quot;podTitle&quot;</span>  fontSize=<span style="color: #ff0000;">&quot;15&quot;</span> fontWeight=<span style="color: #ff0000;">&quot;bold&quot;</span> maxWidth=<span style="color: #ff0000;">&quot;{podBox.width}&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Text</span> id=<span style="color: #ff0000;">&quot;theArtistAlbum&quot;</span> text=<span style="color: #ff0000;">&quot;or enter a new URL to load below&quot;</span> fontStyle=<span style="color: #ff0000;">&quot;italic&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HBox</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;fx:Visualization</span> id=<span style="color: #ff0000;">&quot;viz&quot;</span> type=<span style="color: #ff0000;">&quot;bars&quot;</span> bars=<span style="color: #ff0000;">&quot;96&quot;</span> channel=<span style="color: #ff0000;">&quot;stereo&quot;</span> </span>
<span style="color: #000000;">					width=<span style="color: #ff0000;">&quot;95%&quot;</span> height=<span style="color: #ff0000;">&quot;{volumeControl.height}&quot;</span> </span>
<span style="color: #000000;">					audioFillColor=<span style="color: #ff0000;">&quot;0xFFFFFF&quot;</span> audioLineColor=<span style="color: #ff0000;">&quot;0xFFFFFF&quot;</span><span style="color: #7400FF;">/&gt;</span></span>	
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:VSlider</span> id=<span style="color: #ff0000;">&quot;volumeControl&quot;</span> allowTrackClick=<span style="color: #ff0000;">&quot;false&quot;</span> toolTip=<span style="color: #ff0000;">&quot;{}&quot;</span> liveDragging=<span style="color: #ff0000;">&quot;true&quot;</span> </span>
<span style="color: #000000;">					thumbDrag=<span style="color: #ff0000;">&quot;setVolume(this.volumeControl.value)&quot;</span> </span>
<span style="color: #000000;">					height=<span style="color: #ff0000;">&quot;100&quot;</span> value=<span style="color: #ff0000;">&quot;.5&quot;</span> maximum=<span style="color: #ff0000;">&quot;1&quot;</span> minimum=<span style="color: #ff0000;">&quot;0&quot;</span><span style="color: #7400FF;">/&gt;</span></span>						
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HBox</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:ControlBar</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> <span style="color: #7400FF;">&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Button</span> id=<span style="color: #ff0000;">&quot;playPauseBtn&quot;</span> click=<span style="color: #ff0000;">&quot;{playPause(event)}&quot;</span>  icon=<span style="color: #ff0000;">&quot;{iconPlay}&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Button</span> icon=<span style="color: #ff0000;">&quot;{iconNext}&quot;</span> click=<span style="color: #ff0000;">&quot;{next();}&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
				<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:ProgressBar</span> id=<span style="color: #ff0000;">&quot;seekAudioBar&quot;</span>  showEffect=<span style="color: #ff0000;">&quot;{FadeIn}&quot;</span> height=<span style="color: #ff0000;">&quot;16&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> </span>
<span style="color: #000000;">					enabled=<span style="color: #ff0000;">&quot;false&quot;</span> visible=<span style="color: #ff0000;">&quot;false&quot;</span> </span>
<span style="color: #000000;">					mode=<span style="color: #ff0000;">&quot;manual&quot;</span> label=<span style="color: #ff0000;">&quot;&quot;</span> indeterminate=<span style="color: #ff0000;">&quot;false&quot;</span> labelPlacement=<span style="color: #ff0000;">&quot;center&quot;</span><span style="color: #7400FF;">/&gt;</span></span>	
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:ControlBar</span><span style="color: #7400FF;">&gt;</span></span>
			<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Label</span> id=<span style="color: #ff0000;">&quot;loadProgressBar&quot;</span> showEffect=<span style="color: #ff0000;">&quot;{FadeIn}&quot;</span> hideEffect=<span style="color: #ff0000;">&quot;{FadeOut}&quot;</span> width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;20&quot;</span></span>
<span style="color: #000000;">					enabled=<span style="color: #ff0000;">&quot;false&quot;</span> visible=<span style="color: #ff0000;">&quot;false&quot;</span> </span>
<span style="color: #000000;">					text=<span style="color: #ff0000;">&quot;&quot;</span> fontWeight=<span style="color: #ff0000;">&quot;bold&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
		<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VBox</span><span style="color: #7400FF;">&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:VDividedBox</span><span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p><strong>RSSRenderer.mxml</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:HBox</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span> </span>
<span style="color: #000000;">	width=<span style="color: #ff0000;">&quot;100%&quot;</span> height=<span style="color: #ff0000;">&quot;60&quot;</span> </span>
<span style="color: #000000;">	verticalGap=<span style="color: #ff0000;">&quot;0&quot;</span> verticalAlign=<span style="color: #ff0000;">&quot;middle&quot;</span><span style="color: #7400FF;">&gt;</span></span>
<span style="color: #339933;">&lt;mx:Script&gt;</span>
<span style="color: #339933;">&lt;![CDATA[</span>
<span style="color: #339933;">import flash.net.navigateToURL;</span>
<span style="color: #339933;">[Embed(source=&quot;assets/Play.png&quot;)] 	[Bindable] public var iconPlay:Class;</span>
<span style="color: #339933;">[Embed(source=&quot;assets/Save.png&quot;)] 	[Bindable] public var iconSave:Class;</span>
<span style="color: #339933;">//procesa el dato para ser configurado por el renderer	</span>
<span style="color: #339933;">override protected function commitProperties():void {</span>
<span style="color: #339933;">	super.commitProperties();</span>
<span style="color: #339933;">	if (data == null) { return; }</span>
<span style="color: #339933;">	lbl.label = data.title;</span>
<span style="color: #339933;">	lbl.toolTip = data.description;</span>
<span style="color: #339933;">	downloadProgress.text = &quot;&quot;;</span>
<span style="color: #339933;">}</span>
<span style="color: #339933;">//</span>
<span style="color: #339933;">protected function playPodcast():void {</span>
<span style="color: #339933;">	dispatchEvent(new Event('playPodcast', true));</span>
<span style="color: #339933;">}</span>
<span style="color: #339933;">//abre la página html original donde se publicó el podcast</span>
<span style="color: #339933;">private function viewPost():void{</span>
<span style="color: #339933;">	navigateToURL(new URLRequest(data.link), &quot;_blank&quot;);</span>
<span style="color: #339933;">}</span>
<span style="color: #339933;">//inicia el proceso de descarga del mp3</span>
<span style="color: #339933;">private function downloadMp3():void{</span>
<span style="color: #339933;">	var urlReq:URLRequest = new URLRequest(data.enclosure.url);</span>
<span style="color: #339933;">	var fileRef:FileReference = new FileReference();</span>
<span style="color: #339933;">	fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);  </span>
<span style="color: #339933;">   	fileRef.addEventListener(Event.COMPLETE, completeHandler);  </span>
<span style="color: #339933;">	fileRef.download(urlReq);</span>
<span style="color: #339933;">}</span>
<span style="color: #339933;">//Progreso de la descarga del archivo mp3</span>
<span style="color: #339933;">private function progressHandler(e:ProgressEvent):void {  </span>
<span style="color: #339933;">     var loadPercent:Number = Math.round((e.bytesLoaded / e.bytesTotal) * 100);</span>
<span style="color: #339933;">	downloadProgress.text = loadPercent+&quot; %&quot;;</span>
<span style="color: #339933;">} </span>
<span style="color: #339933;">private function completeHandler(event:Event):void {  </span>
<span style="color: #339933;">     downloadProgress.text = &quot;Download Complete&quot;;  </span>
<span style="color: #339933;">}  </span>
<span style="color: #339933;">	]]&gt;</span>
<span style="color: #339933;">&lt;/mx:Script&gt;</span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:LinkButton</span> id=<span style="color: #ff0000;">&quot;lbl&quot;</span> width=<span style="color: #ff0000;">&quot;260&quot;</span> color=<span style="color: #ff0000;">&quot;0x0&quot;</span> fontWeight=<span style="color: #ff0000;">&quot;bold&quot;</span> click=<span style="color: #ff0000;">&quot;{viewPost()}&quot;</span>  <span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Button</span> toolTip=<span style="color: #ff0000;">&quot;Play&quot;</span> icon=<span style="color: #ff0000;">&quot;{iconPlay}&quot;</span> click=<span style="color: #ff0000;">&quot;playPodcast()&quot;</span> height=<span style="color: #ff0000;">&quot;32&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Button</span> toolTip=<span style="color: #ff0000;">&quot;Download&quot;</span> icon=<span style="color: #ff0000;">&quot;{iconSave}&quot;</span> click=<span style="color: #ff0000;">&quot;downloadMp3()&quot;</span> height=<span style="color: #ff0000;">&quot;32&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Label</span> id=<span style="color: #ff0000;">&quot;downloadProgress&quot;</span> text=<span style="color: #ff0000;">&quot;&quot;</span>  <span style="color: #7400FF;">/&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:HBox</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p><strong>Referencias:</strong></p>
<ul>
<li><a href="http://www.internaldrive.com/2009/03/11/making-a-flex-mp3-player/">Making a Flex MP3 Player</a></li>
<li><a href="http://blog.flexcommunity.net/?p=9">Simple Flex Mp3 Player</a></li>
<li>Librerías de íconos utilizadas: <a href="http://www.webappers.com/2008/02/12/webappers-released-free-web-application-icons-set/">Librería 1</a>, <a href="http://itweek.deviantart.com/art/Knob-Buttons-Toolbar-icons-73463960">Librería 2</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.gkudos.com/2009/08/29/crear-un-lector-de-podcasts-con-flex/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Groovy: Ejemplos Básicos de Programación</title>
		<link>http://blog.gkudos.com/2009/07/01/groovy-ejemplos-basicos-de-programacion/</link>
		<comments>http://blog.gkudos.com/2009/07/01/groovy-ejemplos-basicos-de-programacion/#comments</comments>
		<pubDate>Wed, 01 Jul 2009 16:52:57 +0000</pubDate>
		<dc:creator>juanmendez</dc:creator>
				<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[Groovy]]></category>

		<guid isPermaLink="false">http://blog.gkudos.com/?p=154</guid>
		<description><![CDATA[
En el siguiente archivo Groovy Examples pueden encontrarse algunos ejemplos básicos de programación utilizando el lenguaje Groovy.
Entre otros pueden encontrarse los siguientes ejemplos:

 En el archivo _1_Hello hay una introduccion a la definicion de variables, rangos, listas y mapas y a la definicion de closures
En el archivo _2_Estructuras_Logicas hay una descripcion de la forma en [...]]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter" title="Groovy" src="http://media.xircles.codehaus.org/_projects/groovy/_logos/medium.png" alt="" width="203" height="100" /></p>
<p>En el siguiente archivo <a href="http://static.gkudos.com/blog/Groovy_Examples.rar">Groovy Examples</a> pueden encontrarse algunos ejemplos básicos de programación utilizando el lenguaje Groovy.<br />
Entre otros pueden encontrarse los siguientes ejemplos:</p>
<ul>
<li> En el archivo _1_Hello hay una introduccion a la definicion de variables, rangos, listas y mapas y a la definicion de closures</li>
<li>En el archivo _2_Estructuras_Logicas hay una descripcion de la forma en que trabajan las estructuras de control basicas y los loops particulares de groovy</li>
<li>En el archivo _3_Metodos hay una explicacion del llamado a métodos y las sentencias try_catch_finally</li>
</ul>
<p><a href="http://static.gkudos.com/blog/Groovy_Examples.rar">Descargar Archivo Groovy Examples</a></p>
<p>Ejemplo de Loops con Groovy:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
</pre></td><td class="code"><pre class="groovy" style="font-family:monospace;">&nbsp;
<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #993333;">void</span> loops<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#123;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//la variable it es el iterador</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//al igual que todas los loop y closures, las sentencias del bucle se declaran entre corchetes</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">// inicia en 0</span>
&nbsp;
		5.<span style="color: #993399;">times</span> <span style="color: #66cc66;">&#123;</span><span style="color: #993399;">println</span> <span style="color: #ff0000;">&quot;Times + $it &quot;</span><span style="color: #66cc66;">&#125;</span>
&nbsp;
		1.<span style="color: #993399;">upto</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">3</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span><span style="color: #993399;">println</span> <span style="color: #ff0000;">&quot;Up + $it &quot;</span><span style="color: #66cc66;">&#125;</span>
&nbsp;
		4.<span style="color: #006600;">downto</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span><span style="color: #993399;">println</span> <span style="color: #ff0000;">&quot;Down + $it &quot;</span><span style="color: #66cc66;">&#125;</span>
&nbsp;
&nbsp;
&nbsp;
		<span style="color: #000000; font-weight: bold;">def</span> sum <span style="color: #66cc66;">=</span> <span style="color: #cc66cc;">0</span>
&nbsp;
		1.<span style="color: #993399;">upto</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">100</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span>sum <span style="color: #66cc66;">+=</span> <span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #993399;">println</span> sum
&nbsp;
&nbsp;
&nbsp;
		<span style="color: #66cc66;">&#40;</span>1..6<span style="color: #66cc66;">&#41;</span>.<span style="color: #663399;">each</span> <span style="color: #66cc66;">&#123;</span><span style="color: #993399;">println</span> <span style="color: #ff0000;">&quot;Range $it&quot;</span><span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

]]></content:encoded>
			<wfw:commentRss>http://blog.gkudos.com/2009/07/01/groovy-ejemplos-basicos-de-programacion/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
