collection view reset data

[gacal]

collectionview items used fetch json data. I add the records from the request to the page as an imageview. How can I ensure that old imageview (in scrollview) are deleted when I refresh?

var homeModul = ["banner", "newdata"];

var collectionView = new tabris.CollectionView({
    left: 0, top: 0, right: 0, bottom: 0,
    itemHeight: "auto",
    items: homeModul,
    refreshEnabled: true,
    cellType: function (item) {
        return item;
    },
    initializeCell: function (cell, type) {

        switch (type) {
            case 'banner':
                bannerCell(cell);
                break;
        }

    }
}).on("refresh", function () {
    collectionView.set("items", homeModul);
}).appendTo(page);

function bannerCell(cell) {

    var sv = new tabris.ScrollView({
        layoutData: {left: 0, top: 0, right: 0, height: 200},
        direction: "horizontal",
        background: "#234"
    }).appendTo(cell);

    cell.on("change:item", function () {

        fetch("URL").then(function (result) {
            return result.json();
        }).then(function (poster) {

            poster.data.forEach(function (q) {

                new tabris.ImageView({
                    layoutData: {left: "prev() 10", top: 10, bottom: 10, width: 150},
                    image: {src: q.poster},
                    scaleMode: "fill"
                }).appendTo(sv)
                    .on("tap", function () {
                        require("./fnc.js")(q.hash);
                    })
            })
        });

    })
}

[natanraj]

i guess it is auto refresh when you cv.set ('data', yourNewCollection);

[cookieguru]

change:item will be fired every time the contents of the Cell changes. The contents of the Cell will change as you scroll up and down the list view--not just when you set the items. The CollectionView is implemented with a RecyclerView so once an item scrolls off the screen its contents are destroyed and the cell becomes available for re-use. Once the cell is needed again, the change:item event fires.

[gacal]

how to delete ScrollView > ImageView or How should the method be ?

[cookieguru]

Call dispose()

[gacal]

not understand ? please sample code

[cookieguru]

var image = new tabris.ImageView({ /* ... */ });
image.dispose();

[gacal]

This code is not; Because the image object comes with json data. And does not have a variable value.

[cookieguru]

Assign it to a variable

[gacal]

Eventually worked

var page = new tabris.Page({
    title: 'Paging',
    topLevel: true
});

var homeModul = ["banner", "newdata"];

var collectionView = new tabris.CollectionView({
    left: 0, top: 0, right: 0, bottom: 0,
    itemHeight: "auto",
    items: homeModul,
    refreshEnabled: true,
    cellType: function (item) {
        return item;
    },
    initializeCell: function (cell, type) {

        switch (type) {
            case 'banner':
                var sv = new tabris.ScrollView({
                    layoutData: {left: 0, top: 0, right: 0, height: 200},
                    direction: "horizontal",
                    background: "#234"
                }).appendTo(cell);

                bannerCell(cell, sv);
                break;
        }

    }
}).on("refresh", function () {
    //console.log(collectionView.find('.as').dispose());
    collectionView.find('.as').animate({
        opacity: 0,
    }, {
        duration: 200,
        easing: "fade-in"
    });

    collectionView.find('.as').once('animationend', function () {
        this.dispose();
        collectionView.set("items", homeModul);
        collectionView.set("refreshIndicator", false);
    });
}).appendTo(page);

function bannerCell(cell, view) {

    cell.on("change:item", function () {

        fetch("URL").then(function (result) {
            return result.json();
        }).then(function (poster) {

            poster.data.forEach(function (q) {

                var img = new tabris.ImageView({
                    layoutData: {left: "prev() 10", top: 10, bottom: 10, width: 150},
                    image: {src: q.poster},
                    class: 'as',
                    scaleMode: "fill"
                }).appendTo(view)
                    .on("tap", function () {
                        require("./fnc.js")(q.hash);
                    })
            })
        });

    })
}
page.open();