<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
[Bindable]
[Embed(source="assets/00972.png")]
private var BulletCheck:Class;
[Bindable]
[Embed(source="assets/01263.png")]
private var BulletWarning:Class;
[Bindable]
[Embed(source="assets/02169.png")]
private var BulletCritical:Class;
]]>
</mx:Script>
<mx:XML id="itemsXML">
<items>
<item label="Item 1" status="warning" />
<item label="Item 2" status="critical" />
<item label="Item 3" status="critical" />
<item label="Item 4" status="check" />
<item label="Item 5" status="warning" />
<item label="Item 6" status="check" />
<item label="Item 7" status="check" />
<item label="Item 8" status="critical" />
<item label="Item 9" status="critical" />
</items>
</mx:XML>
<mx:ApplicationControlBar dock="true">
<mx:Label text="selectedIndex: {accordion.selectedIndex}" />
<mx:Spacer width="100" />
<mx:Label text="label: {accordion.getHeaderAt(accordion.selectedIndex).label}" />
</mx:ApplicationControlBar>
<mx:Accordion id="accordion"
width="400"
height="200">
<mx:VBox label="Success"
icon="{BulletCheck}"
width="100%"
height="100%">
<mx:DataGrid id="successGrid"
dataProvider="{itemsXML.item.(@status == 'check')}"
width="100%"
height="100%">
</mx:DataGrid>
</mx:VBox>
<mx:VBox label="Warning"
icon="{BulletWarning}"
width="100%"
height="100%">
<mx:DataGrid id="warningGrid"
dataProvider="{itemsXML.item.(@status == 'warning')}"
width="100%"
height="100%">
</mx:DataGrid>
</mx:VBox>
<mx:VBox label="Critical"
icon="{BulletCritical}"
width="100%"
height="100%">
<mx:DataGrid id="criticalGrid"
dataProvider="{itemsXML.item.(@status == 'critical')}"
width="100%"
height="100%">
</mx:DataGrid>
</mx:VBox>
</mx:Accordion>
</mx:Application>