问题描述
我需要在UIView的顶部和底部创建一条曲线,我在底部使用以下内容:
func pathCurvedForView(givenView: UIView,curvedPercent:CGFloat) ->UIBezierPath
{
let arrowPath = UIBezierPath()
arrowPath.move(to: CGPoint(x:0,y:0))
arrowPath.addLine(to: CGPoint(x:givenView.bounds.size.width,y:givenView.bounds.size.height))
arrowPath.addQuadCurve(to: CGPoint(x:0,y:givenView.bounds.size.height),controlPoint: CGPoint(x:givenView.bounds.size.width/2,y:givenView.bounds.size.height-givenView.bounds.size.height*curvedPercent))
arrowPath.addLine(to: CGPoint(x:0,y:0))
arrowPath.close()
return arrowPath
}
func applyCurvedpath(givenView: UIView,curvedPercent:CGFloat) {
guard curvedPercent <= 1 && curvedPercent >= 0 else{
return
}
let shapeLayer = CAShapeLayer(layer: givenView.layer)
shapeLayer.path = self.pathCurvedForView(givenView: givenView,curvedPercent: curvedPercent).cgPath
shapeLayer.frame = givenView.bounds
shapeLayer.masksToBounds = true
givenView.layer.mask = shapeLayer
}
它工作正常,但是只对视图的底部起作用,对如何为topView实现它有任何想法吗? 谢谢
解决方法
让我们解释一下效果:
A B
+ -------- +
| |
| |
+ -------- +
D C
我们想要
- 从A(0,0)开始:
move(to:)
- 弯曲到B(宽度,0):
addQuadCurve(to:controlPoint:)
- 直到C(宽度,高度):
addLine(to:)
- 弯曲至D(0,高度):
addQuadCurve(to:controlPoint:)
- 直达A(0,0):
addLine(to:)
- 关闭。
所以替换
arrowPath.addLine(to: CGPoint(x:givenView.bounds.size.width,y:0))
使用
arrowPath.addQuadCurve(to: CGPoint(x: givenView.bounds.size.width,y: 0),controlPoint: CGPoint(x: givenView.bounds.size.width/2,y: givenView.bounds.size.height*curvedPercent))