Importing a photo from iPhone Library and save within App

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller

chrisbailey
Posts: 10
Joined: Fri Feb 07, 2014 10:57 am

Importing a photo from iPhone Library and save within App

Post by chrisbailey » Sun Mar 02, 2014 1:39 pm

Hi,

I previously created a topic titled "Uploading photo from library and storing in the iPhone app." However this caused some confusion as it was pointed out that you don't "upload" something to an app from the iPhone you "import" it.

So this is what I am trying to do and could really do with some help.

I have created a card within a stack that has 10 blank buttons, the buttons all have the following code (apart from set the left and set the top number):

Code: Select all

on mouseUp
   set the lockloc of the templateimage to true
   set the width of the templateimage to "72"
   set the height of the templateimage to "72"
   set the left of the templateimage to "32"
   set the top of the templateimage to "135"
   mobilePickPhoto "library"
   if the result is empty then
   end if
end mouseUp
This code works perfectly for importing the picture from the iPhone library and placing within the app at a size of 72x72 (which is the thumbnail size I want).

The next part is what I am struggling with....I want to be able to save the imported photo with the app so it remains there after the app has been closed. The code I have entered to the stack script is this (which has not worked):

Code: Select all

on shutdown
   --set default folder to writeable directory on mobile
   set the defaultFolder to specialFolderPath("Documents")
   --puts the name of the current card into a text file called mobiletest.txt
   put the short name of this card into URL ("file:mobiletest.txt")
   pass shutdown
end shutdown

on openStack
   --set default folder to folder with text file in it
   set the defaultFolder to specialFolderPath("Documents")
   -- places the contents of this text file into a temp variable
   put URL ("file:mobiletest.txt") into tState
   --navigates to the card names in the temp variable
   go card tState
end openStack
When I have managed to finally save the app so the imported photos remain after it has been closed. I then would like to be able to click on the 72x72 imported photo and have it enlarge to a larger size (iPhone fullscreen), and have "close" button on the larger size photo which when pressed will revert back to the card with the 72x72 photos.

I hope I have made sense with this topic.

Many thanks

Chris

Klaus
Posts: 11113
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by Klaus » Sun Mar 02, 2014 4:30 pm

Hi Chris,

well, the little confusion about your terminology had in fact been resolved in the last couple of postings.
so a new thread had not been neccessarily neccessary 8)

Code: Select all

on mouseUp
   set the lockloc of the templateimage to true
   set the width of the templateimage to "72"
   set the height of the templateimage to "72"
   set the left of the templateimage to "32"
   set the top of the templateimage to "135"

   ## To be able to address that new image I would recommend to give it a meaningful name, or at least a name at all!
   set the name of the templateimage to "user_selected_picture"
   mobilePickPhoto "library"

   ## Why do an unneccessary and not handled check? See below...
   ##if the result is empty then
  ## end if
end mouseUp
THE RESULT will be EMPTY on success (of importing the image from library) and may contain an error description if not.
So better do something like this:

Code: Select all

...
if the result <> empty then
  answer "An error occured:" && the result
 
  ## get out of here!
  exit to top
end if
...
The code I have entered to the stack script is this (which has not worked):
Sorry, don't get this!? 8)
The comments in the script do not leave any doubt about what the script does (and does not)!
Did you really read the comments? It is essential to understand what is going on here!

What you want is to EXPORT the user selected image and later (next app start) IMPORT it again.
Check the dictionary and you will find some examples on how to do so.

Hint: you will only need to change one line in the "shutdown" and "openstack" script :D


Best

Klaus

chrisbailey
Posts: 10
Joined: Fri Feb 07, 2014 10:57 am

Re: Importing a photo from iPhone Library and save within Ap

Post by chrisbailey » Sun Mar 02, 2014 8:23 pm

Hi Klaus,

Thank you for your help, as you may have gathered I am a compete novice to LiveCode and struggling to understand it all.

I can't seem to figure out what I need to do to get the app to save on exit with the imported pictures still in the app. I have looked at the dictionary and nothing seems to be relevant...however even it if it was I probably wouldn't know as I don't know what I am doing!!! :oops:

Thanks
Chris

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5087
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by jacque » Sun Mar 02, 2014 9:53 pm

Chris, stick with it. It will fall into place soon.

