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

iOS: Pull to Refresh view not displaying correctly when swiping up before releasing

    Details

    • Type: Bug
    • Status: Closed
    • Priority: High
    • Resolution: Cannot Reproduce
    • Affects Version/s: None
    • Component/s: iOS
    • Labels:
      None
    • Environment:

      iOS7
      SDK 3.1.3

      Description

      Description of the issue

      Having a table with search bar and pull-to-refresh view; when pulling the table down and swiping a bit up before releasing, the headerPullView and search bar are half hidden.

      Steps to reproduce

      1) Use the code below
      2) Pull the table down
      3) Before releasing, swipe a bit up

      Attached a couple of screenshots of the result of these actions.

      Titanium.UI.setBackgroundColor('#000');
      Ti.UI.iPhone.statusBarStyle = Ti.UI.iPhone.StatusBar.LIGHT_CONTENT;
       
      var tabGroup = Titanium.UI.createTabGroup();
       
      var win1 = Titanium.UI.createWindow({
          title : 'Table with Search',
          backgroundColor : '#fff',
          barColor: 'black',
          statusBarStyle: Ti.UI.iPhone.StatusBar.LIGHT_CONTENT
      });
      var tab1 = Titanium.UI.createTab({
          icon : 'KS_nav_views.png',
          title : 'Table w/ Search',
          window : win1
      });
       
      var allNoteTypes = [];
      for (var i=1; i<=30; i++) {
      	allNoteTypes.push({
      		title : 'Plan ' + i
      	});
      }
       
      var refreshView = Ti.UI.createView({
          width : "100%",
          top : 0,
          height : 22,
          backgroundColor : "#000"
      });
       
      var lblRefreshTime = Ti.UI.createLabel({
          left : 5,
          width : '55%',
          text : "refreshed 1 min ago"
      });
       
      var searchBar = Ti.UI.createSearchBar({
          barColor : "#283D5A",
          autocorrect : false,
          autocapitalization : Titanium.UI.TEXT_AUTOCAPITALIZATION_NONE,
          hintText : "SR Number",
          keyboardType : Ti.UI.KEYBOARD_NUMBERS_PUNCTUATION
      });
       
      var table = Ti.UI.createTableView({
          top : 0,
          width : "100%",
          backgroundColor : 'transparent',
          hideSearchOnSelection : false,
          data : allNoteTypes,
          search : searchBar
      });
       
      refreshView.add(lblRefreshTime);
      win1.add(refreshView);
      win1.add(table);
       
      var border = Ti.UI.createView({
          backgroundColor : "#576c89",
          height : 2,
          bottom : 0
      });
       
      var tableHeader = Ti.UI.createView({
          backgroundColor : "#bcbdc1",
          width : Ti.Platform.displayCaps.platformWidth,
          height : 60
      });
       
      tableHeader.add(border);
       
      var statusLabel = Ti.UI.createLabel({
          text : "Pull to Reload",
          left : 55,
          bottom : 30,
          height : "auto",
          color : "#FFF",
          textAlign : "center"
      });
       
      tableHeader.add(statusLabel);
      table.headerPullView = tableHeader;
       
      var pulling = false;
      var reloading = false;
       
      var overlay = Ti.UI.createView({
          opacity:.2,
          backgroundColor:'black'
      });
       
      var timeOutCounter;
       
      function beginReloading() {
          searchBar.add(overlay);
          table.scrollable = false;
          timeOutCounter = setTimeout(function(){
              Ti.API.info('TIMEOUT');
              endReloading();
          }, 2000);
          Ti.API.info('setTimeout returned '+timeOutCounter);
      }
       
      function endReloading() {
          Ti.API.info('END Reloading called. Current Counter '+timeOutCounter);
          clearTimeout(timeOutCounter);
          searchBar.remove(overlay);
          table.scrollable = true;
          table.setContentInsets({
              top : 0
          }, {
              animated : true
          });
          reloading = false;
          statusLabel.text = "Pull down to refresh...";
      }
       
      var offset = 0;
      table.addEventListener('scroll', function(e) {
          if (reloading) {
              return;
          }
          offset = e.contentOffset.y;
          if (offset <= -65.0 && !pulling) {
              pulling = true;
              statusLabel.text = "Release to refresh...";
          } else if (pulling && offset > -65.0 && offset < 0) {
              pulling = false;
              statusLabel.text = "Pull down to refresh...";
          }
      });
       
      table.addEventListener('dragEnd', function(e) {
          if (reloading) {
              return;
          }
          if (pulling && !reloading && offset <= -65.0) {
              reloading = true;
              pulling = false;
              statusLabel.text = "Reloading...";
              table.setContentInsets({
                  top : 60
              }, {
                  animated : true
              });
              beginReloading();
          }
      });
       
      function handleSearchBarFocus(_event){
          Ti.API.info('FOCUS');
          endReloading();
          setTimeout(function(){
              searchBar.focus();
          },300);
      }
       
      function hideNavBar() {
          win1.hideNavBar();
          table.top = 22;
      }
       
      function showNavBar() {
          win1.showNavBar();
          table.top = 0;
      }
       
      overlay.addEventListener("click", handleSearchBarFocus);
       
      searchBar.addEventListener("focus", hideNavBar);
      searchBar.addEventListener("blur", showNavBar);
       
      tabGroup.addTab(tab1);
      tabGroup.open();
      

        Attachments

          Activity

            People

            • Assignee:
              vduggal Vishal Duggal (Inactive)
              Reporter:
              dcassenti Davide Cassenti
            • Watchers:
              0 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Backbone Issue Sync

                • Titanium SDK/CLI <> Titanium Mobile
                  Synced with:
                  TIMOB-17553
                  Sync status:
                  ERROR
                  Last received:
                  Last sent:

                  Git Integration