[TIMOB-1738] Grouped Table does not honor background color of the table view

GitHub Issue	n/a
Type	Bug
Priority	Low
Status	Closed
Resolution	Fixed
Resolution Date	2011-04-17T01:57:01.000+0000
Affected Version/s	n/a
Fix Version/s	Release 1.6.0 M07
Components	iOS
Labels	apple, bug, defect, ios, ipad, release-1.6.0, tableview
Reporter	ctredway
Assignee	Blain Hamon
Created	2011-04-15T03:00:56.000+0000
Updated	2011-04-17T01:57:01.000+0000

Description

On 3.2 the grouped table view does not honor background color property. The Rows will change color but the background around the view always stays gray.

var win = Ti.UI.currentWindow;
win.backgroundColor = '#FFF';

var data = [];

for (var c=0;c<4;c++)
{

data[c] = Ti.UI.createTableViewSection({headerTitle:'Group '+(c+1)});
for (var x=0;x<10;x++)
{
    data[c].add(Ti.UI.createTableViewRow({title:'Group '+(c+1)+', Row '+(x+1),backgroundColor:'#FF0000'}));
}

}

// create table view var tableview = Titanium.UI.createTableView({

data:data,
style: Titanium.UI.iPhone.TableViewStyle.GROUPED,
backgroundColor:'transparent'

});

// create table view event listener tableview.addEventListener('click', function(e)
{

// event data
var index = e.index;
var section = e.section;
var row = e.row;
var rowdata = e.rowData;
if (section.headerTitle.indexOf('clicked')==-1)
{
    section.headerTitle = section.headerTitle + ' (clicked)';
}
Titanium.UI.createAlertDialog({title:'Table View',message:'row ' + row + ' index ' + index + ' section ' + section  + ' row data ' + rowdata}).show();

});

// add table view to the window Titanium.UI.currentWindow.add(tableview);

Comments

Adriano Paladini 2011-04-15

I found a solution to make the 'backgroundColor' works in TableViewStyle.GROUPED.
This solution will set the tableview default backgroundColor to 'transparent', and will correct ANY color applied to it.

I Tested this with successful in 1.4.2 and 1.5.0

If you want correct only for your project:

Open in your project folder 'build\iphone\Classes\TiUITableView.m'

If you want correct all projects:

Open '\Library\Application Support\Titanium\MobileSDK\osx\1.X.X\iphone\Classes\TiUITableView.m' *On 1.X.X is the version do you work.

Find these lines:

   
       tableview.backgroundColor = style == UITableViewStylePlain ? [UIColor whiteColor] : [UIColor groupTableViewBackgroundColor];
       tableview.opaque = YES;

and change to this code:

   
       //tableview.backgroundColor = style == UITableViewStylePlain ? [UIColor whiteColor] : [UIColor groupTableViewBackgroundColor];
       //tableview.opaque = YES;
   
       // CORRECTION FOR TRANSPARENT TABLEVIEW
       if (style != UITableViewStylePlain)
       {
           UIView *myBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [self bounds].size.width, [self bounds].size.height)];
           id BgColor = [self valueForKey:@"backgroundColor"];
           if (BgColor!=nil)
           {
               myBackgroundView.backgroundColor = [Webcolor webColorNamed:BgColor];
           }
           else
           {
               myBackgroundView.backgroundColor = [UIColor clearColor];
           }
           tableview.backgroundView = myBackgroundView;
       }
       // CORRECTION FOR TRANSPARENT TABLEVIEW

James K 2011-04-15

Adriano, does that introduce a memory leak? I see an alloc without a release.

Adriano Paladini 2011-04-15

Ops, sorry James K, you right!

chage this:

   UIView *myBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [self bounds].size.width, [self bounds].size.height)];

to this:

   UIView *myBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [self bounds].size.width, [self bounds].size.height) autorelease];

Sorry for that!

Adriano Paladini 2011-04-15

SORRY again.....

i forgot the brackets....

Correct (and tested) code:

   
           //tableview.backgroundColor = style == UITableViewStylePlain ? [UIColor whiteColor] : [UIColor groupTableViewBackgroundColor];
           //tableview.opaque = YES;
           
           // CORRECTION FOR TRANSPARENT TABLEVIEW
           if (style != UITableViewStylePlain)
           {
               UIView *myBackgroundView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, [self bounds].size.width, [self bounds].size.height)] autorelease];
               id BgColor = [self valueForKey:@"backgroundColor"];
               if (BgColor!=nil)
               {
                   myBackgroundView.backgroundColor = [Webcolor webColorNamed:BgColor];
               }
               else
               {
                   myBackgroundView.backgroundColor = [UIColor clearColor];
               }
               tableview.backgroundView = myBackgroundView;
           }
           // CORRECTION FOR TRANSPARENT TABLEVIEW

