Skip to content

Instantly share code, notes, and snippets.

@anthonychung

anthonychung/listView.js

Last active September 7, 2018 22:21
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save anthonychung/5062645 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save anthonychung/5062645 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. anthonychung revised this gist Mar 1, 2013. 1 changed file with 16 additions and 0 deletions.
    16 changes: 16 additions & 0 deletions readme.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    # Lazy loading parts of a collection bound to an table view

    > Titanium alloy example.
    Using the dataFilter function to lazy load parts of the collection that is bound to a tableView, adding 10 more at a time to be displayed.
    uses a single collection bound to tableView

    The filterFunction calls collection.first(numberTableRowsDisplayed).
    This var numberTableRowsDisplayed is incremented when user gets to bottom of the table.
    Uses alloy widgets:
    nl.fokkezb.dynamicScrolling to increment the number of rows to be displayed and then trigger change on the collection, when user gets to the bottom of the TableView.
    nl.fokkezb.pullToRefresh to get more json data from web datasource.

    Links:
    https://github.com/FokkeZB/nl.fokkezb.dynamicScrolling
    https://github.com/FokkeZB/nl.fokkezb.pullToRefresh
  2. anthonychung created this gist Mar 1, 2013.
    74 changes: 74 additions & 0 deletions listView.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,74 @@
    var common = require('common');

    var pullToRefresh, scrollCtrl;
    var numberTableRowsDisplayed = 10;
    var postsCollection = Alloy.Collections.post;

    function filterFunction(collection) {
    return collection.first(numberTableRowsDisplayed);
    }


    postsCollection.comparator = function(model) {
    // the minus is important to reverse the order for the comparator, flip ascending descending.
    return -model.get('date');
    };


    function loadMoreRows(_callback) {
    numberTableRowsDisplayed = numberTableRowsDisplayed+10;
    postsCollection.trigger('change');

    if(OS_IOS) {
    if (typeof(_callback) !== "undefined"){
    Ti.API.info('about to finish load more rows');
    _callback();

    }
    }
    }

    function refreshFeed(_callback) {
    Ti.API.info('BEGINNING refresh feed');
    common.getFacebookFeed(postsCollection);
    common.getTwitterFeed(postsCollection);
    common.getBlogFeed(postsCollection,"get_recent_posts");

    postsCollection.trigger('change');

    if(OS_IOS) {
    if (typeof(_callback) !== "undefined"){
    Ti.API.info('about to finish pull to refresh');
    pullToRefresh.date = moment();
    _callback();

    }
    }

    }

    function init(){
    // init calls
    if(OS_IOS) {
    pullToRefresh = Alloy.createWidget("nl.fokkezb.pullToRefresh", null, {
    table: $.postsTable,
    backgroundColor: "#EEE",
    fontColor: "#AAA",
    indicator: "dark",
    image: "/images/ptrArrow.png",
    loader: refreshFeed,
    msgUpdating: "Checking for new feeds"
    });


    scrollCtrl = Alloy.createWidget('nl.fokkezb.dynamicScrolling', null, {
    table: $.postsTable,
    loader: loadMoreRows
    });
    }
    if(OS_IOS) {
    refreshFeed();
    }
    }

    init();
    10 changes: 10 additions & 0 deletions listView.xml
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,10 @@
    <Alloy>

    <Collection src="post"/>
    <Window id="window" class="container">
    <TableView id="postsTable" dataCollection="post" dataTransform="transformFunction" dataFilter="filterFunction" onClick="rowClicked" >
    <Require src="row"/>
    </TableView>
    </Window>

    </Alloy>