[iOS]swift中UITableView使用.grouped样式时设置cell两侧边距以及实现圆角

在iOS13之后苹果为我们提供了新的样式选项.insetGrouped,如果使用这个样式的话,苹果会为我们自动实现每个section的圆角,而且cell两侧有相应的间距。这个我在这里不再说明,大家可以自行体验。

那么如果要适配iOS13以下的系统呢,我们该怎么实现圆角和边距呢?我这里使用.grouped样式的UITableView来演示下实现原理:

1、先说下实现边距,我们自定义一个cell类,在自定义cell中重写cell的frame属性,在设置frame的时候我们给它设置下想要的边距。

//MARK: - 设置cell左右边距
override var frame: CGRect {

        didSet{

            var newFrame =frame

            newFrame.origin.x += 16.0

            newFrame.size.width -= 32.0

            super.frame = newFrame

        }

    }

2、设置cell的圆角

cell设置圆角分三种情况

当某个section只有一个cell时,我们需要对cell的四个圆角都要设置;

当section的cell大于1时,我们需要对第一个和最后一个cell设置圆角

第一行cell圆角需要对左上角,右上角进行切圆角;

最后一行cell圆角需要对左下角,右下角进行切圆角;

所以我们需要在代码里进行判断区分设置。

定义一个方法
/// 设置cell圆角

/// - Parameters:

///  - cell: cell

///  - indexPath: indexPath

///  - tableView: tableView

private func setCornerRadiusForSectionCell(cell: UITableViewCell, indexPath: IndexPath, tableView: UITableView, cornerRadius: CGFloat) {

    let sectionCount = tableView.numberOfRows(inSection: indexPath.section)

    //当前分区有多行数据时

    if sectionCount >1 {

        switch indexPath.row {

            /** 如果是第一行,左上、右上角为圆角**/

        case 0:

            cell.createCorner(CGSize(width: 8.0, height: 8.0), UIRectCorner(rawValue: (UIRectCorner.topLeft.rawValue)|(UIRectCorner.topRight.rawValue)))

        case sectionCount -1:
 /** 如果是最后行,左下、右下角为圆角**/
            cell.createCorner(CGSize(width: cornerRadius,height: cornerRadius),UIRectCorner(rawValue: (UIRectCorner.bottomLeft.rawValue)|(UIRectCorner.bottomRight.rawValue)))

        default:

            break

        }

    }

    //当前分区只有一行行数据时

    else {

        cell.createCorner(CGSize(width: cornerRadius, height: cornerRadius), UIRectCorner(rawValue: (UIRectCorner.bottomLeft.rawValue)|(UIRectCorner.bottomRight.rawValue)|(UIRectCorner.topLeft.rawValue)|(UIRectCorner.topRight.rawValue)))

    }

}

上述方法中的createCorner这个方法是我在项目里为UIView添加的扩展方法,具体实现如下:

//   - cornerRadii: 圆角幅度

//   - roundingCorners: UIRectCorner(rawValue: (UIRectCorner.topRight.rawValue) | (UIRectCorner.bottomRight.rawValue))

public func createCorner(_cornerRadii:CGSize,_roundingCorners:UIRectCorner) {

    let fieldPath = UIBezierPath.init(roundedRect:bounds,byRoundingCorners: roundingCorners,cornerRadii:cornerRadii );

    let fieldLayer = CAShapeLayer();

    fieldLayer.frame = bounds;

    fieldLayer.path = fieldPath.cgPath;

    self.layer.mask = fieldLayer;

}

定义好方法,我们就可以在tableView的代理方法中调用了。

        func tableView(_ tableView:UITableView,willDisplay cell:UITableViewCell,forRowAt indexPath:IndexPath)
 {
           setCornerRadiusForSectionCell(cell: cell, indexPath: indexPath, tableView: tableView, cornerRadius: 8.0)
}

3、如果想要改变每个section的间距,需要实现UITableView的四个代理方法。(当tableView使用的样式是.grouped)

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 16.0
    }
    func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
        return 0.0
    }
    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        return UITableViewHeaderFooterView()
    }
    func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
        return UITableViewHeaderFooterView()
    }

效果图
在这里插入图片描述

  • 9
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好,关于 Swift 封装 UITableView 和 UICollectionView 的问题,我可以给你一些基本的介绍。 首先,UITableView 和 UICollectionView 都是 iOS 平台常用的视图控件,用于展示列表和网格等数据。在 Swift ,我们可以通过继承 UITableView 和 UICollectionView 类来自定义我们自己的表格和网格视图。 下面是一个简单的示例代码,展示如何封装 UITableView: ```swift import UIKit class MyTableView: UITableView, UITableViewDataSource, UITableViewDelegate { var data: [String] = [] override init(frame: CGRect, style: UITableView.Style) { super.init(frame: frame, style: style) self.dataSource = self self.delegate = self // 注册单元格 self.register(UITableViewCell.self, forCellReuseIdentifier: "cell") } required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") } // UITableViewDataSource 协议方法 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return self.data.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) cell.textLabel?.text = self.data[indexPath.row] return cell } // UITableViewDelegate 协议方法 func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { print("选了第 \(indexPath.row) 行") } } ``` 在这个示例代码,我们自定义了一个名为 `MyTableView` 的类,继承自 `UITableView`。我们在 `init` 方法设置了数据源和代理,并注册了一个单元格类型。在 `UITableViewDataSource` 和 `UITableViewDelegate` 协议方法,我们实现了表格的行数、单元格内容和选事件的处理。 类似地,我们也可以使用类似的方式封装 UICollectionView。需要注意的是,UICollectionViewDelegate 和 UICollectionViewDataSource 两个协议方法和 UITableView 的函数名和实现方式略有不同,需要根据实际情况来进行调整。 希望这个简单的示例代码可以对你有所帮助。如果你有其他关于 Swift 的问题,欢迎随提出!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值