A FileSystemDataGrid displays file information in a data-grid format. The file information displayed includes the file name, creation date, modification date, type, and size. Data grid columns displaying this information are automatically created in the underlying DataGrid control, and can be removed or customized in the same way that you customize DataGrid columns. The displayed contents can include subdirectories and files, with additional filtering options as well. A FileSystemList control can be linked to a FileSystemHistoryButton control, meaning that the button can be used to move to a previously displayed directory.

For more information on the FileSystemDataGrid control, see the Flex 3 Language Reference.

Contents

• Creating a FileSystemDataGrid control
• FileSystemDataGrid user interaction

Creating a FileSystemDataGrid control

You use the <mx:FileSystemDataGrid> tag to define a FileSystemDataGrid control in MXML, as the following example shows. Specify an id value if you intend to refer to a component elsewhere in your MXML, either in another tag or in an ActionScript block.

You specify the currently displayed directory using the control's directory property. You can set the directory property in MXML by binding the value to a property or variable, or by setting the property in ActionScript. When you set the directory property the data provider of the underlying data grid control is automatically populated. The specified directory isn't displayed in the grid--its child files or directories are shown as the rows in the grid. By default the directory property is set to the root "Computer" directory. In that case its children, the drive or drives attached to the computer, are displayed as the items in the grid.

The following example demonstrates creating a FileSystemDataGrid control that displays all files and folders (the default). The sample also includes a button for navigating up one level in the directory hierarchy. The button is enabled if the currently displayed directory has a parent directory because the button's enabled property is bound to the FileSystemDataGrid control's canNavigateUp property. The button navigates up one level by calling the FileSystemDataGrid control's navigateUp() method when it is clicked.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Button label="Up" click="fileGrid.navigateUp();"
        enabled="{fileGrid.canNavigateUp}"/>
    <mx:FileSystemDataGrid id="fileGrid"/>
</mx:WindowedApplication>

FileSystemDataGrid user interaction

The FileSystemDataGrid control includes standard DataGrid functionality such as scrolling through the grid, selecting grid rows, reordering grid columns, and sorting grid data by clicking the grid headers. In addition, the FileSystemDataGrid provides some file-specific functionality. A FileSystemDataGrid allows a user to navigate to other directories using the mouse or keyboard. The user can change the directory by double-clicking a subdirectory, by pressing Enter or Ctrl-Down when a subdirectory is selected, by pressing Ctrl-Up when the control isn't displaying the COMPUTER directory, by pressing Ctrl-Left when there is a "previous" directory to navigate back to, or by pressing Ctrl-Right when there is a "next" directory to navigate forward to. If the user attempts to change the directory being displayed, the control dispatches a cancelable directoryChanging event. If the event isn't cancelled, the control displays the contents of the new directory and its directory property changes. Whenever the directory property changes for any reason, the controls dispatches a directoryChange event.