How do I change the color of the side Alphabet in an indexed UITableView?

This can be easily changed in the interface builder for the UITableView - No need to use undocumented classes?

See screenshot below, as you can see the font colour and the background colour can be changed too. Job's a good'n!


if your minimum iOS version is newer than 6.0, you can use sectionIndexColor property of UITableView.

The color to use for the table view’s index text.

@property(nonatomic, retain) UIColor *sectionIndexColor

Discussion:

Table views can display an index along the side of the view, making it easier for users to navigate the contents of the table quickly. This property specifies the color to use for text displayed in this region.


Update date 2014.1.13

I find an open source third party library:GDIIndexBar to help custom the index appearance.


From what I can tell unfortunately it is not possible to customize the color of the text displayed in the index, the closest I've been able to come is being able to modify the background color and the font of the index.

There is some code in the iPhone Developers cookbook by Erica Sadun which shows how to access the UITableViewIndex view (an undocumented class). You can find the reference to it on page 175 of the book if you have it. Which gives access to the background color and the font. You can see an unofficial document related to this class here.

WARNING This is undocumented use of an undocumented class so you need to be cautious about using it.

Here is a code snippet from the cookbook with minor modifications:

- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath {    

  for(UIView *view in [tv subviews])
  {
    if([[[view class] description] isEqualToString:@"UITableViewIndex"])
    {

      [view setBackgroundColor:[UIColor whiteColor]];
      [view setFont:[UIFont systemFontOfSize:14]];
    }
  }

  //rest of cellForRow handling...

} 

This illustrates how you can access and the UITableViewIndex view and modify it in some aspects. It looks like the view doesn't have any subviews so it is likely doing some custom drawing with the array of index titles.

It's not perfect but hopefully it helps a little.

Paul