Downloading files in Flex using the FileReference class

OK, enough embedding examples, lets take a look at downloading files using Flash Player’s FileReference class (flash.net.FileReference). This example demonstrates a basic usage of the FileReference class within Flex, allowing users to download a file from the server. This example also shows how you can use data tips in the DataGrid control by setting the data grid column’s showDataTips property to true and specifying a value for the dataTipField column.

Full code after the jump.

 

The following example downloads a ZIP file when the user presses the Button control. You can mouse over the items in the DataGrid control’s “Type” column to see additional event information

<? xml version="1.0" encoding="utf-8" ?>
<!--  http://blog.flexexamples.com/2007/07/28/downloading-files-in-flex-using-the-filereference-class/  -->
< mx:Application  xmlns:mx ="http://www.adobe.com/2006/mxml"
        layout ="vertical"
        verticalAlign ="middle"
        backgroundColor ="white"
        creationComplete ="init();" >    

     < mx:Script >
         <![CDATA[
            import mx.controls.Alert;
            import mx.collections.ArrayCollection;
            import flash.net.FileReference;   

            [Bindable]
            [Embed('assets/disk.png')]
            private var diskIcon:Class;   

            [Bindable]
            private var arrColl:ArrayCollection;   

            /* URL of the file to download. */
            private const FILE_URL:String = "http://blog.flexexamples.com/wp-content/uploads/FileReference_download_test/bin/srcview/FileReference_download_test.zip";   

            private var fileRef:FileReference;
            private var urlReq:URLRequest;   

            private function init():void {
                /* Initialize the array collection to an empty collection. */
                arrColl = new ArrayCollection();   

                /* Set up the URL request to download the file specified by the FILE_URL variable. */
                urlReq = new URLRequest(FILE_URL);   

                /* Define file reference object and add a bunch of event listeners. */
                fileRef = new FileReference();
                fileRef.addEventListener(Event.CANCEL, doEvent);
                fileRef.addEventListener(Event.COMPLETE, doEvent);
                fileRef.addEventListener(Event.OPEN, doEvent);
                fileRef.addEventListener(Event.SELECT, doEvent);
                fileRef.addEventListener(HTTPStatusEvent.HTTP_STATUS, doEvent);
                fileRef.addEventListener(IOErrorEvent.IO_ERROR, doEvent);
                fileRef.addEventListener(ProgressEvent.PROGRESS, doEvent);
                fileRef.addEventListener(SecurityErrorEvent.SECURITY_ERROR, doEvent);
            }   

            private function doEvent(evt:Event):void {
                /* Create shortcut to the FileReference object. */
                var fr:FileReference = evt.currentTarget as FileReference;   

                /* Add event order and type to the DataGrid control. */
                arrColl.addItem({data:arrColl.length+1, type:evt.type, eventString:evt.toString()});   

                try {
                    /* Update the Model. */
                    fileRefModel.creationDate = fr.creationDate;
                    fileRefModel.creator = fr.creator;
                    fileRefModel.modificationDate = fr.modificationDate;
                    fileRefModel.name = fr.name;
                    fileRefModel.size = fr.size;
                    fileRefModel.type = fr.type;
                    /* Display the Text control. */
                    txt.visible = true;
                } catch (err:*) {
                    /* uh oh, an error of sorts. */
                }
            }   

            private function downloadSourceCodeZip():void {
                /* Clear existing array collection. */
                arrColl = new ArrayCollection();
                /* Hide the Text control. */
                txt.visible = false;
                /* Begin download. */
                fileRef.download(urlReq);
            }   

            private function showAlert(item:Object):void {
                Alert.show(item.eventString, item.type);
            }
         ]]>
     </ mx:Script >    

     < mx:Model  id ="fileRefModel" >
         < file >
             < creationDate > {""} </ creationDate >
             < creator > {""} </ creator >
             < modificationDate > {""} </ modificationDate >
             < name > {""} </ name >
             < size > {""} </ size >
             < type > {""} </ type >
         </ file >
     </ mx:Model >    

     < mx:Button  id ="downloadBtn"  label ="Download example source code"  icon ="{diskIcon}"  click ="downloadSourceCodeZip()"  toolTip ="{FILE_URL}"  height ="40"   />    

     < mx:DataGrid  id ="debug"  dataProvider ="{arrColl}"  width ="{downloadBtn.width}"  rowCount ="5"  rowHeight ="22"  itemClick ="showAlert(event.currentTarget.selectedItem)" >
         < mx:columns >
             < mx:DataGridColumn  dataField ="data"  headerText ="#"  width ="20"   />
             < mx:DataGridColumn  dataField ="type"  headerText ="Type"  showDataTips ="true"  dataTipField ="eventString"   />
         </ mx:columns >
     </ mx:DataGrid >    

     < mx:Text  id ="txt"  condenseWhite ="true"  visible ="false" >
         < mx:text >
        creationDate: {fileRefModel.creationDate}
        creator: {fileRefModel.creator}
        modificationDate: {fileRefModel.modificationDate}
        name: {fileRefModel.name}
        size: {fileRefModel.size}
        type: {fileRefModel.type}
         </ mx:text >
     </ mx:Text >    

</ mx:Application >