Scrollableview dataCollection insert before silently

Hey folks,

I'm using a scrollableview to show detailed information about news items in my app. Now what I'm doing is when the user clicks an item, it retrieves the info of that item, including the 5 items before and after it. This to keep the load for the scrollable view acceptable. Because if you add like 50 items at once to a scrollable view, well good luck with that.

What I'm trying to achieve is when the user scrolls to the first index of the scrollable view, it needs to add 5 more items before the first item. So when arrived on index 0, index 0 becomes index 5, with index 0,1,2,3,4 being the new items.

I'm using data binding with my scrollableview, which allows me to add model data at the start or end of the collection. But when triggering the 'change' event, it flashes for redrawing all views, because the collection changes. Using silent option on fetch is currently what I'm doing to avoid flashing it 5 times.

Is there any option to avoid that flashing behaviour? I know the scrollableview does not have a function to insert a view at index 0 manually by code. It does however have a function to insert it after, that's what I'm using if the user arrives on the last index.

$.items.addEventListener("scrollend", function(e) {
    var toJSON = collection.toJSON(), col; // collection variable is local variable in controller
    if(e.currentPage == 0) {
        col = collection.getItemsBefore(toJSON[0].starttime, 5).toJSON(); // Does a query to get five items before item on index 0
        collection.add(col, {at: 0, silent:true}); // Add silently at index 0 to prevent 5 redraws
        collection.trigger('change'); // Scrollableview flashes
        $.items.setCurrentPage(5); // Go index 5 because that's where you were initially
    } else if(e.currentPage == this.getViews().length-1) {
        /* This works */
    }
});

Specs:

• OS X 10.9.4
• Ti SDK 3.3.0