[TIMOB-16337] iOS7: ListView: BackgroundColor not working properly

GitHub Issue	n/a
Type	Bug
Priority	Medium
Status	Closed
Resolution	Invalid
Resolution Date	2014-01-31T21:48:22.000+0000
Affected Version/s	Release 3.2.1
Fix Version/s	n/a
Components	iOS
Labels	ipass1, qe-3.2.1
Reporter	Priya Agarwal
Assignee	Ingo Muschenetz
Created	2014-01-29T08:24:16.000+0000
Updated	2017-03-29T21:36:34.000+0000

Description

There is different behavior for setting of BackgroundColor for listView on iOS6 and iOS7 Versions. This is not a regression. Since issue occurs on 3.2.0.GA also. Steps to reproduce: 1.Install KS and run. 2.Go to BaseUI>View>ListView>Basic Functions> Background Colors & Scroll Indicator 3. Click on the 'next' button Expected Result: 2. A new window should get displayed with 'ScrollIndicator=true'. The first listitem in the listview 'My background is yellow' should have a yellow background.The listview should have 100 listitems and no background. 3. The background of listview turns red(its plain and not grouped).Listitem with yellow background remains yellow.'ScrollIndicator=false' Actual Result: 3.The background of listview does not turns red. Please refer to screenshots attached for both iOS6 and iOS7 version(theres is difference in behavior).

Attachments

File	Date	Size
ios6.png	2014-01-29T08:24:16.000+0000	91473
ios7.png	2014-01-29T08:24:16.000+0000	73602

Comments

Sabil Rahim 2014-01-31

This is just iOS 7 behavior difference, by default on iOS 7 the background color of rows is white and on iOS 6 this is transparent. So if you set a background color on the listview on iOS 7 this would only be applied to the listview background itself and not on the row. if you explicitly set the backgroundColor to transparent the listview backgroundColor can be seen. You can see the behavior in the following code.

   var win = Ti.UI.createWindow({backgroundColor: 'white'});
   var listView = Ti.UI.createListView();
   var sections = [];
   listView.backgroundColor = 'blue';
   var fruitSection = Ti.UI.createListSection({ headerTitle: 'Fruits'});
   var fruitDataSet = [
       {properties: { title: 'Apple',backgroundColor: 'transparent'}},
       {properties: { title: 'Banana' ,backgroundColor: 'transparent'}}
   ];
   fruitSection.setItems(fruitDataSet);
   sections.push(fruitSection);
   
   var vegSection = Ti.UI.createListSection({ headerTitle: 'Vegetables'});
   var vegDataSet = [
       {properties: { title: 'Carrots',backgroundColor: 'red'}},
       {properties: { title: 'Potatoes',backgroundColor: 'yellow'}},
   ];
   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);

Vincent Jousse 2014-02-06

Is there a way to keep the item background color when an item is selected (for exemple red for carrots) ?
Lee Morris 2017-03-29

Closing ticket as invalid.

JSON Source