The first script you posted saves the current card reference to a text file when the app quits. When it starts up again, it reads that reference and goes to that card so that the user can pick up where they left off. But it doesn't do anything at all about content, which in this case would be your images. Since a standalone is always in its original state when it starts up, it is up to your scripts to save the content somewhere and re-load it when the app starts again.

There are a couple of ways to save those images once they are inside your app. One way would be to use the "export" command to save each image to a writeable location on the drive (for mobile, this is almost always the documents folder.) That would give you a bunch of loose image files inside Documents. Another way would be to create a storage stack (often called a Preferences stack, because it stores user prefs and content) and copy the images into it. Either way works, but I usually prefer to save all content in a single file for ease of access. The script creates the prefs stack on first launch and then looks for it on every startup. Then the script would move the content of all the images in the prefs stack into images in the real app. When the app quits, it reverses the process again and saves all the images back to the prefs stack.

I know this sound complicated if you've never done it before, but we can help you through it. Here's the workflow:

App launches and looks to see if a prefs stack exists in the Documents folder.
If not, it's a first-launch. Create the stack and stop there.
If it does exist, loop through all the images that are stored on the first card. Ideally you'd name them something like "userimage 1", "userimage 2", etc. The trailing number in the name can identify the order the user saved them and the order they should be displayed.
Inside the repeat loop, place each image from the storage stack into the corresponding location in the app.

When the app quits:

Look to see if the storage prefs stack exists. It should be there by now, but if not, create it.
Loop through all the user images in the app.
In each iteration in the loop, move an image to the storage stack. In the storage stack you can either:
Replace the image content of an exsiting image of the same name with new content, or
Delete the old one and copy in the new one
Save the storage stack.

To do all this, you'll want to read about these commands (which probably aren't complete, but it's a start):

create stack
create image
save stack
open stack -- you don't technically need this but it would be easier at first to actually open the prefs stack until you get it working
there is a stack -- to check for the existence of the prefs stack
copy <obj> to <location> -- if you will be copying whole images to prefs
delete <obj> -- if you will be deleting existing images from prefs

Copying images to another location is probably an easier mental image than just moving the image content itself, so start with that. Once it's working you can update the scripts to just swap out the actual content if you want. You do that by setting "the text" of an image, which sounds odd, but that's for later.

Ask when you get stuck.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am
Location: Palo Alto

Re: Importing a photo from iPhone Library and save within Ap

Post by Simon » Mon Mar 03, 2014 5:45 am

Hi Chris,
I think I've figured out a way that will be easier for you.
Here is the gist of it:
After mobilePickPhoto "library" save that image to a folder
When you start up your app go to that folder and load all the images it finds.

Make sense? If you'd like to try this method then continue reading.

First thing you need to do is save the image somewhere, make sure the "somewhere" exists

Code: Select all

  if there is not a folder (specialFolderPath("documents") & "/images") then
      create folder  (specialFolderPath("documents") & "/images")
      exit to top
   end if
   set the defaultFolder to (specialFolderPath("documents") & "/images")
Right after your mobilePickPhoto "library"

Code: Select all

export the last image to file "image1.jpg" as jpeg
That will save the image to the /images folder, we'll replace that number "1" with a variable before we are done. There is a problem in the placement of that code because you already resized the image to 72X72 and it will save a small image which will not be very good for full screen.

Code: Select all

set the vis of templateimage to false
After you save the file resize everything using "last image"

Code: Select all

 set the width of the last image to "72"
 set the height of the last image to "72"
etc.
set the vis of the last image to true

To test if the file is saved

Code: Select all

answer the files
Should give you "image1.jpg"

Just so I know I'm not wasting my breath I'll stop for now.
Write back when you have the above working.

Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5087
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by jacque » Mon Mar 03, 2014 7:18 pm

Oh good, Simon gave you the other way to do it. Now you have two choices. Actually, his way may be easier for starters now that I think about it.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

chrisbailey
Posts: 10
Joined: Fri Feb 07, 2014 10:57 am

Re: Importing a photo from iPhone Library and save within Ap

Post by chrisbailey » Mon Mar 03, 2014 8:43 pm

Hi Simon & Jacque,

Thank very much for your help.

Something is happening now but not quite what I need...I have entered the code but it isn't saving the image, however it is saving the card that I am on. For example, when I close the app and relaunch it opens on Card 2 and not Card 1.

This is how I have entered the code - should I be putting this code on the button script?

