The document discusses Core Animation for iOS. It begins with introductions and examples of basic animations using UIView animation and UIImageView animation. It then discusses Core Animation fundamentals including CALayer, CATransaction, implicit and explicit animations. It provides examples of animations using CABasicAnimation, CAKeyframeAnimation, and following animation paths. It also discusses layer properties, transforms, and the Core Animation animation programming model.
12. 什么是Core Animation?
• Objc Class: graphics rendering, projection,
and animation
• provides fluid animations
• provide with Leopard
11年7月12日星期二
13. Why use Core Animation?
• High performance compositing with a
simple approachable programming model
• create complex user interfaces using a
hierarchy of layer objects
• A lightweight data structure
• allows animations to run on a separate
thread
• Improved application performance
• A flexible layout manager model
11年7月12日星期二
20. CATransaction
• CATransaction is the Core Animation
mechanism for batching multiple layer-
tree operations into atomic updates to the
render tree.
• Every modification to a layer tree must be
part of a transaction. Nested transactions
are supported.
• customize duration, timing function
11年7月12日星期二
22. CATransaction(Nested)
[CATransaction begin]; // outer transaction
// change the animation duration to 2 seconds
[CATransaction setValue:[NSNumber numberWithFloat:2.0f]
forKey:kCATransactionAnimationDuration];
// move the layer to a new position
theLayer.position = CGPointMake(0.0,0.0);
[CATransaction begin]; // inner transaction
// change the animation duration to 5 seconds
[CATransaction setValue:[NSNumber numberWithFloat:5.0f]
forKey:kCATransactionAnimationDuration];
// change the zPosition and opacity
theLayer.zPosition=200.0;
theLayer.opacity=0.0;
[CATransaction commit]; // inner transaction
[CATransaction commit]; // outer transaction
11年7月12日星期二
23. - (void)layoutContents
{
// layoutContents gets called via KVO whenever properties within our oalPlayback object change
// Wrap these layer changes in a transaction and set the animation duration to 0 so we don't get implicit animation
[CATransaction begin];
[CATransaction setValue:[NSNumber numberWithDouble:0.]
forKey: kCATransactionAnimationDuration] ;
// Position and rotate the listener
_listenerLayer.position = playback.listenerPos;
_listenerLayer.transform = CATransform3DMakeRotation(playback.listenerRotation, 0., 0., 1.);
// The speaker gets rotated so that it's always facing the listener
CGFloat rot = atan2(-(playback.sourcePos.x - playback.listenerPos.x), playback.sourcePos.y - playback.listenerPos.y);
// Rotate and position the speaker
_speakerLayer.position = playback.sourcePos;
_speakerLayer.transform = CATransform3DMakeRotation(rot, 0., 0., 1.);
void (^transactionEnd)(void);
transactionEnd = ^(void) {
NSLog(@"from opt");
};
[CATransaction setValue:oneFrom forKey: kCATransactionCompletionBlock ];
[CATransaction commit];
}
11年7月12日星期二
27. CATransition
• The CATransition class implements
transition animations for a layer. You can
specify the transition effect from a set of
predefined transitions or (on Mac OS X) by
providing a custom CIFilter(optional
Core Image filter object) instance.
11年7月12日星期二
28. // First create a CATransition object to describe the transition
CATransition
CATransition *transition = [CATransition animation];
// Animate over 3/4 of a second
transition.duration = 0.75;
// using the ease in/out timing function
transition.timingFunction = [CAMediaTimingFunction
functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
// Now to set the type of transition. Since we need to choose at random, we'll setup a couple of arrays to help
us.
NSString *types[4] = {kCATransitionMoveIn, kCATransitionPush,
kCATransitionReveal, kCATransitionFade};
NSString *subtypes[4] = {kCATransitionFromLeft,
kCATransitionFromRight, kCATransitionFromTop,
kCATransitionFromBottom};
int rnd = random() % 4;
transition.type = types[rnd];
if(rnd < 3) // if we didn't pick the fade transition, then we need to set a subtype too
{
transition.subtype = subtypes[random() % 4];
}
// Finally, to avoid overlapping transitions we assign ourselves as the delegate for the animation and wait for
the
// -animationDidStop:finished: message. When it comes in, we will flag that we are no longer transitioning.
transitioning = YES;
transition.delegate = self;
// Next add it to the containerView's layer. This will perform the transition based on how we change its
contents.
[containerView.layer addAnimation:transition forKey:nil];
// Here we hide view1, and show view2, which will cause Core Animation to animate view1 away and view2 in.
view1.hidden = YES;
view2.hidden = NO;
// And so that we will continue to swap between our two images, we swap the instance variables referencing them.
UIImageView *tmp = view2;
11年7月12日星期二
34. Implicit Animation
// assume that the layer is current positioned at
(100.0,100.0)
theLayer.position=CGPointMake(500.0,500.0);
Implicitly animating multiple properties of multiple
layers
// animate theLayer's opacity to 0 while moving it
// further away in the layer
theLayer.opacity=0.0;
theLayer.zPosition=-100;
// animate anotherLayer's opacity to 1
// while moving it closer in the layer
anotherLayer.opacity=1.0;
anotherLayer.zPosition=100.0;
11年7月12日星期二
38. CGMutablePathRef thePath = CGPathCreateMutable();
CGPathMoveToPoint(thePath,NULL,74.0,74.0);
CGPathAddCurveToPoint(thePath,NULL,74.0,500.0,
320.0,500.0,
320.0,74.0);
CGPathAddCurveToPoint(thePath,NULL,320.0,500.0,
566.0,500.0,
566.0,74.0);
CAKeyframeAnimation * theAnimation;
// create the animation object, specifying the position property as the
key path
// the key path is relative to the target animation object (in this case
a CALayer)
theAnimation=[CAKeyframeAnimation animationWithKeyPath:@"position"];
theAnimation.path=thePath;
// set the duration to 5.0 seconds
theAnimation.duration=5.0;
// release the path
CGPathRelease(thePath);
11年7月12日星期二
39. CALayer *welcomeLayer = placardView.layer;
// Create a keyframe animation to follow a path back to the center
CAKeyframeAnimation *bounceAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
bounceAnimation.removedOnCompletion = NO;
CGFloat animationDuration = 1.5;
// Create the path for the bounces
CGMutablePathRef thePath = CGPathCreateMutable();
CGFloat midX = self.center.x;
CGFloat midY = self.center.y;
CGFloat originalOffsetX = placardView.center.x - midX;
CGFloat originalOffsetY = placardView.center.y - midY;
CGFloat offsetDivider = 4.0;
BOOL stopBouncing = NO;
// Start the path at the placard's current location
CGPathMoveToPoint(thePath, NULL, placardView.center.x, placardView.center.y);
CGPathAddLineToPoint(thePath, NULL, midX, midY);
// Add to the bounce path in decreasing excursions from the center
while (stopBouncing != YES) {
CGPathAddLineToPoint(thePath, NULL, midX + originalOffsetX/offsetDivider, midY + originalOffsetY/offsetDivider);
CGPathAddLineToPoint(thePath, NULL, midX, midY);
...............
}
bounceAnimation.path = thePath;
bounceAnimation.duration = animationDuration;
// Create a basic animation to restore the size of the placard
CABasicAnimation *transformAnimation = [CABasicAnimation animationWithKeyPath:@"transform"];
transformAnimation.removedOnCompletion = YES;
transformAnimation.duration = animationDuration;
transformAnimation.toValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
// 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 alloc] initWithControlPoints:0.5 :1.0 :0.5 :0];
theGroup.animations = [NSArray arrayWithObjects:bounceAnimation, transformAnimation, nil];
// Add the animation group to the layer
[welcomeLayer addAnimation:theGroup forKey:@"animatePlacardViewToCenter"];
// Set the placard view's center and transformation to the original values in preparation for the end of the animation
placardView.center = self.center;
placardView.transform = CGAffineTransformIdentity;
}
11年7月12日星期二