Loading local images directly into Flash Player 10

Flash/Flex developers are now able to read and write local files directly inside the Flash Player. With Flash Player 10 we have direct access to user’s hard drive to read and write files. Example below allow us to load in an image file from the hard drive and display it to the user.


Get free Flex Builder 3 Professional for education

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute" xmlns:components="components.*" viewSourceURL="srcview/index.html"> 

    <mx:Script>
        <![CDATA[
            private var fileRef:FileReference;

            private function selectFile():void
            {
                fileRef = new FileReference();
                var fileFilter:FileFilter = new FileFilter('Image', '*.jpg');
                fileRef.addEventListener(Event.SELECT, selectHandler);
                fileRef.addEventListener(Event.COMPLETE, completeHandler);
                fileRef.browse([fileFilter]);
            } 

            private function selectHandler(event:Event):void
            {
                fileRef.removeEventListener(Event.SELECT, selectHandler);
                fileRef.load();
            } 

            private function completeHandler(event:Event):void
            {
                fileRef.removeEventListener(Event.COMPLETE, completeHandler);
                img.load(fileRef.data);
            }
        ]]>
    </mx:Script> 

    <mx:Canvas
        x="0" y="40" width="710" height="295"
        borderStyle="solid" borderColor="#303030"
        backgroundColor="#404040"> 

        <mx:Image id="img"/> 

    </mx:Canvas> 

    <components:GradientBox
        y="1"
        gradientFrom="#F9F9F9"
        gradientTo="#DFDFDF"
        borderColor="#303030"
        width="710" height="40"
        verticalAlign="middle" paddingLeft="10"> 

        <mx:Button
            label="Select File"
            click="selectFile()"/> 

    </components:GradientBox> 

</mx:Application>

5 Comments


  1. Sal
    December 16, 2009 at 6:58 pm

    I tried implementing your code into the Flex Builder 3 that I have and it gives me an error on the .load() function:

    Error 1119: Access of possibly undefined property data through a reference with static type flash.net:FileReference.

    Why is this?

  2. Mariush T.
    December 16, 2009 at 8:37 pm

    Make sure you access fileRef.data after Event.COMPLETE is fired.

    Can you show me your code?

  3. Sal
    December 16, 2009 at 8:59 pm

    Yeah it’s the same as yours and I don’t get the error. I have the latest Flash Player 10 and I’m using the new 3.5 Flex SDK. What do you think? The erros are:

    Errors(2 items):
    1061: Call to a possibly undefined method load through a reference with static type flash.net:FileRefernce.
    1119: Access of possibly undefined property data through a reference with static type flash.net:FileReference.

    Here’s my source code:

  4. Mariush T.
    December 16, 2009 at 9:19 pm

    I got it. You have to change Flex Compiler to at least Flash Player 10.0.0.
    http://mariusht.com/files/blog/local_image_viewer/fp10.jpg

  5. Sal
    December 16, 2009 at 10:08 pm

    man I hate when that happens. Here I am thinking it’s something big when it was just that little change. Well, thanks man… working like a charm now.

Leave a comment