Search code examples
image-processingtitanium-mobiletitanium-alloy

changing image view into a blob does not always work .toImage();


The following code is working for the most part, however sometimes after being changed into a blob, the image view does not display the image.

//store in temp image view, convert to blob
                imageViewTemp.image = "imagename.jpg"

                blob = imageViewTemp.toBlob();


                albumTitle = data[x].name + ' (' + numberPhotos + ')';

                var row = Titanium.UI.createTableViewRow({
                    titleAlb : data[x].name,
                    width : '100%',
                    height : 'auto'
                });
                var image = Titanium.UI.createImageView({
                    top : 0,
                    left : 0,
                    width : '75',
                    height : '75'
                });
                var title = Titanium.UI.createLabel({
                    text : albumTitle,
                    top : 0,
                    left : 110,
                    width : 'auto',
                    height : 'auto'
                });



                var width = blob.width;
                var height = blob.height;

                //crop  so it fits in image view
                if (width > height) {


                    image.image = ImageFactory.imageAsCropped(blob, {
                        width : height,
                        height : height,
                        x : 60,
                        y : 0
                    });

                } else {


                    image.image = ImageFactory.imageAsCropped(blob, {
                        width : (width - 1),
                        height : (width - 1),
                        x : 60,
                        y : 0
                    });

                }



                row.add(image);
                row.add(title);
                rows.push(row);


            }

In order to change the dimension of the image, I am using a module called image factory. Before I can change it, I have to store the image inside a tempory image view which I then convert into a blob:

                blob = imageViewTemp.toBlob();

The problem is after the screen is rendered sometimes this will not work:

image.image = ImageFactory.imageAsCropped(blob, {
                            width : height,
                            height : height,
                            x : 60,
                            y : 0

});

Othertimes it will.

I have read online that the problem might be linked to the post layout cycle, but I am not sure, or how to proceed

http://developer.appcelerator.com/question/174329/what-are-the-difference-between-toblob--toimage

All help appreciated.


Solution

  • Solved the problem.

    You have to download the image first using a REST API method (GET) before placing it into the temporary image view, otherwise the temp image view will be rendered before the file has been fully downloaded (.toImage is an async call back method), making way for a useless blob and no image.

    The only problem with this method, is that you are reliant on your REST API calls to not fail.