Core animation-CAAnimation, core caanimation

Core animation-CAAnimation, core caanimation

1. What is core animation?

CAAnimation, the core animation, uses the CAMediaTiming protocol to adjust the time, including the duration, speed, and number of repetitions. The CAAction protocol is used to display the animation in response to the action, CAAnimation can be classified into implicit animation and display animation.

Some Derived classes of CAAnimation:

CAPropertyAnimation: Property animation. animation effect is generated by changing the property value.

<1> CABasicAnimation: a basic animation. It can only be a change between two vertices, providing a single animation.

CASpringAnimation: Spring animation (bullet effect)

<2> CAKeyframeAnimation: Key Frame Animation. You can add changes to multiple points or add paths to define the action route.

CAAnimationGroup: animation group. You can add multiple types of animations at the same time to achieve the expected effect.

CATransition: Transition animation, which adds animation effects when switching views

The following is a structure chart for you to learn more easily.

 CALayer: layer implicit Animation

UIView: The view can interact with the user. If the rootLayer changes, the child layer also changes, and the rootLayer has no animation effect.

CALayer: it cannot interact with users and can only display content. When a child layer is changed, it does not follow the change and its own animation effect (when the attribute effect is changed) is an implicit animation.

 Attributes that can be set by CALayer

@ Property CGRect bounds; border range

@ Property CGPoint position; center point

 @ Property CGFloat zPosition; Z axis center point

@ Property CGPoint anchorPoint; anchorPoint

@ Property CGFloat anchorPointZ; Z axis anchorPointZ

@ Property CATransform3D transform; conversion form

@ Property CGRect frame; NO. Animatable Coordinate

@ Property (getter = isHidden) BOOL hidden; hide

@ Property (getter = isDoubleSided) BOOL doubleSided; whether the back of the layer is displayed

@ Property (getter = isGeometryFlipped) BOOL geometryFlipped; Reverse flip

@ Property BOOL masksToBounds; border Cropping

@ Property (nullable, strong) id contents; Content

@ Property (getter = isOpaque) BOOL opaque; opacity

@ Property BOOL allowsEdgeAntialiasing; whether to use deformation-resistant tooth

@ Property (nullable) CGColorRef backgroundColor; background color

@ Property CGFloat borderWidth; Border Width

@ Property (nullable) CGColorRef borderColor; border color

@ Property float opacity; opacity

@ Property (nullable) CGColorRef shadowColor; shadowColor

@ Property float shadowOpacity; shadow opacity

@ Property CGFloat rasterizationScale; prevents Retina from pixel-based screens

@ Property CGSize shadowOffset; shadow offset

@ Property CGFloat shadowRadius;Shadow radius

The maximum value of the ✮ anchor is 0.5, and the minimum value is 0.5. The default value is. When the view changes, it is changed based on the anchor.

Value and position of the anchor

0, 0 = in the upper left corner of the layer

0, 1 = lower left corner of the layer

1, 0 = upper right corner of the layer

= At the bottom right corner of the layer

Calculation Formula of the anchor: Anchor value = position of the anchor in the view. x. y/width and height of the View

The following uses watches and clocks as an example to introduce the core Animation:

