How to create "Browse for folder" dialog in Adobe FLEX?

Question

Know someone, how to create "Browse for folder" dialog in Adobe FLEX? And it is possible?

Thanx.

Answer 1

If it's an Air app you can do :

var f : File = new File;
f.addEventListener(Event.SELECT, onFolderSelected);
f.browseForDirectory("Choose a directory");

If it's a pure As3 app, you cannot Browse for folder, you can just browse for file via FileReference class.

Answer 2

in Web, for multiple file upload, (for single file upload, use FileRefernce)

private var _refAddFiles:FileReferenceList;
private function browse():void
{
    _refAddFiles = new FileReferenceList();
    var fileFilter:FileFilter=new FileFilter("*.jpg","*.jpg;*.jpeg;");
    _refAddFiles.addEventListener(Event.SELECT, onSelectFile);
    _refAddFiles.browse([fileFilter]);
}

<mx:Button click="browse"/>

This will work, and what you want to do after selection,

private function onSelectFile(event:Event):void
{
    _arrUploadFiles = [ ];
    if (_refAddFiles.fileList.length >= 1)
    {               
        for (var k:Number = 0; k < _refAddFiles.fileList.length; k++)
        {
            _arrUploadFiles.push({ name: _refAddFiles.fileList[k].name,
                                    file: _refAddFiles.fileList[k]});
        }
    }

}

Answer 3

This is a quick function set to create a nice folder browser in Flex:

private var file:File = new File();

private function pickFile(event:MouseEvent):void {
    file.addEventListener(Event.SELECT, openFile);              
    file.browseForDirectory("Select folder...");
}

private function openFile(event:Event):void{
    folderPath.text = file.nativePath;
}

The first function deals with the folder browser, the second one populates a text input with the full folder path.

Howto:

On the stage, create a simple mx:button and add a call to the pickFile() function for the click event:

<mx:Button click="{pickFile(event);}" />

Then, put also on the stage an mx:TextInput component, to show the folder path after selection:

<mx:TextInput id="folderPath" editable="false" />

This way you have a button to click in order to show the system folder browser, and a text input to show the full folder path after selection.

To improve the button look, you can embed a nice folder icon :-)

Just my 2c. :-)