美文网首页Swift学习
Swift小记:定制一个镂空的不规则View

Swift小记:定制一个镂空的不规则View

作者: 齐舞647 | 来源:发表于2019-07-17 15:43 被阅读11次

所要用到的知识:CAShapeLayerUIBezierPathWinding Rules

效果如图:一个定制形状的镂空的View(绿色部分)

直接上代码:

    override func viewDidLoad() {
        
        super.viewDidLoad()
        
        self.view.backgroundColor = .yellow
        
        let aView = UIView.init(frame: CGRect(x: 50, y: 50, width: 100, height: 100))
        self.view.addSubview(aView)
        
        let aShapeLayer: CAShapeLayer = .init()
        aShapeLayer.fillColor = UIColor.green.cgColor
        aView.layer.addSublayer(aShapeLayer)
        let aPath = createLayerPath(CGPoint(x: aView.frame.size.width / 2, y: aView.frame.size.height), circleRadius: 50.0) // 大环
        let bPath = createLayerPath(CGPoint(x: aView.frame.size.width / 2, y: aView.frame.size.height), circleRadius: 40.0) // 小环
        bPath.append(aPath)
        aShapeLayer.path = bPath.cgPath
        aShapeLayer.fillRule = .evenOdd
    }
    
    func createLayerPath(_ circleCenter: CGPoint, circleRadius: CGFloat) -> UIBezierPath {
        
        let startAngle: Double = -75.0  // 开始角度
        let endAngle: Double = 255.0    // 结束角度
        let arrowDistance: CGFloat = 4.0 // 箭头衍生距离
        
        let PI = Double.pi
        let path:UIBezierPath = UIBezierPath.init()
        path.addArc(withCenter: circleCenter, radius: circleRadius, startAngle:  CGFloat(startAngle/180 * PI) , endAngle: CGFloat(endAngle/180 * PI), clockwise: true)
        path.move(to: CGPoint(x: circleCenter.x, y: circleCenter.y - circleRadius - arrowDistance))
        path.addLine(to: CGPoint(x: circleCenter.x + CGFloat(Double(circleRadius) * cos(startAngle/180 * PI)), y: circleCenter.y + CGFloat(Double(circleRadius) * sin(startAngle/180 * PI))))
        path.addLine(to: CGPoint(x: circleCenter.x + CGFloat(Double(circleRadius) * cos(endAngle/180 * PI)), y: circleCenter.y + CGFloat(Double(circleRadius) * sin(endAngle/180 * PI))))
        
        return path
    }

相关文章

网友评论

    本文标题:Swift小记:定制一个镂空的不规则View

    本文链接:https://www.haomeiwen.com/subject/mqaqlctx.html