Images in DataGrid depending on data
Line Break
Author: Arjan (34 Articles) - Author Website
Arjan is a SAP Consultant specialized in ABAP and Front End development techniques like Web Dynpro, Adobe Interactive Forms, Flex and AIR. In his free time he likes to create examples for Flex-Blog and other applications using Flex, AIR and PHP. Other hobbies are movies and music. He is also the co-owner of Flex-Blog.com.
Flex DataGrids are usually used to give the user some overview of data. Sometimes we want to use a certain value in the data to describe something else (derive a value from the data).
For example, we want to display if a product is in stock yes or no using the following data:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <?xml version="1.0" encoding="UTF-8"?> <Products> <Product> <Name>Product One</Name> <InStock>0</InStock> </Product> <Product> <Name>Product Two</Name> <InStock>1</InStock> </Product> <Product> <Name>Product Three</Name> <InStock>10</InStock> </Product> <Product> <Name>Product Four</Name> <InStock>0</InStock> </Product> </Products> |
We can now easily display the number of items in stock using a datagrid:
A more clear definition would be to have an icon or image to display whether the item is in stock at all, the answer is the use of an ItemRenderer to render the appropriate image using a simple comparison.
You can view the source code of both examples using right mouseclick > view source.
Related posts:
- Style AdvancedDataGrid depending on data example
- Image as Button in a DataGrid
- Tree in Advanced DataGrid Example
- Progressbar in Datagrid Example
- Drag and Drop from DataGrid or AdvancedDataGrid to Tree
Written by · Filed Under Examples
Was this post useful to you?
(2 votes, average: 4.50 out of 5)
Loading ...Comments
2 Responses to “Images in DataGrid depending on data”
Hello!
Very Interesting post! Thank you for such interesting resource!
PS: Sorry for my bad english, I’v just started to learn this language
See you!
Your, Raiul Baztepo
Thank you for this wonderful tutorial.
It helps a lot.
one suggestion, provide more information regarding the itemrenderer so users will not just copy/paste the code, they will understand it.