Beginning Adobe® AIR™: Building Applications for the Adobe Integrated Runtime

14.4. FileSystemTree

FileSystemTree is again very similar to FileSystemDataGrid and FileSystemList except that it will show the directory structure in a tree layout. Add a FileSystemTree to the Chapter14_Comps.mxml file by including <mx:FileSystemTree id="fst" x="204" y="299" height="214"/>. The results will look like Figure 14-7.

The FileSystemTree has many of the same properties as the FileSystemDataGrid and FileSystemList including enumeration, showHidden, and so on. For this example, we will show how to read the data associated with the folder or file that is selected. Update the FileSystemList to include a change handler by adding change="showFileDetails()". Next add a TextArea component by including <mx:TextArea id="log" x="384" y="298" width="240" height="109"/> in the Chapter14_Comps.mxml file. Finally, add the showFileDetails() method and import statement for the File class to the script block as defined in Listing 14-6. If we look into the showFileDetails() method, you will see that the tree node is cast as a File object, at which point all of the File object's properties are available. The name, size, and nativePath are added to the text property of the TextArea component. The results of these additions are shown in Figure 14-8.

Example 14-6. The import statement and showFileDetails method

import flash.filesystem.File; public function showFileDetails():void { var file:File = fst.selectedItem as File; log.text += "name: " + file.name + " size: " + file.size + "\n";