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

Question

I have a table view with an alphabetical index and am using the side alphabet to get through the list quickly. For those not familiar, that uses this:

- (NSInteger)tableView:(UITableView *)tableView sectionForSectionIndexTitle:(NSString *)title atIndex:(NSInteger)index {

My problem is that my application has just been skinned black. And so now it's hard to see the alphabet letters on the side.

I can't figure out how to change the color of the alphabet. I'd like it to be 'white' if at all possible.

Answer 1

Hi cmos,

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

Answer 2

Make a mutable array to contain the alternate title labels
In "- (NSArray * )sectionIndexTitlesForTableView:(UITableView * )tableView"
return an array of @" " where the number of spaces between the quotes determines the width of the hi-lighted scroller.
Have "sectionIndexTitlesForTableView" call an update label function.
In that function remove all the labels in the array you created earlier from their superviews
Then create and add however many labels are needed. Then add them to the table's superview.
These are the lines required to place the labels in the right place.
rect.origin.x=table.frame.origin.x+table.frame.size.width-rect.size.width-2;
rect.origin.y=5+table.frame.origin.y+counter *(280-rect.size.height-([customIndexLabels count]-1))/([customIndexLabels count]-1);
if ([customIndexLabels lastObject]==thisLabel) { rect.origin.y-=10; }
Hope that helps. It's not perfect I just don't care enough to fix it myself :)
The main problem is that the spacing of the last label is not uniform.