美文网首页swift 学习重要
swift 实现简单的添加购物车动画

swift 实现简单的添加购物车动画

作者: 艾欧尼亚 | 来源:发表于2020-04-01 22:06 被阅读0次
    需求:点击tableviewcell上的按钮,实现一个添加到底部的动画效果

    demo地址

    实现:

    1.获取tableviewCell上控件在self.view上的frame

    
        // 常量
        //动画播放时间
        var duration:CFTimeInterval = 3
        //运动的方块    
        lazy var square : UIImageView = {
            let square = UIImageView(image: UIImage.init(name: "icon_fruitadd"))
            square.frame = CGRect(x: -23, y: -23, width: 23, height: 23)
            self.view.addSubview(square)
            square.isHidden = true
            return square
        }()
        
        var rect : CGRect?
        // 获取点击的cell的控件在self.view上的frame
        cell.clickAddAnimationBlock = { () in
              let rect = cell.addBtn.convert(cell.addBtn.frame, to: self.view)
              self.rect = rect
        }
    

    2.实现动画效果

        func addAnimation(rect : CGRect) {
            let y = rect.origin.y
            
            self.square.isHidden = false
            let path =  CGMutablePath()
            // 移动到原点
            path.move(to: CGPoint.init(x:ScreenSize.SCREEN_WIDTH - 30,y:y - SystemNavigationBarHeight - SystemStatusBarHeight))
            // to:移动的终点,control: 控制点
            path.addQuadCurve(to: CGPoint.init(x: 30, y: self.view.frame.height - 30), control: CGPoint(x: 150, y: y - SystemNavigationBarHeight - SystemStatusBarHeight))
            
            //获取贝塞尔曲线的路径
            let animationPath = CAKeyframeAnimation.init(keyPath: "position")
            animationPath.path = path
            animationPath.rotationMode = CAAnimationRotationMode.rotateAuto
            
            //缩小图片到0
            let scale:CABasicAnimation = CABasicAnimation()
            scale.keyPath = "transform.scale"
            scale.toValue = 0.5
            
            //组合动画
            let animationGroup:CAAnimationGroup = CAAnimationGroup()
            animationGroup.animations = [animationPath,scale];
            animationGroup.duration = 0.8;
            animationGroup.delegate = self
            animationGroup.fillMode = CAMediaTimingFillMode.forwards;
            animationGroup.isRemovedOnCompletion = true
            square.layer.add(animationGroup, forKey:
                nil)
        }
    

    3.实现动画协议:

        func animationDidStop(_ anim: CAAnimation, finished flag: Bool) {
            self.square.isHidden = true
        }
    

    相关文章

      网友评论

        本文标题:swift 实现简单的添加购物车动画

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