iOS UITableView section圓角陰影

來(lái)源:http://m.itdecent.cn/p/739408a7aae1

給section添加圓角和陰影效果,效果如下:


image.png

全部實(shí)現(xiàn)都在UITableView的willDisplayCell代理方法里:
給每個(gè)section第一個(gè)和最后一個(gè)cell分別添加頂部和底部圓角

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    // 圓角角度
    CGFloat radius = 10.f;
    // 設(shè)置cell 背景色為透明
    cell.backgroundColor = UIColor.clearColor;
    // 創(chuàng)建兩個(gè)layer
    CAShapeLayer *normalLayer = [[CAShapeLayer alloc] init];
    CAShapeLayer *selectLayer = [[CAShapeLayer alloc] init];
    // 獲取顯示區(qū)域大小
    CGRect bounds = CGRectInset(cell.bounds, kScaleX * 20, 0);
    // cell的backgroundView
    UIView *normalBgView = [[UIView alloc] initWithFrame:bounds];
    // 獲取每組行數(shù)
    NSInteger rowNum = [tableView numberOfRowsInSection:indexPath.section];
    // 貝塞爾曲線
    UIBezierPath *bezierPath = nil;
    
    if (rowNum == 1) {
        // 一組只有一行(四個(gè)角全部為圓角)
        bezierPath = [UIBezierPath bezierPathWithRoundedRect:bounds byRoundingCorners:UIRectCornerAllCorners cornerRadii:CGSizeMake(radius, radius)];
        normalBgView.clipsToBounds = NO;
    }else {
        normalBgView.clipsToBounds = YES;
        if (indexPath.row == 0) {
            normalBgView.frame = UIEdgeInsetsInsetRect(bounds, UIEdgeInsetsMake(-5, 0, 0, 0));
            CGRect rect = UIEdgeInsetsInsetRect(bounds, UIEdgeInsetsMake(5, 0, 0, 0));
            // 每組第一行(添加左上和右上的圓角)
            bezierPath = [UIBezierPath bezierPathWithRoundedRect:rect byRoundingCorners:(UIRectCornerTopLeft|UIRectCornerTopRight) cornerRadii:CGSizeMake(radius, radius)];
        }else if (indexPath.row == rowNum - 1) {
            normalBgView.frame = UIEdgeInsetsInsetRect(bounds, UIEdgeInsetsMake(0, 0, -5, 0));
            CGRect rect = UIEdgeInsetsInsetRect(bounds, UIEdgeInsetsMake(0, 0, 5, 0));
            // 每組最后一行(添加左下和右下的圓角)
            bezierPath = [UIBezierPath bezierPathWithRoundedRect:rect byRoundingCorners:(UIRectCornerBottomLeft|UIRectCornerBottomRight) cornerRadii:CGSizeMake(radius, radius)];
        }else {
            // 每組不是首位的行不設(shè)置圓角
            bezierPath = [UIBezierPath bezierPathWithRect:bounds];
        }
    }
    
    // 陰影
    normalLayer.shadowColor = [UIColor blackColor].CGColor;
    normalLayer.shadowOpacity = 0.2;
    normalLayer.shadowOffset = CGSizeMake(0, 0);
    normalLayer.path = bezierPath.CGPath;
    normalLayer.shadowPath = bezierPath.CGPath;
    
    // 把已經(jīng)繪制好的貝塞爾曲線路徑賦值給圖層,然后圖層根據(jù)path進(jìn)行圖像渲染render
    normalLayer.path = bezierPath.CGPath;
    selectLayer.path = bezierPath.CGPath;
    
    // 設(shè)置填充顏色
    normalLayer.fillColor = [UIColor whiteColor].CGColor;
    // 添加圖層到nomarBgView中
    [normalBgView.layer insertSublayer:normalLayer atIndex:0];
    normalBgView.backgroundColor = UIColor.clearColor;
    cell.backgroundView = normalBgView;
    
    // 替換cell點(diǎn)擊效果
    UIView *selectBgView = [[UIView alloc] initWithFrame:bounds];
    selectLayer.fillColor = [UIColor colorWithWhite:0.95 alpha:1.0].CGColor;
    [selectBgView.layer insertSublayer:selectLayer atIndex:0];
    selectBgView.backgroundColor = UIColor.clearColor;
    cell.selectedBackgroundView = selectBgView;
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Swift1> Swift和OC的區(qū)別1.1> Swift沒(méi)有地址/指針的概念1.2> 泛型1.3> 類型嚴(yán)謹(jǐn) 對(duì)...
    cosWriter閱讀 11,685評(píng)論 1 32
  • 1 TableView編程指南學(xué)習(xí)筆記 1.1 At a Glance A table view is an ...
    Kevin_Junbaozi閱讀 985評(píng)論 0 3
  • 關(guān)于《海角七號(hào)》這部創(chuàng)造當(dāng)年臺(tái)灣票房奇跡的影片,各種好評(píng),聽(tīng)說(shuō)已久。時(shí)隔多年,終于有機(jī)會(huì)靜下心來(lái),好好品嘗。 電影...
    鐘靈毓秀_閱讀 1,984評(píng)論 6 19
  • 我是一只貓。 在我幼年的時(shí)候,被現(xiàn)在的主人收養(yǎng)了。她們對(duì)我很好,給我蓋了一座房子————一個(gè)鞋盒,還給我鋪了一個(gè)大...
    Phoebe超閱讀 425評(píng)論 6 1
  • 備忘錄模式(Memento):在不破壞封裝的前提下,捕獲一個(gè)對(duì)象的內(nèi)部狀態(tài),并在該對(duì)象之外保存這個(gè)狀態(tài)。這樣以后可...
    bobcorbett閱讀 201評(píng)論 0 0

友情鏈接更多精彩內(nèi)容