Highlighted

Save / Load Image on device storage (iOS & Android)

Engaged ,
Apr 20, 2015

Copy link to clipboard

Copied

Has anyone used application storage on iOS / Android ?

I need to be able to take a photo with the device and save that photo to the application rather than the device camera roll. When my app is opened I need to read these images and load them.

Any help with how to tackle this would be highly appreciated.

Cheers!

TOPICS
Development

Views

3.4K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Save / Load Image on device storage (iOS & Android)

Engaged ,
Apr 20, 2015

Copy link to clipboard

Copied

Has anyone used application storage on iOS / Android ?

I need to be able to take a photo with the device and save that photo to the application rather than the device camera roll. When my app is opened I need to read these images and load them.

Any help with how to tackle this would be highly appreciated.

Cheers!

TOPICS
Development

Views

3.4K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Apr 20, 2015 0
Explorer ,
Apr 21, 2015

Copy link to clipboard

Copied

That's an easy one, you just need to use applicationStorageDirectory. Use this code:

//This is the folder you'll be saving the images on

var appStorage:File = File.applicationStorageDirectory.resolvePath("images/");

//This is the image file. We'll be saving it on png format

var imgFile:File = appStorage.resolvePath("yourImage.png")

//This is the FileStream object you'll be using to write the image data to the folder

var fileStream:FileStream = new FileStream;

//To save the image as png format you'll have to encode the image data first

//this is the mx.graphics.codec.PNGEncoder library

var pngEnc:PNGEncoder = new PNGEncoder;

//You can get a ByteArray by passing your image's BitmapData to the encode function

var byteArray:ByteArray = pngEnc.encode(bitmapData);

fileStream.open(imgFile, FileMode.WRITE);

fileStream.writeBytes(byteArray);

fileStream.close();

I think I got everything right. Try it and see the result. To load the image, just use the Loader class, you can find tons of tutorials about that. But if you need help with that too, just say it.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 21, 2015 1
Engaged ,
Apr 22, 2015

Copy link to clipboard

Copied

So I'm able to get the camera to take the photo or choose from library and get the image added to the stage.  Once I get the image added to the stage.. how do I save that image?     and then when my app is opened .. how do I check if that image exists and then load it up?

Ideally ..  I would like to check if  1.png exists .. if it does.. add it to the stage in a predefined space. Hopefully that makes some sense

function addToStage():void {

 

   trace("Image was added to Stage");

  imgLoader = new Loader();

  imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, drawBitmap);

  imgLoader.addEventListener(IOErrorEvent.IO_ERROR, errorHandlerIOErrorEventHandler);

  imgLoader.loadFilePromise(imagePromise);

}

function drawBitmap(e:Event):void{

 

  if (image != null && contains(image)){

mcHolder.mcImg.removeChild(image);

}

 

myBitmapData = new BitmapData(600,600);

   image = new Bitmap(myBitmapData);

   image.bitmapData = Bitmap(e.currentTarget.content).bitmapData;

   trace("Original Image Width = " + image.width + " Height = " + image.height);

   trace("Bitmap was drawn");

  mcHolder.mcImg.addChild(image);

  createGestouch();

  

  

  }

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 22, 2015 0
Explorer ,
Apr 22, 2015

Copy link to clipboard

Copied

To save the image, use that code I gave you, but in this line you replace "bitmapData" with "image.bitmapData"

var byteArray:ByteArray = pngEnc.encode(bitmapData);

To check if the image exists use:

var imgFile:File = File.applicationStorageDirectory.resolvePath("1.png");

//It's that simple 😄

if(imgFile.exists)

{

    // load image from file

}

else

{

    //load from cameraRoll and than save

}


Hope this helps

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 22, 2015 0
Engaged ,
Apr 22, 2015

Copy link to clipboard

Copied

I will give this a try tonight .. Thanks for your help!  Very much appreciated!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 22, 2015 0
Explorer ,
Apr 23, 2015

Copy link to clipboard

Copied

Oh, and almost forgot, to load the image from file you can also use the Loader class. Like this:


var imgLoader:Loader = new Loader();

imgLoader.load(new URLRequest(File.applicationStorageDirectory.resolvePath("1.png").nativePath));

someMc.addChild(imgLoader);

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 23, 2015 1
Contributor ,
Oct 08, 2015

Copy link to clipboard

Copied

