关于分割线的那些事

历史

  • iOS7之前,系统默认情况下的tableViewCell之间的分割线是左右两端与屏幕边缘之间是没有空隙的(分割线两边没有留空白)。

  • iOS7开始,默认情况的分割线右移15像素点,如图:


    关于分割线的那些事_第1张图片
    iOS7分割线变化.png
  • 到了iOS8,苹果对分割线又做出了变化,给分割线两边到屏幕边缘之间添加边缘约束margin,如图:


    关于分割线的那些事_第2张图片
    iOS8分割线变化.png

系统的分割线样式

  • 在UITableView类中,提供了一个接口属性,可以让我们修改分割线的样式(__TVOS_PROHIBITED表示该属性tvOS不可用,iOS开发可以忽略该宏):
@property (nonatomic) UITableViewCellSeparatorStyle separatorStyle __TVOS_PROHIBITED; 
// default is UITableViewCellSeparatorStyleSingleLine 默认情况下,分割线样式为单条直线
  • 该属性其实是一个枚举类型,通过该枚举就可以指定分割线的样式
typedef NS_ENUM(NSInteger, UITableViewCellSeparatorStyle) {
    UITableViewCellSeparatorStyleNone,
    UITableViewCellSeparatorStyleSingleLine,
    UITableViewCellSeparatorStyleSingleLineEtched   // This separator style is only supported for grouped style table views currently (带浮雕效果的线条,只支持grouped风格的tableView)
} __TVOS_PROHIBITED;
  • UITableView还提供了诸如separatorColor、separatorEffect的属性供我们去设置系统提供的分割线,大家有兴趣可以自己研究一下。

全屏分割线

在开发当中,有时候需要使用全屏的tableView分割线,这时可以有三种方式去做:

  • 方式一:自定义分割线
    • 设置tableView的separatorStyle属性
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
- 在cell的底部添加一个高度为1的自定义UIView
  • 方式二:设置tableView属性
    • 设置tableView和tableViewCell的属性
// 设置tableView的分割线内边距为0
self.tableView.separatorInset = UIEdgeInsetsZero; 
// 设置tableViewCell的边距为0(iOS8新特性,需要加入iOS8以上的版本才调用的判断)
cell.layoutMargins = UIEdgeInsetsZero
  • 方式三:重写cell的setFrame
    • 首先普及一下tableViewCell尺寸设置的底层实现逻辑
      • cell的位置尺寸谁计算:tableView
      • cell的位置尺寸什么时候计算:一开始就会把所有cell的位置全部计算好,并保持在一个数组里,最终调用setFrame方法设置每个cell的位置尺寸cell.frame = self.frames[i]
    • 了解底层实现逻辑之后,解决方案也就出来了:
      方案思路:通过重写cell的setFrame方法,使cell的高度减少一个像素点,这样cell与cell之间就会有1个像素点的空隙,空隙显示的是tableView的背景颜色,此时设置该背景颜色就可以达到全屏分割线的效果
      1. 取消系统的分割线
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
    2. 设置tableView背景色为分割线的颜色
self.tableView.backgroundColor = [UIColor redColor];   // 该颜色将显示为分割线的颜色
    3. 重写cell的setFrame方法,将传入的参数frame中的height减1
 - (void)setFrame:(CGRect)frame
{
    CGRect tempRect = frame;
    tempRect.size.height -= 1;
    [super setFrame:tempRect];   // 恢复系统默认做法,传入的值为改变之后的frame
}

你可能感兴趣的:(关于分割线的那些事)