Code: Select all

on mouseUp
   set the lockloc of the templateimage to true
   set the width of the templateimage to "72"
   set the height of the templateimage to "72"
   set the left of the templateimage to "32"
   set the top of the templateimage to "135"
   set the name of the templateimage to "user_selected_picture"
   mobilePickPhoto "library"
   export the last image to file "image1.jpg" as jpeg
   
   if there is not a folder (specialFolderPath("documents") & "/images") then
      create folder  (specialFolderPath("documents") & "/images")
      exit to top
   end if
   set the defaultFolder to (specialFolderPath("documents") & "/images")
   
   set the vis of templateimage to false
   
   set the width of the last image to "72"
   set the height of the last image to "72"
   etc.
   set the vis of the last image to true
   
   answer the files
   
   if the result is empty then
      answer "An error occured:" && the result
      
      exit to top
   end if
end mouseUp


I really appreciate all your help and patience...hopefully I will get there eventually.

Thank you

Chris

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am
Location: Palo Alto

Re: Importing a photo from iPhone Library and save within Ap

Post by Simon » Tue Mar 04, 2014 6:01 am

No Chris No,
Copying and pasting exactly what I wrote will not work. :evil:
What do you think that "etc." will do for you???

You don't want to spend time on solving this? I really don't, trust me.

Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

chrisbailey
Posts: 10
Joined: Fri Feb 07, 2014 10:57 am

Re: Importing a photo from iPhone Library and save within Ap

Post by chrisbailey » Mon Mar 10, 2014 8:53 pm

Hi Simon,

I didnt mean to offend you in any way....I honestly didn't know "etc" wasn't part of the code - I am that much of a beginner.

I have tried to figure this out but I am literally banging my head against a brick wall. Im starting to think that this was a bad idea and that I will never be able to produce an app.

I do wish to thank you for all your help and I was hoping I could post on here that I had managed to solve it.

Chris

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am
Location: Palo Alto

Re: Importing a photo from iPhone Library and save within Ap

Post by Simon » Mon Mar 10, 2014 11:44 pm

Hi Chris,
I'm sorry about my outburst, just so often people want others to do the work involved in writing an app. Mostly this is a place to learn how to use liveCode, it's not all cut n' paste.
After mobilePickPhoto "library" save that image to a folder
When you start up your app go to that folder and load all the images it finds.
Does that make sense to you? Not how to do it, but just the idea. It's the easiest way I could think of to help you complete your project and learn liveCode along the way.

You will have to remove some of the code you have written and replace it with what I posted, understanding what it's doing. You will have to refer to the dictionary to learn some of the terms.

What does the answer dialog report?

Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

maxs
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 402
Joined: Sat Jun 24, 2006 12:02 am
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by maxs » Wed Jan 04, 2017 11:07 am

Thank you for your help Simon. It helps me too.
So how do I load the images when I open the stack?

Max

maxs
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 402
Joined: Sat Jun 24, 2006 12:02 am
Contact:

export wont work

Post by maxs » Thu Jan 05, 2017 7:19 pm

This command gives me an error message: bad command

export the last image to file "image1.jpg" as jpeg

This command also gives me an error message: bad command
set the defaultFolder to (specialFolderPath("documents") & "/images")‬

What is going on?

Max

Klaus
Posts: 11113
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by Klaus » Thu Jan 05, 2017 8:27 pm

Hi Max,

quit and restart LC and maybe also you computer!
That will hopefully cure this phenomenon.


Best

Klaus

maxs
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 402
Joined: Sat Jun 24, 2006 12:02 am
Contact:

Re: Importing a photo

Post by maxs » Fri Jan 06, 2017 2:09 am

Thanks, Klaus It turns out to be a corrupted button.

For the last step of this process, I used the Import paint command to bring the saved picture in,

Here it is:
import paint from file "carpet.png"
set the vis of the last image to false
set the textdata of img "ClassCarpet" of grp "Carpet seats" to the textdata of the last img

This is an important step if it helps anyone.

Max

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5087
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: Importing a photo from iPhone Library and save within Ap

Post by jacque » Fri Jan 06, 2017 5:40 pm

I think that last line should be "imageData". You can set the text of an image or the imageData, they both do the same thing. I'm assuming the above was a typo.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Post Reply

Return to “Getting Started with LiveCode - Complete Beginners”