I needed to change the path to imageFile.url, not nativePath, as such:

imgLoader.load(new URLRequest(File.applicationStorageDirectory.resolvePath("1.png").url));

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 08, 2015 0
sabird LATEST
Community Beginner ,
Aug 25, 2017

Copy link to clipboard

Copied

I'm developing an iPad app that tries to load live images from a url. If it succeeds, it also caches those images in the ApplicationStorageDirectory. If it can't find the images at the URL (presumably because the user is offline), it tries to load any previously cached images from the ApplicationStorageDirectory. If the images haven't been previously cached, if finally looks in the ApplicationDirectory for images I'm including inside the .ipa as included files.

It successfully loads the images when online. It seems to successfully load fallback images from the ApplicationDirectory. But it does not seem to load cached images from the ApplicationStorageDirectory. I've been spinning my wheels, and this discussion seems to have the answers, but I must be doing something wrong. Any help would be greatly appreciated. Thanks!

public var loader:ProLoader;

private var imageID:String;

private var appStorage:File;

private var appDir:File;

private var loadErrorRepeat:int;

private var bytes:ByteArray;

public function Modal() {

     // ...

     loader = new ProLoader();

     loader.x = 575;

     loader.y = 143;

     addChild(loader);

     loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaderCompleteHandler);

     loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, imageLoaderErrorHandler);

     appStorage = File.applicationStorageDirectory.resolvePath("images/floorplans/");

     appDir = File.applicationDirectory.resolvePath("images/floorplans/");

     bytes = new ByteArray();

     // ...

}

private function imageLoaderCompleteHandler( e:Event ):void

{

     trace("imageLoaderCompleteHandler()");

     //This is the image file. We'll be saving it on png format

     var imgFile:File = appStorage.resolvePath(imageID);

     //trace(imgFile.nativePath +" already exists? "+imgFile.exists);

     //trace(imgFile.url +" already exists? "+imgFile.exists);

     //This is the FileStream object you'll be using to write the image data to the folder

     var fileStream:FileStream = new FileStream();

     //var byteArray:ByteArray = PNGEncoder.encode( Bitmap(ProLoaderInfo( e.currentTarget ).content).bitmapData )

     var byteArray:ByteArray = ProLoaderInfo( e.currentTarget ).bytes;

     fileStream.open(imgFile, FileMode.WRITE);

     fileStream.writeBytes(byteArray);

     fileStream.close();

     trace("cached image as "+imgFile.url);

}

private function imageLoaderErrorHandler( e:IOErrorEvent ):void

{

     trace("dataLoaderErrorHandler()");

     if(++loadErrorRepeat > 1) // make sure I don't get caught in an infinite error loop

     {

          loadErrorRepeat = 0;

          return;

     }

     if(appStorage.resolvePath(imageID).exists) // if I've already cached the online image

     {

          loader.load( new URLRequest(appStorage.resolvePath(imageID).url));

          trace("retrieved image from "+appStorage.resolvePath(imageID).url);

          /*var stream:FileStream = new FileStream( );

          stream.addEventListener(Event.COMPLETE, streamCompleteHandler);

          stream.open(appStorage.resolvePath(imageID), FileMode.READ);

          stream.readBytes(bytes);*/

     }

     else // if I haven't cached the online image, use the one bundled with the app

     {

          loader.load(new URLRequest("images/floorplans/" + imageID));

          trace("retrieved image from images/floorplans/" + imageID);

          //loader.load(new URLRequest(appDir.resolvePath(imageID).url));

          //trace("retrieved image from "+appDir.resolvePath(imageID).url);

     }

}

/*private function streamCompleteHandler( e:Event ):void

{

loader.loadBytes(bytes);

trace("retrieved image from "+appStorage.resolvePath(imageID).url);

(e.currentTarget as FileStream).close( );

}*/

private function loadImage( param:String ):void

{

     trace("loadImage( " + param + " )");

     loader.unload();

     imageID = param.substr( param.lastIndexOf("/") + 1, param.length);

     loader.load( new URLRequest(param));

     trace("imageID: "+imageID);

     trace(appStorage.resolvePath(imageID).url + " already exists? " +  appStorage.resolvePath(imageID).exists);

     trace(appDir.resolvePath(imageID).url + " already exists? " +  appDir.resolvePath(imageID).exists);

}

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 25, 2017 0