Search code examples
imagememorytitaniumsliding

Downloading images from server and showing it in a scrollview


I have an array of urls of images, from which i have to first download the images then show in sliding. But i want to download images asynchronously. I am using 3 images at a time like in the below code :

var imageViewArray = [];
var nextImageIndex;
var imageNameArray=[];

for (var i = 0; i < 3; i++) {
var imageView1 = Titanium.UI.createImageView({
});
imageViewArray[i] = imageView1;
}

var scrollingView = Titanium.UI.createScrollableView({
views : imageViewArray,
width : 310,
height : 450,
top : 5,
left : 5,
borderWidth : 2,
borderColor : '#000'
 });

scrollingView.addEventListener('scroll', function(e) {
Ti.API.info("C=" + e.currentPage);
Ti.API.info("N=" + nextImageIndex);
if (e.currentPage == 2 && nextImageIndex < imageNameArray.length - 2) {
    //Setting the current page to 1 will allow the smooth swipe functionality
    scrollingView.currentPage = 1;
    nextImageIndex += 1;
    var vw = scrollingView.views[0];
    imageViewArray[0] = scrollingView.views[1];
    imageViewArray[1] = scrollingView.views[2];
    scrollingView.removeView[vw];
    vw.image = imageNameArray[nextImageIndex + 1];
    imageViewArray[2] = vw;
    scrollingView.views = imageViewArray;
} else if (e.currentPage == 0 && nextImageIndex > 1) {
    nextImageIndex -= 1;
    scrollingView.currentPage = 1;
    var vw = scrollingView.views[2];
    imageViewArray[1] = scrollingView.views[0];
    imageViewArray[2] = scrollingView.views[1];

    scrollingView.removeView[vw];

    vw.image = imageNameArray[nextImageIndex - 1];
    imageViewArray[0] = vw;
    scrollingView.views = imageViewArray;
}

  });

 scrollingView.views[0].image = imageNameArray[0];
  scrollingView.views[1].image = imageNameArray[1];
   scrollingView.views[2].image = imageNameArray[2];
  nextImageIndex = 1;

Can anyone tell me where shall i need to download th eimages from the urls. Thanks


Solution

  • Firstly, download at least 3 images to start with when you load this view. Then in your scroll event you'll download more images.

    Q: Why are you removing views from the scrollview?