Titanium WebView.toImage on coverFlowView

407 Views Asked by At

A have several views with WebViews on them. I need to make it in a coverFlowView. For that i make my views toImage, to put after on the coverFlow, but the issue is that i get images with webView not loaded... I tried to make setTimeout, but it doesn't help.

var cover = Titanium.UI.iOS.createCoverFlowView({
    images: forflowImages
});
for (var k = start; k < cData.length; k++) {
r = Ti.UI.createView({});
for (var j = 0; j < child.objects.length; j++) {
    tmp = Ti.UI.createWebView({
        left : 10,
        top : 10,
        right : 10,
        bottom : 10,
        width : Ti.UI.FILL,
            height : Ti.UI.SIZE,
        willHandleTouches: true,
        backgroundColor : '#fff2df',
    });
    tmp.html = obj.html;
    no.add(tmp);
    r.add(no);
    }
}
r.addEventListener("load", function(e) {
        blob = r.toImage();
    });
    forflowImages.push(blob);   
}
cover.setImages(forflowImages); 

With this code, coverFlowView doesn't have any views.

setTimeout(function() {
        blob = r.toImage();
    }, 500);

Also doesn't help, i have activity indicator on the page saved, content seems didn't have time to load before toImage function acted.

1

There are 1 best solutions below

2
On

You are ordering things the wrong way, and you have multiple syntax errors, also you are listeneing for the load event on the wrong type of view, you shold be listeneing on the WebView, try this instead:

var forflowImages = [];
var container = // This should already be in the view stack somewhere
var cover = Titanium.UI.iOS.createCoverFlowView();
function loadListener(e) {
    forflowImages.push(e.source.toImage()); 
    if(forFlowImages.length == child.objects.length) {
        // We have all the images for cover flow
        cover.setImages(forflowImages);
    }
}

var containerView = Ti.UI.createView();
for (var j = 0; j < child.objects.length; j++) {
    var tmp = Ti.UI.createWebView({html : obj.html);
    tmp.addEventListener("load", loadListener);
    container.add(tmp);
    tmp.repaint();
}

I removed some of your code that was syntactically incorrect and trimmed it down so it would be easy to understand. All this code does is add an event listener that handles the conversion of a webview to an image.