Help being able to upload images to a list through CloudDB, and display them in a label?

MIT App Inventor Help
1

Hello, fellow inventors.

I've been using this software for a some time now, and currently I am developing a chat room app where you can join different rooms via tags, and will use the selected tag to upload to that CloudDB tag.

I need help adding a feature that allowed uploading of media. I'm not exactly sure if labels can display media that is stored in list but I've tried some different methods and none have works so far. If any of you can help me with this, it would be much appreciated.

I'm just fine with only allowing uploading of images, but if you can get other media working too that'd be cool.

Thanks!

reSend.aia (527.7 KB)

2

You can upload image files (and other binary files) to CloudDB in two ways:

Method 1

  1. Convert the file to a base64 string (use an extension to do this)
  2. Store the base64 String to a CloudDB tag either by itself or with other data (e.g. in a list)
  3. Retrieve the tag data as needed, and convert the base64 String back to an image for display

Method 2

  1. Get the full path to the image
    (e.g. file:///storage/emulated/0/Android/data/<packageName>/files/img1.jpg)
  2. Store this file path to a CloudDB tag (by itself, no other data)
    CloudDB will upload the binary file, and store it in base64 for you
  3. Retrieve the file with the CloudDB tag
    The file will be downloaded to the app in a directory called:
    (e.g. file:///storage/emulated/0/Android/data/<packageName>/files/AppInventorBinaries/filename)
    with a new unique filename
  4. Display the file

File size will be important, base64 encoding increases file size by up to 30%, so ensure your images are optimised for the view they will be shown in, and resize (down) accordingly

You cannot display an image in a label, you would need to create an arrangement containing an image component and a label, or something similar.

3

I just wanted to say thank you for highlighting the exact steps to do this. Really appreciated!

Can you direct me to an extension that can encode and decode Base64?

4

why not search Base64 in the community?
or you can find a extension directory in Taifun's website

5

Oh, I didn't realize that you could just search in the forum. Thank you.

6

Hello again, fellow mutuals.

In my last post, I highlighted how I was having trouble uploading images to CloudDB and displaying them, but @TIMAI2 was able to help me out.

Now, however, I need to display the image sent to the room in a label, as the label displayed elements from a list, or with some kind of method. If I can't have labels display images directly, then maybe with an extension? Maybe there could be a sidebar menu displaying all the messages with attachments on them in the room?

So, yeah, this is all I am asking today. If one of you could come up with a creative way to have images displayed in the chat area or a way to send images (I have a method I am going to use already) then that would be helpful.

Thank you in advance.

resend_copy_1.aia (671.8 KB)

Note: I re-posted this because nobody could solve my LAST problem, which was after getting the image displaying it in a label.

7

Because it is not possible to display an image in a label (in the way you intend) :slight_smile:

There are so many different options for doing what you want to do. I suggest you search the community, and the FAQ, for chat applications that may use images, and see how others have done it, or to look at list view solutions that include images, or dynamic components that can construct list views with images. You will no doubt have to change your app "chat display" to accommodate your requirements.

8

Seems plausible. Thank you.