explorer.mxml

a flex project similar a "window eplorer"

<?xml version="1.0" encoding="utf-8"?>
<mx:Application marginLeft="6" marginTop="6" marginRight="6" marginBottom="6" backgroundColor="#FFFFFF" pageTitle="File Explorer" initialize="initApp()" xmlns:mx="http://www.macromedia.com/2003/mxml">

    <!-- Lengthy script so I used an external file (best practice) -->
    <mx:Script source="explorer.as" />

    <!-- Use a basic Java object on the server to provide a file listing service -->
    <!-- The list method is used by the DataGrid control -->
    <!-- This directories method is used by the Tree control -->
    <mx:RemoteObject id="svcFiles" source="open.ListingService">
        <mx:method name="list" result="weigh( event.result )" showBusyCursor="true" />
        <mx:method name="directories" result="directories( event.result )" showBusyCursor="true" />
    </mx:RemoteObject>

    <!-- Formatting for various display elements -->
    <mx:DateFormatter id="fmtModified" formatString="M/D/YYYY L:NN AA" />
    <mx:NumberFormatter id="fmtSize" precision="0" useThousandsSeparator="true" />
    <mx:NumberFormatter id="fmtTotal" precision="2" />

    <!--  Direct file entry not implmented in this release
    <mx:HBox width="100%" verticalAlign="middle">
        <mx:Label text="Address" />
        <mx:ComboBox editable="true" width="100%" />
        <mx:Button label="Go"/>
    </mx:HBox>
    -->

    <!-- Main UI container provides the ability to resize horizontally -->
    <mx:HDividedBox width="100%" height="100%">

        <!-- Tree listing of directories (only) -->
        <mx:Box width="30%" height="100%">
            <mx:Tree id="treExplorer" labelField="name" nodeOpen="open( event )" nodeClose="closed( event )" change="list( event )" width="100%" height="100%" />
        </mx:Box>

        <!-- DataGrid display of listing specifics for files and directories -->
        <mx:Box width="70%" height="100%">
            <mx:DataGrid id="grdList" dataProvider="{svcFiles.list.result}" change="selection()" multipleSelection="true" width="100%" height="100%" vGridLines="false" alternatingRowColors="[0xFFFFFF]">
                <mx:columns>
                    <mx:Array>
                        <mx:DataGridColumn columnName="name" headerText="Name" cellRenderer="FileRenderer" width="180" backgroundColor="#F7F7F7" />
                        <mx:DataGridColumn columnName="size" headerText="Size" labelFunction="sizing" textAlign="right" width="95" />
                        <mx:DataGridColumn columnName="name" headerText="Type" labelFunction="file" width="120" />
                        <mx:DataGridColumn columnName="modified" headerText="Date Modified" labelFunction="modified" width="120" />
                    </mx:Array>
                </mx:columns>
            </mx:DataGrid>
        </mx:Box>
    </mx:HDividedBox>

    <!-- Status bar used for basic reporting on count and size of files -->
    <mx:HBox width="100%">
        <mx:Box width="75%" borderStyle="solid">
            <mx:Label id="lblSelection" />
        </mx:Box>
        <mx:Box width="10%" borderStyle="solid">
            <mx:Label id="lblTotal" />
        </mx:Box>
        <mx:HBox marginLeft="4" verticalAlign="middle" horizontalGap="5" width="15%" borderStyle="solid">
            <mx:Image source="@Embed( 'images/network.gif' )" />
            <mx:Label text="Local intranet" />
        </mx:HBox>
    </mx:HBox>

</mx:Application>