Display string as image

You must Login before you can answer or comment on any questions.

I queried an sqlite DB for an image type. I converted that BOLB to a string as I am passing back a JSON object from a web service. I verified that the string matches the contents of the sql image type field in the database.

My problem now is that I have no idea how to create an ImageView with this string. Specifically how do I set the createImageView image property?

I tried to use createBlob and tried to write the string to a file and then call read() on that file when setting the image property of createImageView. The read on the file should return the contents of the file as a blob according to the reference but that didn't seem to work. I did find someone said the reference is wrong and to call file.blob() instead of file.read() but that threw an exception like someone else noted.

Now what can I try??? Please pipe in with anything.

— asked 2 years ago by Wendy
1 Comment

  • I think I tried something similar to what you are doing, but I don't quite understand your response.

    I have a string back from my web service call and I think I just need to get that into a byte array or BLOB or something that titanium can understand when i try and create the image view.

    [code] var imageAsString = jsondata[0].picture; // String back from WS var file = Titanium.FileSystem.createTempFile(Titanium.Filesystem.resourcesDirectory); file.write(imageAsString);

    var image = Titanium.UI.createImageView({ image: file.read(), //get contents of file as BLOB height: 60, width: 80, left: 10, top: 30 });

    detailView.add(image); [/code]

    I don't get an errors but my image does not get displayed.

    I have also tried file.nativePath() to get the url of the temp file that I created instead of file.read() the just produced an exception.

    Am I even close or is there an easier way? Thanks!!!

    — commented 2 years ago by Wendy

4 Answers

Accepted Answer

Not exactly the same.. but this is how I populate a coverFlow with remote images.. 

var xCon = [];
        var file = [];
        xCon[idx] = Titanium.Network.createHTTPClient();
        xCon[idx].onload = function()
        {
        file[idx] = Titanium.Filesystem.createTempFile(Titanium.Filesystem.resourcesDirectory);
        file[idx].write( this.responseData );
        trace("We are setting index: " + idx);
        coverflowImages.push(file[idx].nativePath);
        imgCoverFlow.images = coverflowImages;
        }
        xCon[idx].onerror = function()
        {
 
        }
I pull in the blob, then write it to a temporary file.. then push it into an array to be used for the coverflow... You could take your query output.. write them to a temp file.. then add them to the image of the imageView..

So I got it to work once I converted the db image type to a base 64 string like this in the web method: e[i].AssetsPicture = Convert.ToBase64String((Byte[])row["AssetsPicture"]);

Then converted in titanium to get blob and used that to set the image: var assetImage = Titanium.UI.createImageView({ image: Titanium.Utils.base64decode(jsondata[0].AssetsPicture), height: 60, width: 80, left: 10, top: 30 }); detailView.add(assetImage);

So I got it to work once I converted the db image type to a base 64 string like this in the web method: e[i].AssetsPicture = Convert.ToBase64String((Byte[])row["AssetsPicture"]);

Then converted in titanium to get blob and used that to set the image:

var assetImage = Titanium.UI.createImageView({
    image: Titanium.Utils.base64decode(jsondata[0].AssetsPicture),
    height: 60,
        width: 80,
        left: 10,
        top: 30
});
detailView.add(assetImage);

I think I tried something similar to what you are doing, but I don't quite understand your response.

I have a string back from my web service call and I think I just need to get that into a byte array or BLOB or something that titanium can understand when i try and create the image view.

[code] var imageAsString = jsondata[0].picture; // String back from WS

var file = Titanium.FileSystem.createTempFile(Titanium.Filesystem.resourcesDirectory);

file.write(imageAsString);

var image = Titanium.UI.createImageView({ image: file.read(),
height: 60, width: 80, left: 10, top: 30 });

detailView.add(image); [/code]

I don't get an errors but my image does not get displayed.

I have also tried file.nativePath() to get the url of the temp file that I created instead of file.read() the just produced an exception.

Am I even close or is there an easier way? Thanks!!!

Your Answer

Think you can help? Login to answer this question!