Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-28048

Android: RefreshControl in TableView only works when dragging content

    Details

    • Story Points:
      5

      Description

      Problem:
      When creating a TableView with a RefreshControl you can only drag the view down when you drag&drop the content. If you TableView is empty you don't have any handle to drag.

      Code

      function appendRowTo(tableView) {
      	if (!tableView.refreshCount) {
      		tableView.refreshCount = 1;
      	} else {
      		tableView.refreshCount++;
      	}
      	tableView.appendRow(Ti.UI.createTableViewRow({
      		title: `Refresh ${tableView.refreshCount}`
      	}));
      }
       
      const window = Ti.UI.createWindow({ fullscreen: true });
      const refreshControl = Ti.UI.createRefreshControl({
      	title: Ti.UI.createAttributedString({ text: 'Refreshing' })
      });
      refreshControl.addEventListener('refreshstart', e => {
      	Ti.API.info('@@@ \'refreshstart\' event received.');
      	setTimeout(function() {
      		if (tableView.refreshControl) {
      			appendRowTo(tableView);
      			refreshControl.endRefreshing();
      		}
      	}, 2000);
      });
      refreshControl.addEventListener('refreshend', e => {
      	Ti.API.info('@@@ \'refreshend\' event received.');
      	if (refreshControl.tintColor === 'red') {
      		refreshControl.tintColor = 'green';
      	} else if (refreshControl.tintColor === 'green') {
      		refreshControl.tintColor = 'blue';
      	} else {
      		refreshControl.tintColor = 'red';
      	}
      	refreshControl.title = Ti.UI.createAttributedString({ text: refreshControl.tintColor });
      });
       
      const tableView = Ti.UI.createTableView({
      	refreshControl: refreshControl,
      	data: [Ti.UI.createTableViewSection({ headerTitle: 'TableView' })],
      	width: Ti.UI.FILL,
      	height: Ti.UI.FILL,
      	headerView: Ti.UI.createLabel({
      		text: 'Table Header',
      		textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER,
      		color: 'white',
      		backgroundColor: 'blue',
      		width: Ti.UI.FILL,
      	}),
      	footerView: Ti.UI.createLabel({
      		text: 'Table Footer',
      		textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER,
      		color: 'white',
      		backgroundColor: 'blue',
      		width: Ti.UI.FILL,
      	}),
      });
      tableView.appendRow(Ti.UI.createTableViewRow({ title: '<Pull down to refresh>' }));
       
      window.add(tableView);
      window.open();
      

      Dragging below the TableView won't show the RefreshControl it will only work when you start dragging on the row.

      What to expect
      The whole TableView space (in the example Ti.UI.FILL) should work as a drag area. Otherwise you can't use it with an empty TableView.

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                gmathews Gary Mathews
                Reporter:
                michael Michael Gangolf
                Reviewer:
                Joshua Quick
              • Watchers:
                2 Start watching this issue

                Dates

                • Created:
                  Updated:

                  Backbone Issue Sync

                  • Backbone Issue Sync is enabled for your project, but we do not have any synchronization info for this issue.

                    Git Integration