实现图片抛物线的效果

实现图片抛物线的效果

最近做项目，需要实现图片抛物线效果，研究了下，方法有二；

方法一：

-(void)isButtonClicked:(id)sender

{

    CGRect rect = [self.view convertRect:((UIButton *)sender).bounds fromView:sender];

    UIImageView *imageView = [[[UIImageView alloc] initWithFrame:CGRectMake(0, 10, 30, 30)] autorelease];

    imageView.frame = CGRectMake(rect.origin.x+10, rect.origin.y, 30, 30);

    [self.view addSubview:imageView];

    

    imageView.image = [UIImage imageNamed:@"forward.png"];

    CAKeyframeAnimation *bounceAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

    CGMutablePathRef thePath = CGPathCreateMutable();

    CGPathMoveToPoint(thePath, NULL, imageView.frame.origin.x, imageView.frame.origin.y);

    CGPathAddQuadCurveToPoint(thePath, NULL, 220, 30, 230, 440);

    bounceAnimation.duration = 1.0f;

    bounceAnimation.path = thePath;

    bounceAnimation.delegate = self;

    [bounceAnimation setValue:imageView forKey:@"image"];

    [imageView.layer addAnimation:bounceAnimation forKey:@"move"];

    CGPathRelease(thePath);

    imageView.layer.position = CGPointMake(1000, 300);

}

方法二：

-(void)TransAnimation:(UIImage *)image

{

   #define PI 3.14159265

    CGRect  headImageOrgRect = headImageView.frame;

    CGSize size = image.size;

    

    

    CGFloat midX = headImageView.center.x;

    CGFloat midY = headImageView.center.y;

    

    [headImageView  setFrame:CGRectMake(0, 0, size.width, size.height)];

    CALayer *TransLayer = headImageView.layer;

    

    // Create a keyframe animation to follow a path back to the center

    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

    animation.removedOnCompletion = NO;

    

    CGFloat animationDuration = 0.3;

    

    

    // Create the path for the bounces

    CGMutablePathRef thePath = CGPathCreateMutable();

    

    

    CGFloat originalOffsetX = headImageView.center.x - midX;

    CGFloat originalOffsetY = headImageView.center.y - midY;

    

    BOOL stopAnimation = NO;

    

    CGPathMoveToPoint(thePath, NULL, headImageView.center.x, headImageView.center.y);

    float  xPosition ;

    float  yPosition ;

    float   angle = 0.0f;

    

    

    while (stopAnimation != YES) {

        

        xPosition = headImageView.center.x - originalOffsetX*sin(angle*(PI/180));

        yPosition = headImageView.center.y - originalOffsetY*sin(angle*(PI/180));

        CGPathAddLineToPoint(thePath, NULL, xPosition, yPosition);

        

        

        angle = angle +1.0f;   

        

        if(angle == 90.0f||angle > 90.0f)  

            stopAnimation = YES;

    }

    

    [headImageView  setCenter:CGPointMake(midX,midY)];

    

    animation.path = thePath;

    CGPathRelease(thePath);

    animation.duration = animationDuration;

    

    

    // Create a basic animation

    CABasicAnimation *shrinkAnimation = [CABasicAnimation animationWithKeyPath:@"bounds"];

    

    shrinkAnimation.removedOnCompletion = YES;

    shrinkAnimation.duration = animationDuration;

    shrinkAnimation.fromValue = [NSValue valueWithCGRect:headImageView.frame];

    shrinkAnimation.byValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];

    shrinkAnimation.toValue = [NSValue valueWithCGRect:headImageOrgRect];

    

    

    // Create an animation group to combine the keyframe and basic animations

    CAAnimationGroup *theGroup = [CAAnimationGroup animation];

    

    // Set self as the delegate to allow for a callback to reenable user interaction

    theGroup.delegate = self;

    theGroup.duration = animationDuration;

    theGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

    

    theGroup.animations = [NSArray arrayWithObjects:animation, shrinkAnimation, nil];

    

    

    // Add the animation group to the layer

    [TransLayer addAnimation:theGroup forKey:@"animatePlacardViewToCenter"];

    

    // Set the  view's center and transformation to the original values in preparation for the end of the animation

    

    headImageView.transform = CGAffineTransformIdentity;

    [headImageView   setFrame:headImageOrgRect];

}