美文网首页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