Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-15066] iOS7: TableView SearchBar overrides the status bar when hiding the window navigation bar

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionInvalid
Resolution Date2013-09-06T17:32:10.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
Labelsios7, triage
ReporterDavide Cassenti
AssigneeVishal Duggal
Created2013-09-06T14:07:04.000+0000
Updated2017-03-22T21:44:05.000+0000

Description

Description

A window has a navigation bar and a table with search; when focusing on the search bar, the navigation bar is hidden programmatically. This leads to the search bar to be moved up, overriding the iOS status bar.

Code to reproduce

Titanium.UI.setBackgroundColor('#000');

var tabGroup = Titanium.UI.createTabGroup();

var win1 = Titanium.UI.createWindow({  
    title:'Table w/ Search',
    backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({  
    icon:'KS_nav_views.png',
    title:'Table w/ Search',
    window:win1
});

var allNoteTypes = [
	{title:'Plan 1'},
	{title:'Plan 2'},
	{title:'Plan 3'}
];

var searchBar = Ti.UI.createSearchBar({barColor: "#283D5A",
	hintText: "SR Number"
});

var table = Ti.UI.createTableView({
	top: 0,
	width:"100%",
	backgroundColor:'transparent',
	hideSearchOnSelection: false,
	data:allNoteTypes,
	search: searchBar
});

win1.add(table);

function handleSearchBarFocus(_event) {
	win1.hideNavBar();
	searchBar.setShowCancel(true);
}

function handleSearchBarBlur(_event) {
	win1.showNavBar();
	searchBar.setShowCancel(false);
}

searchBar.addEventListener("focus", handleSearchBarFocus);
searchBar.addEventListener("blur", handleSearchBarBlur);

tabGroup.addTab(tab1);   

tabGroup.open();

Note

Same code works fine on iOS6 using stable XCode

Attachments

FileDateSize
iOS Simulator Screen shot 6 Sep 2013 17.39.25.png2013-09-06T16:40:21.000+0000114771

Comments

  1. Ingo Muschenetz 2013-09-06

    [~dcassenti] Screenshots?
  2. Vishal Duggal 2013-09-06

    On IOS7 the root view controller is full screen (which means it will extend underneath the status bar). On IOS6 it is not. When you hide the navBar, the tableView will occupy the full screen on IOS7 and hence the searchbar will be below the status bar. You will have to adjust the UI for IOS7. Set the top for tableView to 20 (STATUS BAR HEIGHT) and things should be ok. Use the code below to adjust for IOS7
       Titanium.UI.setBackgroundColor('#000');
        
       function isiOS7Plus()
       {
           // add iphone specific tests
           if (Titanium.Platform.name == 'iPhone OS')
           {
               var version = Titanium.Platform.version.split(".");
               var major = parseInt(version[0],10);
               
               // can only test this support on a 3.2+ device
               if (major >= 7)
               {
                   return true;
               }
           }
           return false;
       
       }
       
       var isIOS7 = isiOS7Plus();
       
       var tabGroup = Titanium.UI.createTabGroup();
        
       var win1 = Titanium.UI.createWindow({  
           title:'Table w/ Search',
           backgroundColor:'#fff'
       });
       var tab1 = Titanium.UI.createTab({  
           icon:'KS_nav_views.png',
           title:'Table w/ Search',
           window:win1
       });
        
       var allNoteTypes = [
           {title:'Plan 1'},
           {title:'Plan 2'},
           {title:'Plan 3'}
       ];
        
       var searchBar = Ti.UI.createSearchBar({barColor: "#283D5A",
           hintText: "SR Number"
       });
        
       var table = Ti.UI.createTableView({
           top: 0,
           width:"100%",
           backgroundColor:'transparent',
           hideSearchOnSelection: false,
           data:allNoteTypes,
           search: searchBar
       });
        
       win1.add(table);
        
       function handleSearchBarFocus(_event) {
           win1.hideNavBar();
           if (isIOS7) {
               table.top = 20;
           };
           searchBar.setShowCancel(true);
       }
        
       function handleSearchBarBlur(_event) {
           win1.showNavBar();
           table.top = 0;
           searchBar.setShowCancel(false);
       }
        
       searchBar.addEventListener("focus", handleSearchBarFocus);
       searchBar.addEventListener("blur", handleSearchBarBlur);
        
       tabGroup.addTab(tab1);   
        
       tabGroup.open();
       
  3. Lee Morris 2017-03-22

    Closing ticket as invalid.

JSON Source