如果是切4个圆角,下面的方法很实用
view.layer.cornerRadius = 6;
view.clipToBounds = YES;
但遇到下图这种需求(第一个Cell顶部切圆角、最后一个Cell底部切圆角,中间的Cell无圆角),实现起来会很繁杂
切圆角
上图中每一行是一个cell。
如果用上述方法实现,恐怕第一个cell和最后一个cell要添加一个View遮盖多余的圆角!
偶然看见别人用了BezierPath做,才想到原来BezierPath可以用来处理这种情况。
MyCell.h
@interface MyCell : UITableViewCell
@property (weak, nonatomic) IBOutlet UIView *customView;
.
.
@property (weak, nonatomic) IBOutlet UIView *separator; //自定义分割线
@property (nonatomic, strong) NSDictionary *dataDic;
@property (nonatomic, assign) BOOL showSeparator;
@property (nonatomic, assign) CGFloat rowHeight; //默认高度70,如需传入,必须在roundCorners前赋值
@property (nonatomic, assign) CGSize cornerSize; //默认高度[10,10],如需传入,必须在roundCorners前赋值
@property (nonatomic, assign) UIRectCorner roundCorners; //圆角
@end
MyCell.m
- (void)setShowSeparator:(BOOL)showSeparator {//是否显示分割线
_showSeparator = showSeparator;
_separator.hidden = !showSeparator;
}
//roundCorners可以自由指定左上、左下、右上、右下圆角的任意组合
- (void)setRoundCorners:(UIRectCorner)roundCorners {
_roundCorners = roundCorners;
if (roundCorners == 0) {
_customView.layer.mask = nil;//无圆角
}else {
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, ScreenWidth-20, _rowHeight) byRoundingCorners:roundCorners cornerRadii:_cornerSize];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = CGRectMake(0, 0, ScreenWidth-20, _rowHeight);
maskLayer.path = maskPath.CGPath;
_customView.layer.mask = maskLayer;
}
}
MyCell.xib
红框是customView,红框底部是分割线separator(有缩进)
Cell
ViewController中datasource内的用法
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
MyCell *cell = [tableView dequeueReusableCellWithIdentifier:_cellID];
UIRectCorner corners = 0; //初始化为0,任何数跟0进行或运算等于它本身。
BOOL isFirstRow = (indexPath.row == 0);
BOOL isLastRow = (indexPath.row == self.datasArray.count - 1);
if (isFirstRow) {
corners = corners | UIRectCornerTopLeft | UIRectCornerTopRight;//添加左上、右上圆角
}
if (isLastRow) {
corners = corners | UIRectCornerBottomLeft | UIRectCornerBottomRight;//添加左下、右下圆角
}
cell.roundCorners = corners;
cell.showSeparator = !isLastRow;
cell.dataDic = self.datasArray[indexPath.row];
return cell;
}
Warning:后来看了其他一些资料,说
尤其是在复用的Cell上!不管是通过layer.cornerRadius还是layer.mask = aLaer。如果你cell切了圆角,滚动的时候发现卡顿,那十之八九就是这个原因!!!切圆角的控件越多,越卡顿!可以通过view.layer.shouldRasterize = true;view.layer.rasterizeScale = UIScreen.main.scale;去缓存渲染的数据。这样占用多一些内存,但可以缓解切圆角造成的卡顿问题!这种方式只对复用之后,切圆角的view外观没有变化的情况。
最好吧,能用图片的就用图片,不要用代码去切圆角了!让UI去画图!如果他不愿意切,那么tableView滚动卡顿,你直接甩锅给UI!