# Import "ViewController. h "# define Angle (a) * M_PI/180 # define SAngle 6 // The degree of rotation per second @ interface ViewController () {CALayer * layer; float s ;} @ property (nonatomic, strong) CALayer * pointLayer; @ property (nonatomic, strong) CALayer * minuteLayer; @ property (nonatomic, strong) CALayer * SecondtLayer; @ end @ implementation ViewController-(void) viewDidLoad {[super viewDidLoad]; // ** layers cannot interact with users, and cannot add response events // initialize CALayer addSubLa Yer: Method to add to parent layer/* layer = [CALayer layer]; layer. frame = CGRectMake (0, 0,100,100); layer. cornerRadius = 50; layer. backgroundColor = [UIColor yellowColor]. CGColor; [self. view. layer addSublayer: layer]; */UIImageView * image = [[UIImageView alloc] initWithFrame: CGRectMake (0, 0, self. view. frame. size. width, self. view. frame. size. width)]; image. image = [UIImage imageNamed: @ "biaopan"]; image. contentMode = UIViewContentModeScaleAspectFit; image. center = self. view. center; [self. view addSubview: image]; self. secondtLayer. anchorPoint = CGPointMake (0.5, 0.9); self. secondtLayer. contents = (id) [UIImage imageNamed: @ "miaozhen"]. CGImage; self. minuteLayer. anchorPoint = CGPointMake (0.5, 0.9); self. minuteLayer. contents = (id) [UIImage imageNamed: @ "fenzhen"]. CGImage; self. pointLayer. anchorPoint = CGPointMake (0.5, 0.9); // The color CGColorRef image CGImageRef self is required on the layer. pointLayer. contents = (id) [UIImage imageNamed: @ "shiztasks"]. CGImage; [NSTimer scheduledTimerWithTimeInterval: 1 target: self selector: @ selector (start) userInfo: nil repeats: YES];}-(void) start {// a calendar class NSCalendar obtains the year, month, day, hour, minute, second // NSDateComponents component NSCalendar * calendar = [NSCalendar currentCalendar]; // (NSCalendarUnit) required component to obtain the date of the component NSDateComponents * component = [Calendar components: NSCalendarUnitHour | NSCalendarUnitMinute | NSCalendarUnitSecond fromDate: [NSDate date]; s = component. second * SAngle; self. secondtLayer. transform = CATransform3DMakeRotation (Angle (s), 0, 0, 1); self. secondtLayer. anchorPoint = CGPointMake (0.5, 0.9); self. secondtLayer. contents = (id) [UIImage imageNamed: @ "miaozhen"]. CGImage; float m = component. minute * SAngle; self. minuteLayer. tran Sform = CATransform3DMakeRotation (Angle (m), 0, 0, 1); self. minuteLayer. anchorPoint = CGPointMake (0.5, 0.9); self. minuteLayer. contents = (id) [UIImage imageNamed: @ "fenzhen"]. CGImage; float h = component. hour * SAngle; self. pointLayer. transform = CATransform3DMakeRotation (Angle (h), 0, 0, 1); self. pointLayer. anchorPoint = CGPointMake (0.5, 0.9); self. pointLayer. contents = (id) [UIImage imageNamed: @ "shiztasks "]. CGImage;}-(CALayer *) pointLayer {if (_ pointLayer) {return _ pointLayer;} _ pointLayer = [CALayer layer]; _ pointLayer. boolean = CGRectMake (0, 0, 29,200); _ pointLayer. position = self. view. center; [self. view. layer addSublayer: _ pointLayer]; return _ pointLayer;}-(CALayer *) minuteLayer {if (_ minuteLayer) {return _ minuteLayer;} _ minuteLayer = [CALayer layer]; _ minuteLayer. bounds = CGRectMake (0, 0, 21,210); _ minuteLayer. position = self. view. center; [self. view. layer addSublayer: _ minuteLayer]; return _ minuteLayer;}-(CALayer *) SecondtLayer {if (_ SecondtLayer) {return _ SecondtLayer;} _ SecondtLayer = [CALayer layer]; _ SecondtLayer. bounds = CGRectMake (0, 0, 21,230); _ SecondtLayer. position = self. view. center; [self. view. layer addSublayer: _ SecondtLayer]; return _ SecondtLayer;}-(void) touchesBe Gan :( NSSet <UITouch *> *) touches withEvent :( UIEvent *) event {/* UITouch * touch = [touches anyObject]; layer. position = [touch locationInView: self. view]; CGFloat width = CGRectGetWidth (layer. bounds )! = 100? 100:25; layer. bounds = CGRectMake (0, 0, width, width); CGColorRef color = [UIColor lightGrayColor]. CGColor! = Layer. backgroundColor? [UIColor lightGrayColor]. CGColor: [UIColor yellowColor]. CGColor; layer. backgroundColor = color; layer. shadowColor = [UIColor blackColor]. CGColor; layer. geometryFlipped = YES; layer. cornerRadius = layer. cornerRadius! = 50? 50: 0; // The transparency layer of the layer. opacity = 0; * // vertex self. secondtLayer. transform = CATransform3DMakeRotation (Angle (60), 0, 0, 1); self. minuteLayer. transform = CATransform3DMakeRotation (Angle (s/60), 0, 0, 1); self. pointLayer. transform = CATransform3DMakeRotation (Angle (s/360), 0, 0, 1);}-(void) touchesEnded :( NSSet <UITouch *> *) touches withEvent :( UIEvent *) event {// layer. opacity = 1; self. pointLayer. transform = CATransform3DIdentity;} @ end

The effect is as follows: