<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark"  
         xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" 
         xmlns:nestedtreedatagrid="com.flexicious.nestedtreedatagrid.*" 
         xmlns:controls="com.flexicious.controls.*"
         xmlns:functional="com.flexicious.example.view.functional.*"
         creationComplete="application1_creationCompleteHandler(event)"
         >
    
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import com.flexicious.example.view.functional.MyDataGrid;
            import com.flexicious.example.view.support.customprint.MyCustomPager;
            
            import mock.FlexiciousMockGenerator;
            
            import mx.events.FlexEvent;
            
            
            
            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                mdg.buildFromXml(FlexiciousMockGenerator.mockNestedXml);
                mdg.dataProvider=FlexiciousMockGenerator.mockNestedData;
                mdg.validateNow();
                mdg.expandAll();
                
            }
            
        ]]>
    </fx:Script>
    <mx:HDividedBox width="100%" height="100%">
        <mx:VDividedBox width="50%" height="100%">
            <functional:MyDataGrid id="mdg" verticalGridLines="false" 
                                   width="100%" 
                                   height="100%"/>
            <s:Spacer height="50%"/>
        </mx:VDividedBox>
        <s:Spacer width="50%"/>
    </mx:HDividedBox>
</mx:HBox>