Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Display string as image

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 December 5th 2010 by Wendy
  • android
  • blob
  • image
  • imageview
  • iphone
  • picture
  • string
  • type
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 December 5th 2010 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..

    — answered December 5th 2010 by Critter
    permalink
    0 Comments
  • 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);

    — answered December 6th 2010 by Wendy
    permalink
    1 Comment
    • Thanks Wendy, it works like a charm!

      — commented February 18th 2013 by tiago tecchio
  • 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);
    
    — answered December 6th 2010 by Wendy
    permalink
    0 Comments
  • 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!!!

    — answered December 5th 2010 by Wendy
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.