模仿饿了么、美团添加购物车的动画效果

最新推荐文章于 2021-05-26 11:44:22 发布

weixin_34406086

最新推荐文章于 2021-05-26 11:44:22 发布

阅读量735

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/5951008876/blog/681101

版权

2019独角兽企业重金招聘Python工程师标准>>>

#pragma mark -加入购物车动画
-(void) JoinCartAnimationWithRect:(CGRect)rect
{
    CGFloat _endPoint_x = 35;
    CGFloat _endPoint_y = 713 - 35;

    CGFloat startX = rect.origin.x;
    CGFloat startY = rect.origin.y;




    //1.创建佩塞尔曲线：
    _path= [UIBezierPath bezierPath];

    //设置起点：
    [_path moveToPoint:CGPointMake(startX, startY)];

    //创建路径：三点曲线
    [_path addCurveToPoint:CGPointMake(_endPoint_x, _endPoint_y) controlPoint1:CGPointMake(startX, startY) controlPoint2:CGPointMake(startX - 180, startY - 200)];

    //2.创建layer图标：
    _dotLayer = [CALayer layer];
    _dotLayer.backgroundColor = [UIColor purpleColor].CGColor;
    _dotLayer.frame = CGRectMake(0, 0, 20, 20);
    _dotLayer.cornerRadius = 5;
    _dotLayer.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"01.png"]].CGColor;
    [self.view.layer addSublayer:_dotLayer];



    //3、组合动画：
    [self groupAnimation];
}
#pragma mark - 组合动画
-(void)groupAnimation
{

    //1、
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    animation.path = _path.CGPath;
    animation.rotationMode = kCAAnimationRotateAuto;


    //2、
    CABasicAnimation *alphaAnimation = [CABasicAnimation animationWithKeyPath:@"alpha"];
    alphaAnimation.duration = 0.5f;
    alphaAnimation.fromValue = [NSNumber numberWithFloat:1.0];
    alphaAnimation.toValue = [NSNumber numberWithFloat:0.1];
    alphaAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];

    //3、
    CAAnimationGroup *groups = [CAAnimationGroup animation];
    groups.animations = @[animation,alphaAnimation];
    groups.duration = durationTime;
    groups.removedOnCompletion = NO;
    groups.fillMode = kCAFillModeForwards;
    groups.delegate = self;
    [groups setValue:@"groupsAnimation" forKey:@"animationName"];
    [_dotLayer addAnimation:groups forKey:nil];
    [self performSelector:@selector(removeFromLayer:) withObject:_dotLayer afterDelay:durationTime];
}

//执行完后移除：
- (void)removeFromLayer:(CALayer *)layerAnimation{

[layerAnimation removeFromSuperlayer];
}

#pragma mark - CAAnimationDelegate
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{

    if ([[anim valueForKey:@"animationName"]isEqualToString:@"groupsAnimation"]) {

        CABasicAnimation *shakeAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
        shakeAnimation.duration = 0.25f;
        shakeAnimation.fromValue = [NSNumber numberWithFloat:0.9];
        shakeAnimation.toValue = [NSNumber numberWithFloat:1];
        shakeAnimation.autoreverses = YES;
        // 这里是下方的自定义View上面放的btn. 自己随便定义一个 0.-
        //[_shopCartView.btnBackImg.layer addAnimation:shakeAnimation forKey:nil];

}
}