代码之家  ›  专栏  ›  技术社区  ›  Ganesh Manickam Gil

如何裁剪具有重复半圆的UIView?

  •  1
  • Ganesh Manickam Gil  · 技术社区  · 7 年前

    我想裁剪一个UIView,其底部和顶部都是重复的半圆,如下图所示 enter image description here

    1 回复  |  直到 7 年前
        1
  •  4
  •   Reinier Melian    7 年前

    我一直在研究你的问题,这是我的结果,你需要创建一个UIBezierPath并应用到你想要的视图,使用这段代码

    函数生成所需的BezierPath

    func pathSemiCirclesPathForView(givenView: UIView, ciclesRadius:CGFloat = 10, circlesDistance : CGFloat = 2) ->UIBezierPath
        {
            let width = givenView.frame.size.width
            let height = givenView.frame.size.height
    
            let semiCircleWidth = CGFloat(ciclesRadius*2)
    
            let semiCirclesPath = UIBezierPath()
            semiCirclesPath.move(to: CGPoint(x:0, y:0))
    
            var x = CGFloat(0)
            var i = 0
            while x < width {
                x = (semiCircleWidth) * CGFloat(i) + (circlesDistance * CGFloat(i))
                let pivotPoint = CGPoint(x: x + semiCircleWidth/2, y: height)
                semiCirclesPath.addArc(withCenter: pivotPoint, radius: ciclesRadius, startAngle: -180 * .pi / 180.0, endAngle: 0 * .pi / 180.0, clockwise: true)
                semiCirclesPath.addLine(to: CGPoint(x: semiCirclesPath.currentPoint.x + circlesDistance, y: height))
                i += 1
            }
    
            semiCirclesPath.addLine(to: CGPoint(x:width,y: 0))
    
            i = 0
            while x > 0 {
                x = width - (semiCircleWidth) * CGFloat(i) - (circlesDistance * CGFloat(i))
                let pivotPoint = CGPoint(x: x - semiCircleWidth/2, y: 0)
                semiCirclesPath.addArc(withCenter: pivotPoint, radius: ciclesRadius, startAngle: 0 * .pi / 180.0, endAngle: -180 * .pi / 180.0, clockwise: true)
                semiCirclesPath.addLine(to: CGPoint(x: semiCirclesPath.currentPoint.x - circlesDistance, y: 0))
                i += 1
            }
    
            semiCirclesPath.close()
            return semiCirclesPath
        }
    

    函数将BezierPath应用于任何视图

    func applySemiCircleEffect(givenView: UIView){
        let shapeLayer = CAShapeLayer(layer: givenView.layer)
        shapeLayer.path = self.pathSemiCirclesPathForView(givenView: givenView).cgPath
        shapeLayer.frame = givenView.bounds
        shapeLayer.masksToBounds = true
        shapeLayer.shadowOpacity = 1
        shapeLayer.shadowColor = UIColor.black.cgColor
        shapeLayer.shadowOffset = CGSize(width: 0, height: 0)
        shapeLayer.shadowRadius = 3
    
        givenView.layer.mask = shapeLayer
    }
    

    使用它

    @IBOutlet weak var customView: UIView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.applySemiCircleEffect(givenView: customView)
    }
    

    enter image description here

    希望这对你有帮助,快乐编码