IOS 添加收藏的动画效果

- (void)showAnimation {
  CGPoint lbCenter = self.headerImageView.center;
  
  //the image which will play the animation soon
  UIImageView *imageView = [[UIImageView alloc] initWithImage:self.headerImageView.image];
  imageView.contentMode = UIViewContentModeScaleToFill;
  imageView.frame = self.headerImageView.frame;
  imageView.hidden = YES;
  imageView.center = lbCenter;
  
  //the container of image view
  CALayer *layer = [[CALayer alloc]init];
  layer.contents = imageView.layer.contents;
  layer.frame = imageView.frame;
  layer.opacity = 1;
  layer.cornerRadius = self.headerImageView.corneradus;
  layer.masksToBounds = YES;
  [self.view.layer addSublayer:layer];
  
  //动画 终点 都以self.view为参考系
  CGPoint endpoint = [self.view convertPoint:_favImageView.center fromView:self.navView];
  UIBezierPath *path = [UIBezierPath bezierPath];
  //动画起点
  CGPoint startPoint = [self.view convertPoint:lbCenter fromView:self.headerImageView.superview];
  [path moveToPoint:startPoint];
  //贝塞尔曲线控制点
  float sx = startPoint.x;
  float sy = startPoint.y;
  float ex = endpoint.x;
  float ey = endpoint.y;
  float x = sx + (ex - sx) / 3;
  float y = sy + (ey - sy) * 0.5 - 110;
  CGPoint centerPoint=CGPointMake(x, y);
  [path addQuadCurveToPoint:endpoint controlPoint:centerPoint];
  
  //key frame animation to show the bezier path animation
  CAKeyframeAnimation *animation=[CAKeyframeAnimation animationWithKeyPath:@"position"];
  animation.path = path.CGPath;
  animation.removedOnCompletion = NO;
  animation.fillMode = kCAFillModeForwards;
  animation.duration = 1.0;
  animation.delegate = self;
  animation.autoreverses = NO;
  animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
  [layer addAnimation:animation forKey:@"buy"];
  
  self.headerLayer = layer;
}

- (void)animationDidStart:(CAAnimation *)anim {
  if ([self.headerLayer animationForKey:@"buy"] == anim) {
    DDLogVerbose(@"animation start");
  }
}

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
  if (flag &&  [self.headerLayer animationForKey:@"buy"] == anim) {
     self.headerLayer.hidden = YES;
    [self.headerLayer removeAnimationForKey:@"buy"];
   
    [UIView animateWithDuration:0.4 delay:0.0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
      self.headerLayer.opacity = 0.0;
    } completion:^(BOOL finished) {
      if (finished) {
        [self.headerLayer removeFromSuperlayer];
        
        CGFloat duration = 0.4;
        [UIView animateWithDuration:duration animations:^{
          _favImageView.transform = CGAffineTransformMakeScale(1.55, 1.55);
        } completion:^(BOOL finished) {
          [UIView animateWithDuration:duration animations:^{
            _favImageView.transform = CGAffineTransformIdentity;
          }];
        }];
      }
    }];
  }
}

此文章不是给大家看的,看得懂的自然会明白怎么用!

上一篇:数据湖 VS 数据仓库之争?阿里提出大数据架构新概念:湖仓一体


下一篇:一步一步实现ATL开发的ActiveX组件与javascript的交互(一)