Problem
On Android tab device, the tableview row just above the section header row, that is blank, takes part of the height of the section header and hence has more height that all other rows in the tableview.
This is not a regression. The issue occurs as far as 1.8.2
Tested on
The issue occurs only on Android 7" Galaxy Tab. The behavior was not seen on Galaxy Nexus (V4.0.2) and Motorola Milestone (V2.2)
Android Emulator 2.3
Steps To Reproduce
1. Create Application and run on Android tab
2. Check the table view for the height of the rows
3. Click on a row below any header title, a minor gap is noticeable (as transparent lines, or blank depending on backgroundColor as seen in the screenshot attached TIMOB-9537_AndroidEmulator.png)
Actual behavior
The height of both instance of 'Row 2' is more as compared to other rows of the tableview. Check the screenshot Tablet_BlankHeader. This happens only for rows just above the blank header row. If the header row has a text then the height of each row is same. Check the screenshot Tablet_NonBlankHeader.
Expected
The height of all table view rows should be same
Repro sequence
var _window = Ti.UI.createWindow();
_window.backgroundColor = 'white';
var rows = [
{title: 'Row 1'},
{title: 'Row 2'},
{header: '', title: 'Row 3'},
{title: 'Row 4'},
{title: 'Row 1'},
{title: 'Row 2'},
{header: '', title: 'Row 3'},
{title: 'Row 4'}
];
var tableview = Ti.UI.createTableView({
});
tableview.setData(rows);
_window.add(tableview);
_window.open();
http://www.samsung.com/ae/consumer/mobile-phones/mobile-phones/tablets/GT-P6200MAAXSG
The row heights are all the same. Probably happening because of the difference in behavior in the native TextView with empty strings. Anyways if all you want is a blank header, use the headerView property of the Ti.UI.TableViewSection to set a view with required background color.
Code that should work consistently across devices
var _window = Ti.UI.createWindow(); _window.backgroundColor = 'white'; var section1 = Ti.UI.createTableViewSection({}); section1.add(Ti.UI.createTableViewRow({title:'Row 1'})) section1.add(Ti.UI.createTableViewRow({title:'Row 2'})) var headerView2 = Ti.UI.createView({width:Ti.UI.FILL,height:'18dp',backgroundColor:'darkgray'}) var section2 = Ti.UI.createTableViewSection({headerView:headerView2}); section2.add(Ti.UI.createTableViewRow({title:'Row 3'})) section2.add(Ti.UI.createTableViewRow({title:'Row 4'})) section2.add(Ti.UI.createTableViewRow({title:'Row 1'})) section2.add(Ti.UI.createTableViewRow({title:'Row 2'})) var headerView3 = Ti.UI.createView({width:Ti.UI.FILL,height:'18dp',backgroundColor:'darkgray'}) var section3 = Ti.UI.createTableViewSection({headerView:headerView3}); section3.add(Ti.UI.createTableViewRow({title:'Row 3'})) section3.add(Ti.UI.createTableViewRow({title:'Row 4'})) var data = []; data.push(section1); data.push(section2); data.push(section3); var tableview = Ti.UI.createTableView({}); tableview.setData(data); _window.add(tableview); _window.open();