iOS UITableView圓角分區

效果圖

111123123.gif
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath

{

// 圓角弧度半徑

CGFloat cornerRadius = 6.f;

// 設置cell的背景色為透明,如果不設置這個的話,則原來的背景色不會被覆蓋

cell.backgroundColor = UIColor.clearColor;

// 創建一個shapeLayer

CAShapeLayer *layer = [[CAShapeLayer alloc] init];

CAShapeLayer *backgroundLayer = [[CAShapeLayer alloc] init]; //顯示選中

// 創建一個可變的圖像Path句柄,該路徑用于保存繪圖信息

CGMutablePathRef pathRef = CGPathCreateMutable();

// 獲取cell的size

// 第一個參數,是整個 cell 的 bounds, 第二個參數是距左右兩端的距離,第三個參數是距上下兩端的距離

CGRect bounds = CGRectInset(cell.bounds, 0, 0);

// CGRectGetMinY:返回對象頂點坐標

// CGRectGetMaxY:返回對象底點坐標

// CGRectGetMinX:返回對象左邊緣坐標

// CGRectGetMaxX:返回對象右邊緣坐標

// CGRectGetMidX: 返回對象中心點的X坐標

// CGRectGetMidY: 返回對象中心點的Y坐標

// 這里要判斷分組列表中的第一行,每組section的第一行,每組section的中間行

// CGPathAddRoundedRect(pathRef, nil, bounds, cornerRadius, cornerRadius);

if (indexPath.row == 0 && indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) {

CGPathAddRoundedRect(pathRef, nil, bounds, cornerRadius, cornerRadius);

}else if (indexPath.row == 0) {

// 初始起點為cell的左下角坐標

CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds));

// 起始坐標為左下角,設為p,(CGRectGetMinX(bounds), CGRectGetMinY(bounds))為左上角的點,設為p1(x1,y1),(CGRectGetMidX(bounds), CGRectGetMinY(bounds))為頂部中點的點,設為p2(x2,y2)。然后連接p1和p2為一條直線l1,連接初始點p到p1成一條直線l,則在兩條直線相交處繪制弧度為r的圓角。

CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds), CGRectGetMidX(bounds), CGRectGetMinY(bounds), cornerRadius);

CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius);

// 終點坐標為右下角坐標點,把繪圖信息都放到路徑中去,根據這些路徑就構成了一塊區域了

CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds));

} else if (indexPath.row == [tableView numberOfRowsInSection:indexPath.section]-1) {

// 初始起點為cell的左上角坐標

CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds));

CGPathAddArcToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds), CGRectGetMidX(bounds), CGRectGetMaxY(bounds), cornerRadius);

CGPathAddArcToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds), CGRectGetMaxX(bounds), CGRectGetMidY(bounds), cornerRadius);

// 添加一條直線,終點坐為標右下角坐標點并放到路徑中去

CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds));

} else {

// 添加cell的rectangle信息到path中(不包括圓角)

//假如用填充色,用這個

//        CGPathAddRect(pathRef, nil, bounds);

//假如只要邊框

CGPathMoveToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMaxY(bounds));

CGPathAddLineToPoint(pathRef, nil, CGRectGetMinX(bounds), CGRectGetMinY(bounds));

CGPathMoveToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMinY(bounds));

CGPathAddLineToPoint(pathRef, nil, CGRectGetMaxX(bounds), CGRectGetMaxY(bounds));

}

// 把已經繪制好的可變圖像路徑賦值給圖層,然后圖層根據這圖像path進行圖像渲染render

layer.path = pathRef;

backgroundLayer.path = pathRef;

// 注意:但凡通過Quartz2D中帶有creat/copy/retain方法創建出來的值都必須要釋放

CFRelease(pathRef);

// 按照shape layer的path填充顏色,類似于渲染render

// layer.fillColor = [UIColor colorWithWhite:1.f alpha:0.8f].CGColor;

layer.strokeColor = [UIColor clearColor].CGColor;//線條顏色

layer.fillColor = [UIColor whiteColor].CGColor; //填充色

// view大小與cell一致

UIView *roundView = [[UIView alloc] initWithFrame:bounds];

// 添加自定義圓角后的圖層到roundView中

[roundView.layer insertSublayer:layer atIndex:0];

roundView.backgroundColor = UIColor.clearColor;

// cell的背景view

cell.backgroundView = roundView;

// 以上方法存在缺陷當點擊cell時還是出現cell方形效果,因此還需要添加以下方法

// 如果你 cell 已經取消選中狀態的話,那以下方法是不需要的.

UIView *selectedBackgroundView = [[UIView alloc] initWithFrame:bounds];

backgroundLayer.fillColor = [UIColor cyanColor].CGColor;

[selectedBackgroundView.layer insertSublayer:backgroundLayer atIndex:0];

selectedBackgroundView.backgroundColor = UIColor.clearColor;

cell.selectedBackgroundView = selectedBackgroundView;

}     


 
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 之前有遇到有人問過一個看起來好像很簡單,但之前卻沒有實踐過的問題,大概就是類似微信我的頁面,tableView 有...
    Jimmy_阿達閱讀 21,772評論 27 63
  • 近幾年,中國零售市場中,快時尚的品牌越來越多,也有非常多的品牌復牌開始做快時尚,因為它生命周期短(普通商品生命周期...
    heyelushui520閱讀 1,558評論 0 1
  • 光陰似箭,日月如梭,轉眼之間,已過而立之年。回首人生幾十載,沉淀過后,寥寥八 字:人生不易,唯有堅強...
    如夢初醒1212閱讀 1,024評論 0 1
  • 你快點過來好不好,我有點等不急你了。感覺為了等你的路上不想太無聊,找了太多人陪。你這么疼我肯定不會怪我的~我前些日...
    SevenB七堡包閱讀 229評論 0 0
  • 今天讀完了汪曾祺老先生這本書的第一個系列《有味》。 這個系列從南到北,從葷到素,從天上到地下,從陸地到海洋把他吃過...
    清溪有畫閱讀 624評論 2 9