[TIMOB-17676] iOS8: Listview: Separator Insets values are not respected on the side of the title/data if the listview row contains a title/data

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2014-10-03T18:52:03.000+0000
Affected Version/s	n/a
Fix Version/s	Release 3.4.2, Release 3.5.0, Release 4.0.0
Components	iOS
Labels	module_listview, qe-3.4.0
Reporter	Lokesh Choudhary
Assignee	Muhammad Dadu
Created	2014-09-10T23:01:05.000+0000
Updated	2014-11-24T18:05:26.000+0000

Description

This issue is only seen on iOS 8. Works fine on iOS 7.1

Description:

1. Run the code below:

var win = Ti.UI.createWindow({
    backgroundColor: 'white',
    title:'INSETS',
    layout:'vertical'
});
 
 
var container = Ti.UI.createView({height:Ti.UI.SIZE,width:Ti.UI.SIZE,layout:'horizontal'});
win.add(container);
 
 
var listView = Ti.UI.createListView({top:5,separatorColor:'red',separatorInsets:{left:0,right:0}});
 
var section = Ti.UI.createListSection();
 
var data = [
    {properties: { title: 'ONE'}},
    {properties: { title: 'TWO'}},
    {properties: { title: 'THREE'}},
    {properties: { title: 'FOUR'}}
];
section.setItems(data);
listView.sections = [section];
 
win.add(listView);

var nav = Ti.UI.iOS.createNavigationWindow({
    window:win
});
 
nav.open();

2. Run it on iOS 8 & iOS 7 device & notice the difference.

Actual Result:

1. Separator Insets values should be respected on the side of the title/data if the listview row contains a title/data e.g ONE,TWO,THREE,FOUR. NOTE: Refer screenshots for reference.

Expected Result:

1. Separator Insets values are not respected on the side of the title/data if the listview row contains a titledata

Attachments

File	Date	Size
iOS_7.1_seperatorinset[0,0].png	2014-09-10T23:01:05.000+0000	91215
iOS_8.0_seperatorinset[0,0].png	2014-09-10T23:01:05.000+0000	52645

Comments

Muhammad Dadu 2014-09-16

Pull request: https://github.com/appcelerator/titanium_mobile/pull/6091 In iOS 8, there is one new property for all the objects inherit from UIView., which is called "layoutMargins". The solution to set the separatorInset in iOS 7 would not be able to remove the white space you see on the UITableView in iOS 8.
Chris Bowley 2014-09-16

This also affects TableView separatorInsets - has the same change been made to the TableView?
Vishal Duggal 2014-10-03

Backport to 3_4_X https://github.com/appcelerator/titanium_mobile/pull/6198
Ewan Harris 2014-10-03

Verified fix on: Mac OSX 10.9.5 Appcelerator Studio, build: 3.4.0.201409261245 Titanium SDK build: 3.5.0.v20141003114918, 3.4.1.v20141003114920 Titanium CLI, build: 3.4.0 Alloy: 1.5.1 Xcode: 6.1 GM Seed iPhone 6 Plus (8.0.2) Using the code above, the separator inset values are now respected and there is no whitespace on the separator. Closing ticket.
Olga Romero 2014-10-03

Tested and verified separators are touching the edge. Mac osx 10.9.5 Mavericks Appcelerator Studio, build: 3.4.0.201409261245 Titanium SDK, build: 3.4.1.v20141003114920 acs@1.0.18 alloy 1.5.1 install@0.1.7 npm@1.4.23 sudo@1.0.3 titanium 3.4.0 titanium-code-processor@1.1.1 Xcode6.1GM Device: iPhone6 iOS 8.1
Ivan Skugor 2014-10-07
Dan Tamas 2014-11-24

This is not fixed. I tested with ti sdk 3.4.0 and 3.4.1 and the same occurs.

Dan Tamas 2014-11-24

I don't seem to be able to attach a file anymore, here is the app.js

   var win = Ti.UI.createWindow({backgroundColor: 'white'});
   var listView = Ti.UI.createListView({
   	top:20,
   	separatorInsets: {
   		left:0,
   		right:0
   	}
   });
   var sections = [];
   
   var fruitSection = Ti.UI.createListSection({ headerTitle: 'Fruits'});
   var fruitDataSet = [
       {properties: { title: 'Apple'}},
       {properties: { title: 'Banana'}},
   ];
   fruitSection.setItems(fruitDataSet);
   sections.push(fruitSection);
   
   var vegSection = Ti.UI.createListSection({ headerTitle: 'Vegetables'});
   var vegDataSet = [
       {properties: { title: 'Carrots'}},
       {properties: { title: 'Potatoes'}},
   ];
   vegSection.setItems(vegDataSet);
   sections.push(vegSection);
   
   listView.sections = sections;
   win.add(listView);
   win.open();
   
   var fishSection = Ti.UI.createListSection({ headerTitle: 'Fish'});
   var fishDataSet = [
       {properties: { title: 'Cod'}},
       {properties: { title: 'Haddock'}},
   ];
   fishSection.setItems(fishDataSet);
   listView.appendSection(fishSection);

And the screenshot https://www.dropbox.com/s/sy7psmk4eu7x8ry/iOS%20Simulator%20Screen%20Shot%2024%20Nov%202014%2018.48.07.png?dl=0

Hans Knöchel 2014-11-24

@Dan: The fixes is merged in the 3.4.2+ releases.
Dan Tamas 2014-11-24

@Hans, I'm an idiot, thank you :)

JSON Source