Swift 3.0笔记 UIBezierPath,UIBasic
2020-03-19 本文已影响0人
那些喧嚣
获取贝塞尔曲线上的点,在该点上创建UIView
菜鸟网络学习中,学习了网上很多方法,在这里做个笔记,
-func viewWithLayer1() {
let viewHeight = 200.0
let viewToLayer = UIView.init(frame: CGRect.init(x: 0, y: 0, width: Int(SCREEN_WIDTH), height: Int(viewHeight)))
viewToLayer.backgroundColor = UIColor.brown
self.view.addSubview(viewToLayer)
let layerHeight = viewHeight*0.2
let layer = CAShapeLayer()
let bezier = UIBezierPath()
//起始的点,一共对应了4个点,最后加上控制点
bezier.move(to: CGPoint.init(x: 0, y: viewHeight - layerHeight))
bezier.addLine(to: CGPoint.init(x: 0, y: viewHeight - 1))
bezier.addLine(to: CGPoint.init(x: SCREEN_WIDTH, y: CGFloat(viewHeight - 1)))
bezier.addLine(to: CGPoint.init(x: SCREEN_WIDTH, y: CGFloat(viewHeight - layerHeight)))
//to endPoint: CGPoint, controlPoint: CGPoint **to:结束的点 controlPoint:控制的点 **
bezier.addQuadCurve(to: CGPoint.init(x: 0, y: CGFloat(viewHeight - layerHeight)), controlPoint: CGPoint.init(x: SCREEN_WIDTH/2, y: CGFloat(viewHeight - layerHeight - 80)))
let frame = CAKeyframeAnimation.init(keyPath: "position")
frame.path = bezier.cgPath
frame.isRemovedOnCompletion = true
layer.path = bezier.cgPath
layer.fillColor = UIColor.black.cgColor
viewToLayer.layer.addSublayer(layer)
//time:传时间点,范围是0到1,0.5就是中间咯
let targtPoint = getBezierPoint(time: 0.5, star: CGPoint.init(x: 0, y: viewHeight - layerHeight), end: CGPoint.init(x: SCREEN_WIDTH, y: CGFloat(viewHeight - layerHeight)), control: CGPoint.init(x: SCREEN_WIDTH/2, y: CGFloat(viewHeight - layerHeight - 80)))
let addView1 = UIView.init(frame: CGRect.init(x: 0, y: 0, width: 100, height: 40))
addView1.layer.cornerRadius = 15
//获取到贝塞尔曲线上想要的点,设置成中心点
addView1.center = targtPoint
addView1.backgroundColor = UIColor.yellow
viewToLayer.addSubview(addView1)
}
// MARK: - 获取贝塞尔曲线上的点
func getBezierPoint(time:CGFloat,star:CGPoint,end:CGPoint,control:CGPoint) -> CGPoint {
let a = pow(1-time, 2) * star.x
let b = 2*time*(1-time)*control.x
let c = pow(time, 2)*end.x
let returnX = a + b + c
let d = pow(1-time, 2) * star.y
let e = 2*time*(1-time)*control.y
let f = pow(time, 2)*end.y
let returnY = d + e + f
return CGPoint.init(x:returnX,y:returnY)
}
画一个很简单的加载的饼图
var round = CAShapeLayer()
var roundPath = UIBezierPath()
var drawTimer:Timer!
//画饼的起始位置
var beginAngle = Double.pi*3/2
//画饼的终点位置
var endAngle = Double.pi*3/2 + Double.pi*2/10
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.white
self.navigationController?.delegate = self
//隔0.2秒执行一次timerAction方法
drawTimer = Timer.scheduledTimer(timeInterval: 0.2, target: self, selector: #selector(timerAction), userInfo: nil, repeats: true)
BezierDrawRound()
// Do any additional setup after loading the view.
}
func BezierDrawRound() {
roundPath.addArc(withCenter: CGPoint.init(x: 0, y: 0), radius: 40, startAngle: CGFloat(beginAngle), endAngle: CGFloat(endAngle), clockwise: true)
//加一个点,圆点(位置是根据上面的圆心设置:withCenter:)
roundPath.addLine(to: CGPoint.init(x: 0, y: 0))
//连接点连线,填充
roundPath.fill()
roundPath.close()
round.frame = CGRect.init(x: self.view.center.x, y: 300, width: 100, height: 100)
round.lineWidth = 5
round.path = roundPath.cgPath
round.fillColor = UIColor.init(red: 0, green: 0, blue: 0, alpha: 0.1).cgColor
self.view.layer.addSublayer(round)
}
// MARK: - 计时器执行方法
@objc func timerAction() {
endAngle += Double.pi/10
if endAngle > beginAngle + Double.pi*2 {
drawTimer.invalidate()
}
BezierDrawRound()
}