Accordion（导航嵌入图片）

<?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>