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

        1. iOS Simulator Screen shot 30 Sep 2013 19.24.35.png
          43 kB
          Davide Cassenti
        2. iOS Simulator Screen shot 30 Sep 2013 19.24.36.png
          45 kB
          Davide Cassenti
        3. ScreenShot1.PNG
          39 kB
          Dhirendra Jha
        4. ScreenShot2.PNG
          40 kB
          Dhirendra Jha

          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