Some favorite site feeds aggregated locally: iPhone Development RSS   Adobe Labs RSS   Macrumors RSS

Tuesday, May 12, 2009

iPhone: UITableView customization

Tuesday, May 12, 2009   

I have a UITableView where I am providing my own graphics for the normal and selected states. Because my graphic for the selected state is dark, the dark text in my UILabels in each cell needs to turn to white for legibility. Then of course it needs to be reset afterwards to black on the normal graphic.

After spending a lot of time on forums, Google, and email lists, I have a solution that should have been easier to get to. I received suggestions that I keep a pointer around for the previously selected item, so when a selection is detected I could introspect the current cell, change the text color there, and then change the previous cell's UILabels back to normal. A lot of work, and it's keeping state which is a bad idea. There were mentions of reloadData for the table, etc.

However one thing I overlooked initially was that I was thinking of the table cell as retaining it's selected state. Normally you'd just call up another view from a selection in a table. So I didn't really need to maintain the selected visual state in the table, but I needed to show it to the user.

A fine chap from Apple emailed me that most iPhone applications implement a nice animation for selected cells in a table and that I should follow that paradigm. So that got me digging.
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
[tableView deselectRowAtIndexPath:indexPath animated:YES];
//NSLog(@"%d:%d", [indexPath row], [indexPath section] );
// Need to get to the cell
UITableViewCell *newCell = [tableView cellForRowAtIndexPath:indexPath];
UILabel *cellLabel = (UILabel *)[newCell.contentView viewWithTag:1];
NSLog( @"%@", [cellLabel text] );
}
That bit of animation basically tells the table to deselect the selected item with animation. This works great but it doesn't reset the text color in the cell itself. That's when I stumbled onto the holy grail solution for me being able to reset the text without having to dig into the cell itself or keep a pointer around for the previous selected cell. It was simple using a property I hadn't run into yet before so I didn't know of it's existence... highlightedTextColor. DOH! That was it!

So pairing the above method with this detail in my cellForRowAtIndexPath, I get exactly what I needed:
...
labelThree = [[[UILabel alloc] initWithFrame:CGRectMake( 65, 34, 200, 25)] autorelease];
labelThree.tag = 3;
labelThree.font = [UIFont systemFontOfSize:10.0];
labelThree.backgroundColor = [UIColor clearColor];
labelThree.textColor = UIColorFromRGB(0x555555);
labelThree.highlightedTextColor = [UIColor whiteColor]; // Why didn't I know about this!!!
labelThree.text = [NSString stringWithFormat:@"%@", [[photoArray objectAtIndex:row] objectForKey:@"rating"]];
...
I set the text color (using a macro) and also the highlighted text color. So what happens is that the background transitions to my dark selected graphic while the text turns white, and upon deselection the text returns back to that 0x555555 color while the dark selected graphic fades away leaving the normal graphic for the cell.

This works perfectly without me keeping state myself anywhere... let the APIs handle all of that crap for me. I burned a whole day on this simple thing, but it takes moments like these to really understand and learn (in my opinion).

Labels: , ,

 
 Return to the main page
Comments:

There are currently 1 Comments:

Blogger adeem said...
“Check out complete list of UITableViewTutorials here[http://adeem.me/blog/2009/05/19/iphone-sdk-tutorial-complete-list-of-uitableview-tutorials-videos/]
-
Adeem Basraa
http://adeem.me/blog”
 
 Leave a comment