[TIMOB-16068] TableViewRow layout and sizes

GitHub Issue	n/a
Type	Bug
Priority	n/a
Status	Reopened
Resolution	Unresolved
Affected Version/s	n/a
Fix Version/s	n/a
Components	iOS
Labels	ios, layout, tableViewRow
Reporter	Nikhil N
Assignee	Unknown
Created	2013-09-10T04:27:04.000+0000
Updated	2018-02-28T20:04:11.000+0000

Description

When creating a simple tableView row, as shown below, the layout is pretty random.

Code

var d = ['Account','About'...];

for(...) {

    var row = Ti.UI.createTableViewRow({
        height: 50,

        hasChild: true,

        leftImage: '/settings/'+d[i]+'.png',
        title: d[i],
        color: '#333333',
        selectedColor: '#2f2f2f',
        font: ui.titleFont,

        className: 'settingsRow'
    });

}

tableView.appendRow(row);
row=null;

When the leftImage property is set on the Cell, the UIImage and the UILabel are offset far too off from the left edge. *Ref: 1.png* When the hasChild property is set to true, the UILabel of the Cell is offset un-naturally. Appears correctly when hasChild is set to false. *Ref: 2.png*

Attachments

File	Date	Size
1.png	2013-09-10T04:27:04.000+0000	50994
2.png	2013-09-10T04:27:04.000+0000	40894

Comments

Mostafizur Rahman 2013-09-10

Hello, I test your code in Ti SDK 3.1.2 and its working pretty good without any issues. You can run my following code for testing?

   var win = Ti.UI.createWindow({
   	navBarHidden : true,
   	exitOnClose : true,
   });
   
   var tableView = Ti.UI.createTableView({
   	width : Ti.UI.FILL,
   	backgroundColor : '#fff',
   	height : Ti.UI.FILL,
   	 
   });
   win.add(tableView);
   
   var d = ['Account', 'About', 'milon', 'fdf'];
   
   for (var i = 0, j = d.length; i < j; i++) {
   
   	var row = Ti.UI.createTableViewRow({
   		height : 50,
   		hasChild : true,
   		leftImage : '/images/arrow.png',
   		title : d[i],
   		color : '#333333',
   		selectedColor : '#2f2f2f',
   		className : 'settingsRow'
   	});
   	tableView.appendRow(row);
   }
   
   win.open();

Thanks

Nikhil N 2013-09-10

The issue occurs with Ti 3.1.3.x (issue confirmed with 3.1.3.v20130909184609 as well ~latest) As in your case, it works fine with 3.1.2.GA since TableView Cell's layout code was possibly update to suit iOS7's UITableViewCells
Nikhil N 2013-09-12

Same results with XCode 5 GM.

Mostafizur Rahman 2013-09-12

Tested this issue with the code below and can reproduce with both 3.1.3 and 3.2.0 SDK.

Testing Environment:

OS: MAC OS X 10.8.5 Ti SDK: 3.1.3 GA, 3.2.0.GA Ti CLI: 3.3.0 IOS Simulator 7.0

Test Code

    
    var win = Ti.UI.createWindow({
   	navBarHidden : true,
   	exitOnClose : true,
   	top : 20,
   });
   
   var tableView = Ti.UI.createTableView({
   	width : Ti.UI.FILL,
   	backgroundColor : '#fff',
   	height : Ti.UI.FILL,
   });
   win.add(tableView);
   
   var d = ['Account', 'About', 'milon', 'fdf'];
   
   for (var i = 0, j = d.length; i < j; i++) {
   
   	var row = Ti.UI.createTableViewRow({
   		height : 50, 
   		leftImage : '/images/arrow.png',
   		title : d[i],
   		color : '#333333',
   		selectedColor : '#2f2f2f',
   		className : 'settingsRow'
   	});
   	tableView.appendRow(row);
   }
   
   win.open();

Step to reproduces

Create a new project

Paste test code in app.js

Now run on iOS simulator

And Simulator screen

Thanks

Ritu Agrawal 2013-12-23

Moving this issue to engineering as we can reproduce this issue with both 3.1.3 and 3.2.0 SDK. It really does not matter if the hasChild property is set to true or false.

JSON Source