Jeff Haynie 2011-04-15

(from [1b85b06736303aede99672606c5e72319a2ff8dc]) [#1738 state:fixed-in-qa] Respect tableview BG color on creation, and only opaque out if not clear. https://github.com/appcelerator/titanium_mobile/commit/1b85b06736303aede99672606c5e72319a2ff8dc"> https://github.com/appcelerator/titanium_mobile/commit/1b85b0673630...

Pedro Enrique 2011-04-15

Tested this code on iPad simulator and iPad, iOS 4.2

   var win = Ti.UI.createWindow({backgroundColor:'green'});
   var data = [];
   for(var i=0;i<10;i++){
       data[i] = Ti.UI.createTableViewRow({title:'Row #'+i});
   }
   var tableview = Ti.UI.createTableView({
       data:data,
       style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
       backgrounColor:'#5A9ECF'
   });
   win.add(tableview);
   win.open();

Problem persists.

Ti. SDK 1.6 (Jan 25 2011 17:39 r1ead074f)

Adriano Paladini 2011-04-15

In this new version made the correction as follows:

after this line:

   tableview.opaque = ![tableview.backgroundColor isEqual:[UIColor clearColor]];

I added:

   // CORRECTION FOR TRANSPARENT/COLOR BACKGROUND IN TABLEVIEW ON IPAD
   if(style != UITableViewStylePlain  && [TiUtils isIPad])
   {
       UIView *myBackgroundView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, [self bounds].size.width, [self bounds].size.height)] autorelease];
       myBackgroundView.backgroundColor = bgColor != nil ? bgColor : [UIColor clearColor];
       tableview.backgroundView = myBackgroundView;
   }
   // CORRECTION FOR TRANSPARENT/COLOR BACKGROUND IN TABLEVIEW ON IPAD

Stephen Tramer 2011-04-15

Example provided works as expected when backgroundColor doesn't contain a typo:

   var win = Ti.UI.createWindow({backgroundColor:'green'});
   var data = [];
   for(var i=0;i<10;i++){
       data[i] = Ti.UI.createTableViewRow({title:'Row #'+i});
   }
   var tableview = Ti.UI.createTableView({
       data:data,
       style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
       backgroundColor:'#5A9ECF'
   });
   win.add(tableview);
   win.open();

If table rows adopting table background color/using UIClearColor is considered a bug and NOT expected behavior (i.e. this is not what Android does), that is a separate bug and this ticket should not be reopened.

Pedro Enrique 2011-04-15
Stephen,
Don't know if I'm testing this the wrong way, but I can't change the background of the tableview itself. This is the new code
```
   var win = Ti.UI.createWindow({backgroundColor:'green'});
   var data = [];
   for(var i=0;i<10;i++){
       data[i] = Ti.UI.createTableViewRow({title:'Row #'+i,backgroundColor:'yellow'});
   }
   var tableview = Ti.UI.createTableView({
       data:data,
       style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
       backgroundColor:'#000'
   });
   win.add(tableview);
   win.open();
   
```
I'm setting the background of the tableView black and the rows yellow. The background of the tableView does not change, even if I remove the background color of the rows.

And sorry for the typo, oops.

Ti SDK 1.6 (Jan 26 2011 14:27 r6342c788)
TiDev 1.2 and 1.3
iPad Simulator 4.2
Stephen Tramer 2011-04-15

OK, this works on iPhone (what I fixed the bug for) but not iPad. Reopening.
Jeff Haynie 2011-04-15

(from [5cc2ed4bdf5fcd57edfd6c86d0e3201bfb1d5997]) [#1738 state:fixed-in-qa] Fixed for iPad as well - there's an iPad-specific apple bug that screws up tableview background colors. Probably also affects BG images. https://github.com/appcelerator/titanium_mobile/commit/5cc2ed4bdf5fcd57edfd6c86d0e3201bfb1d5997"> https://github.com/appcelerator/titanium_mobile/commit/5cc2ed4bdf5f...
Stephen Tramer 2011-04-15

Confirmed that this is an apple bug. It's less than ideal, but I've added in the proposed solution of just outright replacing the background view in the case of iPad.

Radar bug # is 8921858.
Pedro Enrique 2011-04-15

Yes!

Now it works as expected.

Ti. SDK 1.6 (Jan 26 2011 16:47 rb481fe0b)
iPad Simulator 4.2
Ti. Dev. 1.3
Marko Perutovic 2011-04-15

Border color is transparent
Rick Blalock 2011-04-15

I just tested what Marko is referring. Only on iPad a grouped view's border is semi-transparent. Workaround is to explicitly set the separatorColor to the tableView object.

He's attached two images here to give an example: http://developer.appcelerator.com/helpdesk/view/66191#c324451">http://developer.appcelerator.com/helpdesk/view/66191#c324451

JSON Source