Android Question ImageDownloader2 to load an image blob field from a remote MySQL database

[Tasyo28]

Hi All,

Still new in B4a, How can I adapt the code in ImageDownloader2 to load an image blob field and Label Text from a remote MySQL database?.

Because i want to load all list even image is still loading to eliminate waiting time to load the xCustomListview.

I am successfully downloading and displaying the image (BLOB) in an ImageView and Text to Label with this code in my JobDone sub:

If Job.Success Then
        Dim res As String
        res = Job.GetString
        Log("Response from server: " & res)
        Dim parser As JSONParser
        parser.Initialize(res)
       
       
        Select Job.JobName
            Case Item_details
                  Dim ItemList as List
                  Dim Image_blob as String
                  Dim Label1_text as String
                  Dim Image_bitmap as Bitmap
                  Dim m as Map
                
                  ItemList = parser.NextArray

                  For i = 1 to ItemList -1' get all db records

                       m = ItemList.Get(i)
                       Image_blob = m.Get("ProductImage") ' stored the blob text
                       Label1_text = m.Get("ProductName")'stored the text field
                  
                       'Convert blob Base64 to bitmap
                       Dim buffer() As Byte
                       Dim b As Bitmap
                       Dim su As StringUtils
                       buffer = su.DecodeBase64(t1)
                       Dim In As InputStream
                       In.InitializeFromBytesArray(buffer, 0, buffer.Length)
                       b.Initialize2(In)
                      
                       Image_bitmap = b 'bitmap image
                      
                      
                       Dim p As B4XView = xui.CreatePanel("")
                       p.SetLayoutAnimated(0, 0, 0, 250dip, 250dip)
                       CLV1.Add(p, Image_bitmap, Label1_text )' add image and label text to CLV

                  Next

                
        End Select


Else
        Log(Job.ErrorMessage)
        ToastMessageShow("Error: " & Job.ErrorMessage, True)
    End If
    Job.Release
End If

I need to incorporate the above code into the following original code of the ImageDownloader2 JobDone sub:
(Link: https://www.b4x.com/android/forum/threads/imagedownloader-the-simple-way-to-download-images.30875/)

If Job.Success = True Then
        If Job.JobName = "PageJob" Then
            Dim m As Matcher = Regex.Matcher("class=\""darkbox\""><img src=\""([^""]+)""", Job.GetString)
            Do While m.Find
                links.Add(m.Group(1))
            Loop
            BuildItems
        End If
    Else
        Log(Job.ErrorMessage)
    End If

Hope anybody can help how to achieve this or sample code.

 

[Erel]

Don't use ImageDownloader at all.

Learn how to use Wait For: https://www.b4x.com/android/forum/threads/79345/#content
It is very simple.

 

[Tasyo28]

Don't use ImageDownloader at all.

Learn how to use Wait For: https://www.b4x.com/android/forum/threads/79345/#content
It is very simple.

Hi Erel,

Thank you very much for reply, I know now how to use the Wait For:.

I manage to store the blob string to map via getkeyAt and GetValueAt but i dont know how to load them in existing CLV imageview via background.

Can you please advise.

Regards,
Tasyo

 

[Erel]

It will always happen in the background.

How many images are you downloading? If not too much then the simple solution is to call a sub that downloads an image and then sets the image to an ImageView.

 

[Tasyo28]

Hi

It will always happen in the background.

How many images are you downloading? If not too much then the simple solution is to call a sub that downloads an image and then sets the image to an ImageView.

Hi Erel,

Actually not to much only 10 images, this is the json im downloading (http://dqtest.tasyoshop.com/Blank_script_php/)

Because my problem when i will combine the text list and images to be display in single sub, CLV will not show immediately because converting blob to bitmap (using DecodeBase64) takes time.

How can i achieve this "downloads an image and then sets the image to an ImageView"?

Regards,
Tasyo

 

[Erel]

1. Create a sub that receives a URL and ImageView as parameters. This sub will download the image and set it to the ImageView.

2. Add all the items to the list and call this sub for each ImageView (without using Wait For as you don't want to wait for each request to complete).

 

[DonManfred]

May i suggest to consider changing your Server / Database structure.

Put the files on your server in a specific path using a name for each picture. Store the name of this Image in your database. Not the base64 of that image.

When requesting the data the Request to the php script will be much faster as the images are not in based64 format in the result. As of now the job must download 1mb of data, then convert the base64 to an image, store the file and so on. You then can easy use httpjobs to download them if not already downloaded.

 

[udg]

Another improvement (due to the small number of images) could be to store them locally once first downloaded. This is useful if the same image will be requested at a later time. One example could be images for a food menu proposal (if the menu doesn't change each day and the total number of images won't be huge at any time since this will consume too much space on the user's device).
Manfred advice will apply to local storage too.

 

[DonManfred]

could be to store them locally once first downloaded

You then can easy use httpjobs to download them if not already downloaded.

;-)

 

[Tasyo28]

Thank you for all your inputs i will try my best to absorb it, but i need blob image because requirement is to have local database syncronized to cloud database. Even without internet it will work.

 

[Tasyo28]

Another improvement (due to the small number of images) could be to store them locally once first downloaded. This is useful if the same image will be requested at a later time. One example could be images for a food menu proposal (if the menu doesn't change each day and the total number of images won't be huge at any time since this will consume too much space on the user's device).
Manfred advice will apply to local storage too.

Hi udg,

do you have any sample how to do that in blob to image save to local and check if exist?

 

[udg]

Hi, sorry I've got no sample code to show.
You could design your local sqlite DB as to have at least a couple of tables: one for description details and one as a repository of "images" related to records in the first table. This way if the DB grows too large you could truncate just the second table and reset the id_img field in the first one.
So, basically, you check the first table on one or more of its parameters to verify if a record exists for the needed item. If not, you download it from the server and save it locally. This way, next time, all the info (description, data and image) will be available locally.
If the record you're looking for is in your local sqlite DB, just read it back, extract the id for the image in the second table and finally get the image.
Since you plan to use B64 encryption, you could store the "images" as a TEXT field containing your B64 representation of the image. Exactly the same string that you exchanged with the server.