SORU
17 Temmuz 2009, Cuma


Nasıl eğri bir yol boyunca bir görünüm veya görüntü hareketi animasyon miyim?

Ticaret bir uygulama geliştiriyorum. Alışveriş sepeti bir öğe eklerken, öğenin görüntüsü eğri bir yol izler ve sepeti sekmesi de biter nerede bir etki yaratmak istiyorum.

Nasıl böyle bir eğri boyunca bir görüntünün bir animasyon oluşturabilir miyim?

CEVAP
17 Temmuz 2009, Cuma


Nikolai söylediklerini genişletmek için, bu işlemek için en iyi yolu Temel Animasyon görüntü motion animasyon veya Bezier yol boyunca görüntülemek için kullanmaktır. Bu başarılı bir CAKeyframeAnimation kullanıyor. Örneğin, aşağıdaki kodu kaydetme video for this application görüldüğü gibi) belirtmek için bir simge haline bir bakış, bir görüntü animasyon için kullandım:

Tüm ithalat QuartzCore Başlığı dosyanın ilk #import <QuartzCore/QuartzCore.h>

UIImageView *imageViewForAnimation = [[UIImageView alloc] initWithImage:imageToAnimate];
imageViewForAnimation.alpha = 1.0f;
CGRect imageFrame = imageViewForAnimation.frame;
//Your image frame.origin from where the animation need to get start
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];

// Set up fade out effect
CABasicAnimation *fadeOutAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
[fadeOutAnimation setToValue:[NSNumber numberWithFloat:0.3]];
fadeOutAnimation.fillMode = kCAFillModeForwards;
fadeOutAnimation.removedOnCompletion = NO;

// Set up scaling
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;

// Set up path movement
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
pathAnimation.calculationMode = kCAAnimationPaced;
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.removedOnCompletion = NO;
//Setting Endpoint of the animation
CGPoint endPoint = CGPointMake(480.0f - 30.0f, 40.0f);
//to end animation in last tab use 
//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];

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • BuzzFeedVideo

    BuzzFeedVide

    10 AĞUSTOS 2011
  • Elly Awesome

    Elly Awesome

    15 ŞUBAT 2010
  • WiseOwlTutorials

    WiseOwlTutor

    21 EKİM 2011