Robots w/Lasers

March 28, 2007

Native file browse dialog in Apollo

I haven’t seen any examples on how to use the native OS browse dialogs for opening & saving files, so here’s a quick example.

Basically, the idea is to use the File (which extends FileReference) class, and pretend to upload or download files from the net, but not actually perform the action, and just grab the file’s path directly.

This app allows you to load a PNG or JPEG, apply a blur effect, then save it as a JPEG again. It requires the JPGEncoder from the AS3 corelib

Download BrowseExample.mxml (only works with Apollo, not in a browser etc)

Install BrowseExample.air


<?xml version="1.0" encoding="utf-8"?>
<mx:ApolloApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
	title="Browse Example"
	backgroundColor="0x222222">
	
	<mx:Script>
		<![CDATA[
			import mx.events.IndexChangedEvent;
			import mx.events.DragEvent;
			import mx.containers.Canvas;
			import mx.effects.effectClasses.BlurInstance;
			import flash.filesystem.*;
			import com.adobe.images.*;

			// File object for saving / loading
			private var file:File;
			
			
			// callback when slider is changed
			public function blurImg():void {
				// get the value from the slider
				var blurVal:Number = slider.value;
				
				// use the slider value to construct a blurring filter
				var filter:BlurFilter = new BlurFilter(blurVal, blurVal, 3);
				
				// apply the blur filter to the image
				img.filters = [filter];
			}
			
			public function saveImg():void {
				// start at desktop directory
				file = File.desktopDirectory; 
				
				// listen for when the user has selected a location to save
				file.addEventListener(Event.SELECT, onFileSave);
				
				// request a download a bogus file, to get the Browse dialog to pop up
				file.download(new URLRequest("http://foo/foo"), "blurred.jpg");
			}
				
			public function onFileSave(e:Event):void {
				
				// cancel the file download, since it was bogus anyway
				// now, 'file' now points at where they want to save
				file.cancel();

				// grab the pixel data from the image
				var bmpData:BitmapData = new BitmapData(img.width, img.height);
				bmpData.draw(img);
				
				// encode the pixel data into a JPEG
				var jpgEncoder:JPGEncoder = new JPGEncoder();
				var jpgBytes:ByteArray = jpgEncoder.encode(bmpData);

				// open a filestream from the file
				var stream:FileStream = new FileStream();
				stream.open(file, FileMode.WRITE);
				
				// write the jpeg data to the file
				stream.writeBytes(jpgBytes, 0, jpgBytes.length);
				
				// close the stream. the file is now saved.
				stream.close();				
				
			}
			
			public function loadImg():void {
				
				// start at the desktop directory
				file = File.desktopDirectory; 
				
				// listen for select event
				file.addEventListener(Event.SELECT, onFileLoad); 
				
				// open browse dialog to pick an image file
				file.browse([new FileFilter("Images", "*.jpg;*.png")]);
			}

			// handler for when user selects a file			
			private function onFileLoad(e:Event):void {
				
				// 'file' now contains a url pointing at the file they selected.
				// in a flash movie, you would not have access to the full path,
				// but in apollo you do.
				trace(file.url);
				
				// load the image that they picked.
				// In Apollo, you can load from file://... URLs
				img.load(file.url);
			}
			

		]]>
	</mx:Script>
	<mx:VBox left="5" top="5" bottom="5" right="5" horizontalAlign="center">
		<mx:HBox width="100%"  horizontalAlign="center">
			<mx:Button label="Load..." click="loadImg()"  />
			<mx:Button label="Save as JPG..." click="saveImg()"  />			
		</mx:HBox>
		<mx:HSlider id="slider" change="blurImg()"  minimum="1" maximum="25" snapInterval="0.2" width="90%"/>
		<mx:Image id="img" />
	</mx:VBox>
	

</mx:ApolloApplication>

Filed under: Apollo,Flash — davr @ 8:26 pm

6 Comments »

  1. [...] Found this post by Robots w/Lasers that has more about this Posted in AS3, Apollo [...]

    Pingback by RichApps » Blog Archive » Save file dialog with apollo hack — March 28, 2007 @ 11:24 pm

  2. I used same way to for save flvfile in this application.(http://www.yino.sakura.ne.jp/YoutubePlayer.air)
    (this application watch youtube video, save it’s, and play flv file)

    But this way has a bug in Mac.

    When called file.download method,
    Apollo application was failed in Mac .

    so, I am looking for more better way to file open method.

    Do you know more better solution??

    My English is clumsy, so I’m sorry.

    thanks for read my Msg.

    Comment by yino — April 5, 2007 @ 6:21 am

  3. Apollo版 FLV & YouTube Playerのバージョンアップ (version 0.25)…

    毎日こまめにversionアップしようと思う、 Apollo版 FLV & YouTubePlayerですが 単純な機能ですが、新しい機能追加を行いました。 今回の機能追加は、 チャンネルのパネルの開閉機能 です。…

    Trackback by yinoのApolloアプリ開発日記 — April 5, 2007 @ 6:47 am

  4. There is a FileOpenPanel component which can be used to open file.I have used it in my mp3 player app.
    link to source files:http://www.ashwineedash.com/download/ApolloJukeBox_sources.zip
    I think this can help you.

    Comment by ashwineedash — April 10, 2007 @ 8:58 pm

  5. [...] 6. http://blog.davr.org/2007/03/28/native-file-browse-dialog-in-apollo/ [...]

    Pingback by Saving photos from Flickr to desktop in Flickrin 2 « FlexNotes — April 22, 2007 @ 1:56 am

  6. [...] be released tomorrow.  While Flash Player doesn’t allow it, there’s currently an Adobe AIR trick in use which lets you simulate a “Save File” dialog by faking a download().  [...]

    Pingback by fluxcapacity » Blog Archive » Silverlight’s niche, and its missing piece — September 30, 2007 @ 9:36 pm

RSS feed for comments on this post. TrackBack URI

Leave a comment

Powered by WordPress

Bad Behavior has blocked 2578 access attempts in the last 7 days.




Paid Advertisements
Renegade Motorhome - Costa Rica - Guitar Lessons - British Virgin Islands