PrettyTableViewCell Class Reference
Inherits from | UITableViewCell |
Declared in | PrettyTableViewCell.h |
Overview
PrettyTableViewCell
is a subclass of UITableViewCell
, so it
is fully compatible with any UITableView
.
PrettyTableViewCell
adds a set of customizations such as corner radius,
shadow, background gradient, selection gradient customization…
It only uses CoreGraphics
under the hood, so you can expect a nice
performance.
Using it
In your dataSource
tableView:cellForRowAtIndexPath:
body, change all
references to UITableViewCell
to PrettyTableViewCell
, and add this call:
[cell prepareForTableView:tableView indexPath:indexPath];
Just by doing that you’ll have a nice cell, like the cells below:
Customizing appearance
PrettyCells are compatible with both grouped and plain tables.
Grouped tables
You can change the cell’s appearance as follows:
- cell’s shadow (border will be disabled when the shadow is enabled).
- cell’s background color or gradient.
- cell’s border color (border will be disabled when the shadow is enabled).
- cell’s corner radius.
- cell’s separator.
- cell’s selection gradient.
Plain tables
You can change the cell’s appearance as follows:
- cell’s background color or gradient.
- cell’s separator.
- cell’s selection gradient.
Performance
It only uses CoreGraphics
under the hood, so you can expect a nice
performance.
Anyway, you should select the Color Blended Layers option and check how it looks.
Furthermore, to even reduce more the transparent regions, you can set the
tableViewBackgroundColor
property to the table’s background color
(tableView.backgroundColor
).
Be aware that although the cell is drawn with CoreGraphics, its contents might not. In fact, if you use the properties textLabel, detailTextLabel and so, the performance will be limited by them. So if you need to improve it, take a look at this Twitter article: http://engineering.twitter.com/2012/02/simple-strategies-for-smooth-animation.html and draw the contents by yourself.
Tasks
Customizing appearance
-
dropsShadow
Indicates if the cell should drop a shadow or not.
property -
shadowOpacity
Indicates the shadow opacity to use.
property -
customBackgroundColor
Specifies the background color to use.
property -
gradientStartColor
Specifies the background gradient start color to use.
property -
gradientEndColor
Specifies the background gradient end color to use.
property -
borderColor
Specifies the color used for the cell’s border.
property -
cornerRadius
Specifies the radio used for the cell’s corners.
property -
tableViewBackgroundColor
Specifies the color used for the tableView’s background.
property -
showsCustomSeparator
Specifies if a custom separator should be drawn.
property -
customSeparatorColor
Specifies the color used for the cell’s separator line.
property -
selectionGradientStartColor
Specifies the start color for the selection gradient.
property -
selectionGradientEndColor
Specifies the end color for the selection gradient.
property
Cell configuration
-
– prepareForTableView:indexPath:
Tells the cell how it should draw the background shape.
-
+ tableView:neededHeightForIndexPath:
Returns the needed height for a cell placed in the given indexPath.
Cell status
-
position
Sets the cell’s position to help the background drawing.
property -
innerFrame
Returns the shadows' innerFrame.
property -
mask
Returns a mask with the rounded corners.
property -
– createSelectionGradient
Returns a new gradient with the configured selection gradient colors.
-
– createNormalGradient
Returns a new gradient with the configured normal gradient colors.
Properties
borderColor
Specifies the color used for the cell’s border.
@property (nonatomic, retain) UIColor *borderColor
Discussion
If dropsShadow is set to YES
, borderColor will be ignored. This property
has a gray color by default.
Declared In
PrettyTableViewCell.h
cornerRadius
Specifies the radio used for the cell’s corners.
@property (nonatomic, assign) float cornerRadius
Discussion
By default it is set to 10.
Declared In
PrettyTableViewCell.h
customBackgroundColor
Specifies the background color to use.
@property (nonatomic, retain) UIColor *customBackgroundColor
Discussion
By default is set to nil
, so the background color will be the UITableViewCell’s
backgroundColor
property.
Change this property to override the background color in plain table views.
Declared In
PrettyTableViewCell.h
customSeparatorColor
Specifies the color used for the cell’s separator line.
@property (nonatomic, retain) UIColor *customSeparatorColor
Discussion
This property has a light gray color by default.
Declared In
PrettyTableViewCell.h
dropsShadow
Indicates if the cell should drop a shadow or not.
@property (nonatomic, assign) BOOL dropsShadow
Discussion
Its value is YES by default.
Declared In
PrettyTableViewCell.h
gradientEndColor
Specifies the background gradient end color to use.
@property (nonatomic, retain) UIColor *gradientEndColor
Declared In
PrettyTableViewCell.h
gradientStartColor
Specifies the background gradient start color to use.
@property (nonatomic, retain) UIColor *gradientStartColor
Declared In
PrettyTableViewCell.h
innerFrame
Returns the shadows' innerFrame.
@property (nonatomic, readonly) CGRect innerFrame
Declared In
PrettyTableViewCell.h
mask
Returns a mask with the rounded corners.
@property (nonatomic, readonly) CAShapeLayer *mask
Declared In
PrettyTableViewCell.h
position
Sets the cell’s position to help the background drawing.
@property (nonatomic, assign) PrettyTableViewCellPosition position
Discussion
You can change this property manually, but you should preferably use
prepareForTableView:indexPath:
instead.
Possible values are:
– PrettyTableViewCellPositionTop
– PrettyTableViewCellPositionMiddle
– PrettyTableViewCellPositionBottom
– PrettyTableViewCellPositionAlone
Declared In
PrettyTableViewCell.h
selectionGradientEndColor
Specifies the end color for the selection gradient.
@property (nonatomic, retain) UIColor *selectionGradientEndColor
Discussion
This property has a blue color by default.
If UITableViewCell’s selectionStyle
property is set to
UITableViewCellSelectionStyleNone
, no gradient will be shown.
Declared In
PrettyTableViewCell.h
selectionGradientStartColor
Specifies the start color for the selection gradient.
@property (nonatomic, retain) UIColor *selectionGradientStartColor
Discussion
This property has a blue color by default.
If UITableViewCell’s selectionStyle
property is set to
UITableViewCellSelectionStyleNone
, no gradient will be shown.
Declared In
PrettyTableViewCell.h
shadowOpacity
Indicates the shadow opacity to use.
@property (nonatomic, assign) float shadowOpacity
Discussion
Its value is 0.7 by default.
Declared In
PrettyTableViewCell.h
Class Methods
tableView:neededHeightForIndexPath:
Returns the needed height for a cell placed in the given indexPath.
+ (CGFloat)tableView:(UITableView *)tableView neededHeightForIndexPath:(NSIndexPath *)indexPath
Discussion
You should always implement tableView:heightForRowAtIndexPath:
method of
your tableView’s delegate. Inside get your cell’s normal height, add the
result of calling tableView:neededHeightForIndexPath:
and return the resulting
value.
You should always add the result of calling it, even if you set dropShadow property to NO.
Declared In
PrettyTableViewCell.h
Instance Methods
createNormalGradient
Returns a new gradient with the configured normal gradient colors.
- (CGGradientRef)createNormalGradient
Discussion
You don’t have to release it after using it.
Declared In
PrettyTableViewCell.h
createSelectionGradient
Returns a new gradient with the configured selection gradient colors.
- (CGGradientRef)createSelectionGradient
Discussion
You don’t have to release it after using it.
Declared In
PrettyTableViewCell.h
prepareForTableView:indexPath:
Tells the cell how it should draw the background shape.
- (void)prepareForTableView:(UITableView *)tableView indexPath:(NSIndexPath *)indexPath
Discussion
This call is mandatory. Include it in your tableView dataSource’s
tableView:cellForRowAtIndexPath:
.
Declared In
PrettyTableViewCell.h