是否可以创建具有弯曲底部边缘的 UIView。

Posted 2023-03-13

【中文标题】是否可以创建具有弯曲底部边缘的 UIView。

【英文标题】：Is it possible to create UIView with curved bottom edge.

【发布时间】：2017-11-24 12:26:22

【问题描述】：

我需要创建带有弯曲底边的 UIView，如下所示。最简单的方法是什么？

【参考方案1】：

只需将您在 IB 中的视图设置为 ShapedView 类，或者从代码创建它并在绘制路径时使用控制点。

class ShapedView: UIView 
    let subLayer: CAShapeLayer = 
        let subLayer = CAShapeLayer()
        subLayer.fillColor = UIColor.red.cgColor
        return subLayer
    ()

    override init(frame: CGRect) 
        super.init(frame: frame)
        commonInit()
    

    required init?(coder aDecoder: NSCoder) 
        super.init(coder: aDecoder)
        commonInit()
    

    private func commonInit() 
        layer.addSublayer(subLayer)
        subLayer.frame = bounds
        setPath()
    

    override func layoutSubviews() 
        super.layoutSubviews()
        subLayer.frame = bounds
        setPath()
    

    private func setPath() 
        let path = UIBezierPath()
        path.move(to: CGPoint(x:0, y:bounds.height))
        path.addQuadCurve(to: CGPoint(x:bounds.width, y:bounds.height), controlPoint: CGPoint(x:bounds.width/2, y:4*bounds.height/5))
        path.addLine(to: CGPoint(x:bounds.width, y:0))
        path.addLine(to: CGPoint(x:0, y:0))
        subLayer.path = path.cgPath
    

【参考方案2】：

您可以使用CAShapeLayer 实现这一目标

关注

1) 创建CAShapeLayer

2) 创建UIBezierPath

3) 将path 分配给CAShapeLayer

4) 将 CAShapeLayer 添加到 mask 的 UIVIew

希望对你有帮助