ios - 如何驱动图像沿曲线运动?
黄舟
黄舟 2017-04-17 11:59:43
0
1
315

我在开发一个电子商务应用。当我向购物车添加项目的时候,我想要创建一个效果:项目的的图片遵循一个弯曲的路径并在购物车选项卡结束。
我怎样才能创建一个类似这样,图片沿曲线运动的动画效果?

原问题:How can I animate the movement of a view or image along a curved path?

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

reply all (1)
伊谢尔伦

Brad Larson♦
处理这一问题的最好方法是使用核心动画来实现图像运动,或者通过贝塞尔曲线查看。这使用CAKeyframeAnimation实现。例如:我使用下面的代码使图像视图成为icon达到简化目的。(观看 video for this application):
首先导入QuartzCore头文件#import

UIImageView *imageViewForAnimation = [[UIImageView alloc] initWithImage:imageToAnimate]; imageViewForAnimation.alpha = 1.0f; CGRect imageFrame = imageViewForAnimation.frame; //frame.origin,动画开始的地方 CGPoint viewOrigin = imageViewForAnimation.frame.origin; viewOrigin.y = viewOrigin.y + imageFrame.size.height / 2.0f; viewOrigin.x = viewOrigin.x + imageFrame.size.width / 2.0f; imageViewForAnimation.frame = imageFrame; imageViewForAnimation.layer.position = viewOrigin; [self.view addSubview:imageViewForAnimation]; // 淡出效果 CABasicAnimation *fadeOutAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"]; [fadeOutAnimation setToValue:[NSNumber numberWithFloat:0.3]]; fadeOutAnimation.fillMode = kCAFillModeForwards; fadeOutAnimation.removedOnCompletion = NO; //设置缩放 CABasicAnimation *resizeAnimation = [CABasicAnimation animationWithKeyPath:@"bounds.size"]; [resizeAnimation setToValue:[NSValue valueWithCGSize:CGSizeMake(40.0f, imageFrame.size.height * (40.0f / imageFrame.size.width))]]; resizeAnimation.fillMode = kCAFillModeForwards; resizeAnimation.removedOnCompletion = NO; // 设置路径运动 CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"]; pathAnimation.calculationMode = kCAAnimationPaced; pathAnimation.fillMode = kCAFillModeForwards; pathAnimation.removedOnCompletion = NO; //设置动画结束点 CGPoint endPoint = CGPointMake(480.0f - 30.0f, 40.0f); //在最后一个选项卡结束动画 //CGPoint endPoint = CGPointMake( 320-40.0f, 480.0f); CGMutablePathRef curvedPath = CGPathCreateMutable(); CGPathMoveToPoint(curvedPath, NULL, viewOrigin.x, viewOrigin.y); CGPathAddCurveToPoint(curvedPath, NULL, endPoint.x, viewOrigin.y, endPoint.x, viewOrigin.y, endPoint.x, endPoint.y); pathAnimation.path = curvedPath; CGPathRelease(curvedPath); CAAnimationGroup *group = [CAAnimationGroup animation]; group.fillMode = kCAFillModeForwards; group.removedOnCompletion = NO; [group setAnimations:[NSArray arrayWithObjects:fadeOutAnimation, pathAnimation, resizeAnimation, nil]]; group.duration = 0.7f; group.delegate = self; [group setValue:imageViewForAnimation forKey:@"imageViewBeingAnimated"]; [imageViewForAnimation.layer addAnimation:group forKey:@"savingAnimation"]; [imageViewForAnimation release];

Nikolai Ruhe
你可以使用CAKeyframeAnimation来实现UIView中心资源的动画。查看 CoreAnimation 编程指南。

    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template
    About us Disclaimer Sitemap
    php.cn:Public welfare online PHP training,Help PHP learners grow quickly!