May
12
2009

 

This example shows how to use FileReference to load files from user’s local machine.
As of now, you need Flash Player 10 and one of these to compile:

- Flash CS4 (some have suggested to some workaround to get it to work on Flash CS3, but I was not able to get the workaround to work).
– Flex SDK 3.3
Flex SDK 4 aka Gumbo

This simple example displays a button,which allows user to browse the local machine when clicked. Select a swf and it will be displayed on the stage. Requires Flash Player 10 or newer to work.


	
	


The code (compiled using Flex Builder 3, configured to use Flex 4 SDK). To see a CS4 sample, go here:
http://www.permadi.com/blog/2010/06/flash-as3-using-filereference-to-load-files-example-for-flash-cs4-and-above/

[c]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:Script>
        <![CDATA[
		import mx.controls.Button;
		import flash.events.MouseEvent;
		import flash.net.FileReference;
		import flash.net.FileFilter;
		import flash.utils.ByteArray;
		import flash.events.MouseEvent;
		import flash.events.Event;
		import flash.events.IOErrorEvent;
		import flash.display.MovieClip;
		import mx.controls.ProgressBarMode;

		private var fileReference:FileReference;
		private var mLoader:Loader;

		public function onBrowseButtonClicked(event:MouseEvent):void
		{
			trace("onBrowse");
			fileReference=new FileReference();
			fileReference.addEventListener(Event.SELECT, onFileSelected);
			var swfTypeFilter:FileFilter = new FileFilter("SWF Files (*.swf)","*.swf");
			var allTypeFilter:FileFilter = new FileFilter("All Files (*.*)","*.*");
			fileReference.browse([swfTypeFilter, allTypeFilter]);
		}

		public function onFileSelected(event:Event):void
		{
			trace("onFileSelected");
			fileReference.addEventListener(Event.COMPLETE, onFileLoaded);
			fileReference.addEventListener(IOErrorEvent.IO_ERROR, onFileLoadError);
			fileReference.addEventListener(ProgressEvent.PROGRESS, progressHandler);
			fileReference.load();
		}

	        private function progressHandler(event:ProgressEvent):void
		{
			var file:FileReference = FileReference(event.target);
			var percentLoaded:Number=event.bytesLoaded/event.bytesTotal*100;
			trace("loaded: "+percentLoaded+"%");
			ProgresBar.mode=ProgressBarMode.MANUAL;
			ProgresBar.minimum=0;
			ProgresBar.maximum=100;
			ProgresBar.setProgress(percentLoaded, 100);
		}

		public function onFileLoaded(event:Event):void
		{
			var fileReference:FileReference=event.target as FileReference;
			var data:ByteArray=fileReference["data"];
			trace("File loaded");
			mLoader=new Loader();
			mLoader.loadBytes(data);
			mLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderComplete);

		}

		public function onFileLoadError(event:Event):void
		{
			trace("File load error");
		}   

		public function onLoaderComplete(event:Event):void
		{
			stage.addChild(mLoader);
		}
        ]]>
    </mx:Script>
	<mx:Button x="10" y="10" label="Browse" id="BrowseButton"
           click="onBrowseButtonClicked(event)"/>
	<mx:ProgressBar x="10" y="40" id="ProgresBar" minimum="1" maximum="100"
            indeterminate="false" enabled="true" labelPlacement="left"/>
</mx:Application>
[/c]


Some notes:

  • If you see a blue box where the swf should be, then you don’t have Flash Player 10. For simplicity, I did not implement any version checking, but a real application should fallback to the two-round method.
  • The upload must be initiated by user action (ie: button click). In the above example, it is initiated at onBrowseButtonClicked.
  • FileReference can load any kind of files. In the above example, we load a swf and pass the data as ByteArray, which then gets passed to a Loader object-instance to construct the swf.
  • You can track the the load-progress by listening to ProgressEvent.PROGRESS.
  • The example above can also load PNG and JPEG, just select All Files to list non SWF files and select a PNG or JPG.

Comments are closed.