Skip to content
Customize table view cell border and highlights
Pull request Compare This branch is 2 commits behind honcheng:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
Screenshots
StyledTableViewCell
StyledTableViewCellDemo
LICENSE
README.md

README.md

StyledTableViewCell for iOS

Customize table view cell border and highlight colors.
Only supports UITableViewStylePlain

Features

  • Custom highlight colors for table view cells
  • Highlights supports gradient of multiple colors and directions

Usage

1) Subclass StyledTableViewCell

2) Set UITableView separator to none to hide the default separator

[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];

3) Use setDashWidth:dashGap:dashStroke: to configure custom cell separators

e.g. dashes for separators

[self setDashWidth:5 dashGap:3 dashStroke:1];

e.g. dotted-lines for separators

[self setDashWidth:1 dashGap:3 dashStroke:1];

4) Set UITableView separator color to set the custom separator color

[self.tableView setSeparatorColor:[UIColor colorWithWhite:0.7 alpha:1]];

5) Use setStyledTableViewCellSelectionStyle: to set background colors of cell when selected, using preset colors

[self setStyledTableViewCellSelectionStyle:StyledTableViewCellSelectionStylePurple];

6) Use setSelectedBackgroundGradientColors: to set background colors of cell when selected, using custom gradients

e.g. gradient of 2 colors

NSMutableArray *colors = [NSMutableArray array];
[colors addObject:(id)[[UIColor colorWithRed:255/255.0 green:234/255.0 blue:0 alpha:1] CGColor]];
[colors addObject:(id)[[UIColor colorWithRed:255/255.0 green:174/255.0 blue:0 alpha:1] CGColor]];
[self setSelectedBackgroundViewGradientColors:colors];

e.g. gradient of 3 colors

NSMutableArray *colors = [NSMutableArray array];
[colors addObject:(id)[[UIColor colorWithRed:255/255.0 green:174/255.0 blue:0 alpha:1] CGColor]];
[colors addObject:(id)[[UIColor colorWithRed:255/255.0 green:234/255.0 blue:0 alpha:1] CGColor]];
[colors addObject:(id)[[UIColor colorWithRed:255/255.0 green:174/255.0 blue:0 alpha:1] CGColor]];
[self setSelectedBackgroundViewGradientColors:colors];

7) Use setSelectionGradientDirection: to set direction of gradient when cell is selected

e.g. horizontal gradient

[self setSelectionGradientDirection:StyledTableViewCellSelectionGradientDirectionHorizontal];

e.g. diagonally from bottom left to top right

[self setSelectionGradientDirection:StyledTableViewCellSelectionGradientDirectionDiagonalBottomLeftToTopRight];

e.g. diagonally from top left to bottom right

[self setSelectionGradientDirection:StyledTableViewCellSelectionGradientDirectionDiagonalTopLeftToBottomRight];

Supports

Only supports UITableViewStylePlain.

Requirements

  • QuartzCore framework
  • This project uses ARC. If you are not using ARC in your project, add '-fobjc-arc' as a compiler flag for all the files in this project.
  • XCode 4.4 and newer (auto-synthesis required)

Contact

twitter.com/honcheng
honcheng.com

Something went wrong with that request. Please try again.