Popa Mihai

PopaMihai.com – Flex, Flash, AIR and ActionScript articles and tutorials

Archive for the ‘ArrayCollection’ tag

ItemRenderer is Not Updating the View When the DataProvider Changes

2 comments

The other day while I was working on a project I found a problem with the my List’s ItemRenderer.

Here’s the situation: I had to use the ItemRenderer to display some htmlText in my List. Here’s the ItemRenderer that I came up with:

listRenderer.mxml

< ?xml version="1.0" encoding="utf-8"?>
<mx:canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="240" height="50" creationComplete="init()">
 
	<mx:script>
		< ![CDATA[
			import mx.controls.Label;
 
			private function init() : void {
				rendererText.htmlText  = '<b>' + data.title + '' + '\n';
				rendererText.htmlText += 'meeting starts at: ' + data.time + '\n';
				rendererText.htmlText += 'and lasts for: ' + '<i>' + data.duration + '</i>';
			}
 
		]]>
	</mx:script>
 
	<mx:text id="rendererText" textAlign="left"></mx:text>
</mx:canvas>

But when I updating my dataProvider I found that the List was not updating along with my dataProvider. I checked everything over and over again until the only thing left that could still cause problems was the ItemRenderer itself.

As it turns out you should never use the creationComplete event with ItemRenderers.

After I rewrote my ItermRenderer everything worked as I expected:
Read the rest of this entry »

Written by Popa Mihai

August 25th, 2010 at 8:29 pm

Posted in Flex

Tagged with , , , ,

ArrayCollection of One Element as DataProvider

2 comments

Flex ArrayCollections are great when using them as data providers for datagrids, lists etc.

I used to load xml files with HTTPService and store the result event in an ArrayCollection that I then used as a data provider for my components.

Here’s a typical example:

< ?xml version="1.0" encoding="utf-8"?>
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle"
	backgroundColor="white" creationComplete="init()" viewSourceURL="srcview/index.html">
 
	<mx:script>
		< ![CDATA[
			import mx.collections.ArrayCollection;
			import mx.rpc.events.ResultEvent;
 
			[Bindable]
			private var dataProv : ArrayCollection = new ArrayCollection();
 
			private function init() : void {
				calendarService.send();
			}
 
			private function calendarServiceResult( event : ResultEvent ) : void {
				dataProv = event.result.events.event;
			}
 
		]]>
	</mx:script>
 
	<mx:datagrid id="dg" dataProvider="{dataProv}"></mx:datagrid>
 
	<mx:httpservice id="calendarService"
		url="http://www.popamihai.com/flex-files/ArrayCollectionOfOneElementAsDataProvider/calendar.xml"
		result="calendarServiceResult( event )"></mx:httpservice>
 
</mx:application>

The xml file calendar.xml has the following structure:

<events>
	<event>
		<date>13-07-2010</date>
		<starthour>01</starthour>
		<category>Aniversary</category>
	</event>
	<event>
		<date>12-07-2010</date>
		<starthour>02</starthour>
		<category>Meeting</category>
	</event>
	<event>
		<date>21-07-2010</date>
		<starthour>03</starthour>
		<category>To Do</category>
	</event>
</events>

As long as the xml files has more then one element everything works fine. Here’s the resulting SWF for this application:


Read the rest of this entry »

Written by Popa Mihai

August 25th, 2010 at 4:06 pm

Posted in Flex

Tagged with , , , , ,