如何在 UIView 中為 swift 添加曲線左側和右側

Question

我試圖添加一條曲線但不工作。

我附上了左邊的圖片是設計師給的，右邊是我在swift做的。

如果添加曲線拐角半徑不起作用，則此處如果我添加拐角半徑不適用於曲線。

我添加了左側和右側單獨的視圖，如何實現刪除超級視圖背景顏色和曲線。

extension UIView {

   func roundCorners(
      corners: UIRectCorner,
      radius: CGFloat
   ) {
      let path = UIBezierPath(
         roundedRect: bounds,
         byRoundingCorners: corners,
         cornerRadii: CGSize(
            width: radius,
            height: radius
         )
      )

      let mask = CAShapeLayer()
      mask.path = path.cgPath
      layer.mask = mask
   }
}

// here I am using on UITableviewCell in layoutSubview 

    leftCurve.roundCorners(corners: [.topRight,.bottomRight], radius: 20)        
    rightCurver.roundCorners(corners: [.topLeft,.bottomLeft], radius: 20)

Answer 1

這是使用UIBezierPath向兩側添加曲線的演示

class ShapeView: UIView {
    
    var path: UIBezierPath = UIBezierPath()
    
    // Set you circle position for verticle.
    var circleYPosition: CGFloat = 50 {
        didSet {
            self.setNeedsDisplay()
        }
    }
    
    override func awakeFromNib() {
        super.awakeFromNib()
        self.backgroundColor = UIColor.clear
        // Here apply shadow
    }
    
    override func draw(_ rect: CGRect) {
        super.draw(rect)
        // 4 corners radious
        UIBezierPath(roundedRect: rect, byRoundingCorners: .allCorners, cornerRadii: CGSize(width: 10, height: 10)).addClip()
        
        // Left - right circle
        path.move(to: CGPoint(x: 0, y: self.frame.size.height))
        
        //left side
        path.addArc(withCenter: CGPoint(x: 0, y: self.circleYPosition - 15),
            radius: 10,
            startAngle: CGFloat((90 * Double.pi) / 180),
            endAngle: CGFloat((270 * Double.pi) / 180),
            clockwise: false)
        
        path.addLine(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint(x: self.frame.size.width, y: 0))
        path.addLine(to: CGPoint(x: self.frame.size.width, y: self.frame.size.height))
        
        path.move(to: CGPoint(x: self.frame.size.width, y: self.frame.size.height))
        
        //right side
        path.addArc(withCenter: CGPoint(x: self.frame.size.width, y: self.circleYPosition - 15),
                    radius: 10,
                    startAngle: CGFloat((270 * Double.pi) / 180),
                    endAngle: CGFloat((90 * Double.pi) / 180),
                    clockwise: false)
        
        
        path.close()
        UIColor.white.setFill()
        path.fill()
        
        // Center Dash path
        let dashPath = UIBezierPath()
        dashPath.move(to: CGPoint(x: self.bounds.minX + 12, y: self.circleYPosition - 15))
        dashPath.addLine(to: CGPoint(x: self.bounds.maxX - 12, y: self.circleYPosition - 15))
        dashPath.setLineDash([5,5], count: 2, phase: 0.0)
        dashPath.lineWidth = 1.0
        dashPath.lineCapStyle = .butt
        UIColor.lightGray.set()
        dashPath.stroke()
    }
}