使用 UIBezierPath 绘制带动画的垂直抛物线?

时间:2021-02-11 08:53:19

标签: ios swift animation uibezierpath

嗨,我正在尝试制作诸如击球之类的动画。我面临着球曲线的问题,所以它看起来像飞球。我试图做控制点,但没有运气。还想添加旋转和缩放

Animation

使用 UIBezierPath 的曲线动画代码

    @IBAction func animationIcon(_ sender: Any) {
        animate(view: view1, fromPoint: CGPoint(x: self.view.center.x, y: self.view.frame.height-100), toPoint: CGPoint(x: self.view.center.x+100, y: view.bounds.size.height - 400))
     }

        private func animate(view : UIView, fromPoint start : CGPoint, toPoint end: CGPoint){
        // The animation
        
        
        let duration: TimeInterval = 3.0

        
        CATransaction.begin()
        CATransaction.setCompletionBlock({
            
        })
        let animation = CAKeyframeAnimation(keyPath: "position")
        let path = UIBezierPath()
        path.move(to: start)

        // Calculate the control points
        let c1 = CGPoint(x: (end.x+start.x)/2 , y: (end.y+start.y)/2)
        let c2 = CGPoint(x: end.x,        y: end.y)

    
        path.addCurve(to: end, controlPoint1: c1, controlPoint2: c2)
        
        animation.path = path.cgPath;
        
        // The other animations properties
        animation.fillMode              = CAMediaTimingFillMode.forwards
        animation.isRemovedOnCompletion = false
        animation.duration              = 2
        animation.timingFunction        = CAMediaTimingFunction(name:CAMediaTimingFunctionName.easeOut)
        
        // Apply it
        view.layer.add(animation, forKey:"trash")
        CATransaction.commit()

          
        }
        
    
    
    
   
    
}

旋转和缩放动画我想将所有动画合并到一个地方。

           let rotate = CGAffineTransform(rotationAngle: CGFloat(Double.pi))

       // initial transform
    view.transform = CGAffineTransform(scaleX: 0.8, y: 0.8)

       // initial spin for duration of animaton
       UIView.animate(withDuration: duration,
                      delay: 0.0,
                      options: [.curveLinear],
                      animations: {
                        view.transform = rotate;
                       },
                      completion: nil)
       // scaling and fading
       UIView.animate(withDuration: duration/2.0, animations: {
        view.transform = view.transform.scaledBy(x: 2, y: 2)

       }) { (true) in
        UIView.animate(withDuration: duration/2.0, animations: {
            view.transform = .identity

         })
       }

0 个答案:

没有答案