App crash with 20+ ImageViews in ScrollableView

Does anyone know how to dynamically add and remove multiple ImageViews in a ScrollableView? If I have more than 20 ImageViews in the scrollableView of my app, it crashes.

7 Answers

I think 1.5 might solve the scrollableView crashing problem. Can anyone confirm this?

— answered December 13th 2010 by Arlton Lowry
permalink

0 Comments

1 Vote
the solution i ended up with was adding extra logic such that only 3 views were in memory at a time.

my method wasnt very efficient but its decent i guess… everytime you touch the screen the app sets all views to null except for the current one. it then recreates the images immediately adjacent to the current view back so that when the user scrolls there isnt an abrupt change.

its worked thus far though my app is small. hopefully it continues to work as i expand to more views.

— answered December 4th 2010 by sean oreilly
permalink

0 Comments

0 Votes
the solution i ended up with was adding extra logic such that only 3 views were in memory at a time.

my method wasnt very efficient but its decent i guess… everytime you touch the screen the app sets all views to null except for the current one. it then recreates the images immediately adjacent to the current view back so that when the user scrolls there isnt an abrupt change.

its worked thus far though my app is small. hopefully it continues to work as i expand to more views.
— answered December 4th 2010 by sean oreilly
permalink

2 Comments
- I tried to do exactly this, but my app kept crashing as soon as I swiped to the second ImageView. Would you mind sharing your code?
  
  — commented December 4th 2010 by Arlton Lowry
- Me too, I would also love to see how you managed this.
  
  — commented January 6th 2011 by Matt Sahr
0 Votes
the solution i ended up with was adding extra logic such that only 3 views were in memory at a time.

my method wasnt very efficient but its decent i guess… everytime you touch the screen the app sets all views to null except for the current one. it then recreates the images immediately adjacent to the current view back so that when the user scrolls there isnt an abrupt change.

its worked thus far though my app is small. hopefully it continues to work as i expand to more views.

— answered December 4th 2010 by sean oreilly
permalink

0 Comments

0 Votes

test is my scrollableview…
e.source.name2 is a unique int for each page

test.addEventListener('touchstart', function(e){
var pagenumber = e.source.name2;
//pass in the unique identifier for each view

var onepageback = Math.round(pagenumber) - 1;
//grab identifiers for the preceding and following view so that its seamless when the user scrolls

var onepagefwd = Math.round(pagenumber) + 1;

for (var q=0; q<pages.length; q++){

//erase all backgrounds except for the current one by assigning them an invalid image

if (q == pagenumber){
//do nothing to currentpage }

else{ /
/erase all others

pages[q].setbackgroundImage('');
}
}

//create views for 2 adjacent pages
    pages[onepageback].setbackgroundImage('images/backgrounds/pages' + onepageback + '.png');

        pages[onepagefwd].setbackgroundImage('images/backgrounds/pages' + onepagefwd + '.png');

});

— answered December 5th 2010 by sean oreilly
permalink

1 Comment

It's still not working. This is what I've got so far:

var pages = [

Ti.UI.createView({name: '001'}), 
Ti.UI.createView({name: '002'}),
Ti.UI.createView({name: '003'}),
Ti.UI.createView({name: '004'}),
Ti.UI.createView({name: '005'})

];


var scrollView = Titanium.UI.createScrollableView({
    views:pages,
    showPagingControl:false,
    pagingControlHeight:30,
    enableZoomControls:false,
    currentPage:1
});

win.add(scrollView);


scrollView.addEventListener('scroll', function(e){

    var pagenumber = e.source.pages;
    Titanium.API.info(' page number ' + pagenumber);

//pass in the unique identifier for each view

var onepageback = Math.round(pagenumber) - 1;  
//grab identifiers for the preceding and following view so that its seamless when the user scrolls

var onepagefwd = Math.round(pagenumber) + 1;

    for (var q=0; q<pages.length; q++){ 
//erase all backgrounds except for the current one by assigning them an invalid image

if (q == pagenumber){

            //do nothing to currentpage 

            }

else{ //erase all others

pages[q].setbackgroundImage('');
            }
    }

    //create views for 2 adjacent pages
        pages[onepageback].setbackgroundImage('images/' + onepageback + '.jpg');

            pages[onepagefwd].setbackgroundImage('images/' + onepagefwd + '.jpg');
});

— commented December 5th 2010 by Arlton Lowry

test is my scrollableview…
e.source.name2 is a unique int for each page

test.addEventListener('touchstart', function(e){
var pagenumber = e.source.name2;
//pass in the unique identifier for each view

var onepageback = Math.round(pagenumber) - 1;
//grab identifiers for the preceding and following view so that its seamless when the user scrolls

var onepagefwd = Math.round(pagenumber) + 1;
```
for (var q=0; q<pages.length; q++){ 
```
//erase all backgrounds except for the current one by assigning them an invalid image

if (q == pagenumber){
//do nothing to currentpage }

else{ /
/erase all others

pages[q].setbackgroundImage('');
}
}
```
//create views for 2 adjacent pages
    pages[onepageback].setbackgroundImage('images/backgrounds/pages' + onepageback + '.png');

        pages[onepagefwd].setbackgroundImage('images/backgrounds/pages' + onepagefwd + '.png');
```
});
— answered December 5th 2010 by sean oreilly
permalink

1 Comment
- I've been testing out the code you posted. I've been getting errors and it's probably because I've overlooked something. Here's what I've got:
```
var view1 = Ti.UI.createImageView({
});

var scrollView = Titanium.UI.createScrollableView({
    views:[view1],
    showPagingControl:false,
    pagingControlHeight:30,
    enableZoomControls:false,
    currentPage:0
});

win.add(scrollView);

view1 = 1; // image name

scrollView.addEventListener('scroll', function(e){

   var activeView = e.source.view1;  // the object handle to the view that is about to become visible  

//pass in the unique identifier for each view
```
  Do you know what I'm missing?
  
  — commented December 5th 2010 by Arlton Lowry
0 Votes
my app does the same thing, I load 12 images to a scrollview, finally, I found out it has little to do with the memory, because even when I load 12 tiny images, it crashes too, so it has something to do with the thread or loading mechanisim in Ti.

I ended up doing this, so far it is ok. Load 4 images at a time and then wait for 1 second or 0.5 second to load another 4. Now, I can load 12 1M images without issues.

— answered December 13th 2010 by jason hu
permalink

0 Comments

-1 Votes

Titanium Community Questions & Answer Archive

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

App crash with 20+ ImageViews in ScrollableView

7 Answers