Adobe Flex: Trocar de figura no DataGrid de acordo com o DataProvider

Olá Pessoal,

Segue um artigo encontrado na net sobre inserir imagens em um DataGrid dependendo do resultado obtido do banco de dados. Foi uma de minhas necessidades esses dias.

Em um projeto com Adobe Flex do autor, ele precisou alterar a imagem de uma determinada célula no DataGrid de acordo com o valor originado do DataProvider.

Por exemplo, se no DataProvider o campo STATUS vier preenchido com 0 deve ser exibida a imagem off.png, caso contrário, dever ser exibida a imagem on.png.

Após várias pesquisas no Google, fiz uma compilação dos casos semelhantes e cheguei ao resultado que eu desejava.

Abaixo segue o código com essa funcionalidade.

[sourcecode language=”xml”]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
[Bindable]
private var arAlternate:Array = new Array({"STATUS":0},{"STATUS":1},{"STATUS":1},{"STATUS":0},{"STATUS":1},{"STATUS":0});
]]>
</mx:Script>
<mx:DataGrid id="dgAlternate" width="60" dataProvider="{arAlternate}">
<mx:columns>
<mx:DataGridColumn headerText=’Status’>
<mx:itemRenderer>
<mx:Component>
<mx:Image horizontalAlign="center" width="32" height="32" source="{data.STATUS == 0 ? ‘off.png’ : ‘on.png’}" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:Application>
[/sourcecode]

O resultado final obtido foi:


 .::Leonardo

2 Comments

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="">

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.