自定义更改单元格底部边框的颜色

Question

我需要改变UICollectionView底部细胞的颜色，在这个问题只是我做这

我需要像这样将颜色设置到底部单元格

let border = CALayer()
let width = CGFloat(2.0)
border.borderColor = UIColor(red: 184/255, green: 215/255, blue: 215/255, alpha: 1).cgColor
border.frame = CGRect(x: 0, y: cell.frame.size.height - width, width: cell.frame.size.width, height: cell.frame.size.height)
border.borderWidth = width
cell.layer.addSublayer(border)
cell.layer.masksToBounds = true

Answer 1

与其尝试将其添加为边框，不如添加两层，因为它更容易。 就像是 ：

 override func layoutSubviews() {
    super.layoutSubviews()

    backgroundShape = CAShapeLayer.init()
    backPath = UIBezierPath.init(rect: self.bounds)// Use your path
    backgroundShape.path = backPath.cgPath
    backgroundShape.fillColor = UIColor.blue.cgColor//border color in your case
    self.layer.addSublayer(backgroundShape)

    foregroundShape = CAShapeLayer()
    forgroundPath = UIBezierPath.init(rect: CGRect.init(x: 0, y: -20, width: self.bounds.width, height: self.bounds.height))// Use your path with  a little negative y
    foregroundShape.path = forgroundPath.cgPath
    foregroundShape.fillColor = UIColor.yellow.cgColor//white in your case
    self.layer.addSublayer(foregroundShape)  
}

---

详细答案：

class BorderedCell: UICollectionViewCell{

var backgroundShape: CAShapeLayer!
var backPath: UIBezierPath!
var foregroundShape: CAShapeLayer!
var forgroundPath: UIBezierPath!




override func layoutSubviews() {
    super.layoutSubviews()

    backgroundShape = CAShapeLayer.init()
    backPath = drawCurvedShape(with: 0)
    backgroundShape.path = backPath.cgPath
    backgroundShape.fillColor = UIColor(red:0.76, green:0.86, blue:0.86, alpha:1.0).cgColor
    self.layer.addSublayer(backgroundShape)

    foregroundShape = CAShapeLayer()
    forgroundPath = drawCurvedShape(with: -8)
    foregroundShape.path = forgroundPath.cgPath
    foregroundShape.fillColor = UIColor.white.cgColor
    self.layer.addSublayer(foregroundShape)
}


func drawCurvedShape(with startingY: CGFloat) -> UIBezierPath{
    let path = UIBezierPath.init()
    path.move(to: CGPoint.init(x: 0, y: startingY))
    path.addLine(to: CGPoint.init(x: self.bounds.width, y: startingY))
    path.addLine(to: CGPoint.init(x: self.bounds.width, y: self.bounds.height + startingY - 30))
    path.addQuadCurve(to: CGPoint.init(x: self.bounds.width - 30, y: self.bounds.height + startingY), controlPoint: CGPoint.init(x: self.bounds.width, y: self.bounds.height + startingY))
    path.addLine(to: CGPoint.init(x: 0, y: self.bounds.height + startingY))
    path.addLine(to: CGPoint.init(x: 0, y: startingY))
    path.close()

    return path
}
}

输出：

我并没有使drawShape完全符合您所需的形状，只是使形状达到了目的。