I'm building a feature of an app that we serve as a kind of travel journal/diary. I want the user to be able to enter a location title then also provide some written details about the location, record the latitude and longitude (manually or via sensor [to be added later]), and finally, and most importantly, be able to either take a picture or select a photo for each location from the device’s Photo Gallery.
I then want the text and photo data to save to a tiny DB since web connectivity may be limited when the app is being used. I can successfully save and recall all of the text data by choosing a location name from the list picker to recall the data back ons creen. However, I cannot get the pictures to stay with the correct text information that was entered and saved in the database. The only photo will be retained and reloaded is the last one that taken or selected for use.
I know that I cannot save image data directly to TinyDB, but I am restricted to working on iOS where I cannot use the Base64 extensions to convert the image to a textstring. I believe TinyWebDB and CloudDB have the same restrictions that would require the images to be converted to textstrings to be saved and recalled. What are my options to make this program work as I have described here? Attached are my relevant code blocks and thank you for any suggestions you might have.
Organise your images to always be in the same folder, then simply store the file paths
You can save binary files to cloudDB, you need to use a full path to the file and a separate tag just for the file. ( Be aware that you cannot rely on the MIT provided redis storage to always be there, and heavy users may be locked out)
@TIMAI2 Thanks for the reply. I think this suggestion might work even though it is not on device but I need a little more guidance in what you are proposing. I am debating setting up my own Redis server for future apps but would prefer to use MIT-provided one for the time being to understand the implementation here. Can you provide some sample code for me to see what mean that I could adapt for use in my program? That would be extremely helpful. Thank you and I am eager for any further assistance you can provide.
If all the images are local to the device, and the app will only use local images/data, then there really is no need to store any binary data off device.
You are correct that all data would be stored on the device so file paths could be used. Some would be in found in the photo gallery or they would have been captured and saved to local app storage.
Can you provide further advice on how to code this based on those factors? I have no problem using file paths to accomplish the functionality I’m looking for but I’m limited to the use of native App Inventor blocks only without the aid of extensions since this needs to function on iOS. Thank you for your ongoing help.
I finally had time to follow up here. I have made some progress on a prototype of what I am trying to create. It is still not behaving as I am hoping. I want each upload or taken image to stay with the written details, date, and star rating that are entered by the user. Below is a screenshot of the latest version of my code blocks as well as .aia file if that makes it easier. Please advise further if you can. I'm almost there and thank you for any further help you can provide.
Thank you for the advice. I tried to use FilePicker and ActivityStarter as you suggested but I could not get either one to work on iOS as I am required to do here.
The ImagePicker works well to select images (not too worried about the 10 item limitation for now) but they simply won't stay connected (or rather their file paths) won't stay connected upon their entry into the TinyDB. That's the real issue I have.
Adding photos and then saving them works fine when I take them with the camera but it won't work the same way when the images that I choose with ImagePicker are selected from the device's photo gallery. The app in its current iteration will retain the last image that was selected from the photo gallery and won't allow a new one to be added and then saved for future entries.
This is the last feature I need to get working for this project and I will be all set. Thank you for your ongoing help and any other suggestions you have to try.
As you suggested, I created a label that displays the exact saved filepath upon each upload. Here are screenshots showing the filepath when two separate entries are made and attempted to be saved.
Do you know how and where I can increment the "asset.JPG" with a number each time in my code to provide the functionality I want? I think that will solve the issue. Thank you again for your help.
Hmm, this is a good point that there isn't a good way yet to do this on iOS. On Android we recently add a bunch of functions to the File component, including the ability to copy files to other locations. I should invest some time in bringing that new functionality to iOS, which would solve your issue.
As a workaround, you might be able to set the image as the background image of a Canvas and then use the Save As function of the Canvas to write it to a new filename.
Thank you @TIMAI2 for all of your assistance as I worked through this project over the last few days. Your guidance and suggestions were very helpful and I am grateful for your expertise and willingness to help.
Also, thank you to @ewpatton for your review of this thread and suggestions on the workaround using the Canvas save method. That did the trick for now on saving and recalling the uploaded images. Hopefully, you and the team can more functions for both the File component and perhaps the ImagePicker component for iOS, including the ability to copy files to other locations. I know this is tricky with the restrictions in iOS but it would be very hefpul when creating apps on the platform. Let me know if you want help testing these features in the future and I would be happy to do so.
Finally, for those who have been following along, or might be referring to this thread later and looking to replicate this in a similar project. Here are the final code blocks as well as an .aia of the current iteration of my project.
