Ios (CoreAnimation core Animation 1) CABasicAnimation animation and anchor

Ios (CoreAnimation core Animation 1) CABasicAnimation animation and anchor

I. position and anchorPoint

Position: used to set the position of CALayer in the parent layer, starting from the upper left corner of the parent layer (0, 0)

AnchorPoint (anchorPoint ):

It is called "positioning point" and "anchor"

Determines the position indicated by the position attribute of CALayer.

Use your own upper left corner as the origin (0, 0)

The value range of x and y is 0 to 0 ~ 1. The default value is (0.5, 0.5)

We recommend that you set a connection: Seek (0.5, 0.5). If you reset the anchor, the entire control is moved when you run the animation. Therefore, you need to reset the position when setting the anchor,

CGPoint oldAnchorPoint = _ homeBtn. layer. anchorPoint;

_ HomeBtn. layer. anchorPoint = CGPointMake (0.5, 0 );

[_ HomeBtn. layersetPosition: CGPointMake (_ homeBtn. layer. position. x + _ homeBtn. layer. bounds. size. width * (_ homeBtn. layer. anchorPoint. x-oldAnchorPoint. x), _ homeBtn. layer. position. y + _ homeBtn. layer. bounds. size. height * (_ homeBtn. layer. anchorPoint. y-oldAnchorPoint. y)];

Ii. Use of CABasicAnimation

When you create a CABasicAnimation, you need to use-setFromValue and-setToValue to specify a start value and end value. When you add the basic animation to the layer, it starts to run.

Autoreverses

When you set this attribute to YES, after it reaches the destination, the animation returns to the starting value, instead of directly redirecting to the starting value.

Duration
You are quite familiar with the Duration parameter. It sets the time spent from the start value to the end value. It will be affected by the speed attribute. RemovedOnCompletion
This attribute is YES by default, which means that the animation is automatically removed from the layer after the specified time period is completed. This is generally not required.

If you want to use this animation again, you need to set this attribute to NO. In this way, the next time you use the-set method to set the attributes of an animation, it will use your animation again, instead of the default animation.

Speed

The default value is 1. 0. This means that the animation is played at the default speed. If you change the value to 2.0, the animation will be played at twice the speed. This effect is to reduce the duration by half. If the duration you specify is 6 seconds and the speed is 2.0, the animation will be played for 3 seconds-half of the duration.

BeginTime

This attribute is useful in group animation. It specifies the start time of the animation based on the duration of the parent animation group. The default value is 0. 0. The Group Animation will discuss "Animation Grouping" in the next section ".

TimeOffset

If a time offset is set, the animation will not be truly visible until the time obtained based on the execution time in the parent animation group passes.

RepeatCount

The default value is 0, indicating that the animation is played only once. If you specify an infinite number of repetitions, use 1e100f. This should not be used with the repeatDration attribute.

RepeatDuration

This attribute specifies how long the animation should be repeated. The animation repeats until the specified time passes. It should not be used with repeatCount.

Sample Code:

CGPoint fromPoint = self. testImage. center; // The path curve controlPoint is the reference point UIBezierPath * movePath = [describezierpath]; [movePath moveToPoint: fromPoint]; CGPoint toPoint = CGPointMake (300,460); [movePath addQuadCurveToPoint: toPoint: CGPointMake (300, 0)]; // sets the animation path CAKeyframeAnimation * moveAnimation = [CAKeyframeAnimation animationWithKeyPath: @ "position"]; // moveAnimation. path = movePath. CGPath; moveAnimation. values = @ [[NSValue usage: CGPointMake (100,100)], [NSValue valueWithCGPoint: CGPointMake (100,300)], [NSValue valueWithCGPoint: CGPointMake (300,300)], [NSValue usage: CGPointMake (300,100)]; moveAnimation. removedOnCompletion = YES; // scaling change CABasicAnimation * scaleAnimation = [CABasicAnimation animationWithKeyPath: @ "transform"]; scaleAnimation. fromValue = [NSValue valueWithCATransform3D: CATransform3DIdentity]; scaleAnimation. toValue = [NSValue valueWithCATransform3D: CATransform3DMakeScale (0.1, 0.1, 1.0)]; scaleAnimation. removedOnCompletion = YES; // transparency change // CABasicAnimation * opacityAnimation = [CABasicAnimation animationWithKeyPath: @ "alpha"]; // opacityAnimation. fromValue = [NSNumber numberWithFloat: 1.0]; // opacityAnimation. toValue = [NSNumber numberWithFloat: 0.1]; // opacityAnimation. removedOnCompletion = YES; // rotate CABasicAnimation * tranformAnimation = [CABasicAnimation animationWithKeyPath: @ "transform. rotation. z "]; tranformAnimation. fromValue = [NSNumber numberWithFloat: 0.f]; tranformAnimation. toValue = [NSNumber numberWithFloat: M_PI]; tranformAnimation. cumulative = YES; tranformAnimation. removedOnCompletion = YES; CAAnimationGroup * animaGroup = [CAAnimationGroup animation]; animaGroup. animations = @ [moveAnimation, scaleAnimation, tranformAnimation]; animaGroup. duration = 2.f;

You can change the animation by changing the animation withkeypath:

Transform. scale = proportional Scaling

Transform. scale. x = percent ratio Ratio

Transform. scale. y = high proportion of distributed bytes

Transform. rotation. z = Rotating plane of the plane worker

Opacity = transparency

Margin

ZPosition

BackgroundColor background color

CornerRadius rounded corner

BorderWidth

Bounds

Contents

ContentsRect

CornerRadius

Frame

Hidden

Mask

MasksToBounds

Opacity

Position

ShadowColor

ShadowOffset

ShadowOpacity

ShadowRadius

58 city client, tabbar click animation effect, you can set the CABasicAnimation attribute to do, the individual spent an hour to deal with, prove that it can be fully achieved,

CGPoint oldAnchorPoint = _ homeBtn. layer. anchorPoint; _ homeBtn. layer. anchorPoint = CGPointMake (0.5, 0); [_ homeBtn. layer setPosition: CGPointMake (_ homeBtn. layer. position. x + _ homeBtn. layer. bounds. size. width * (_ homeBtn. layer. anchorPoint. x-oldAnchorPoint. x), _ homeBtn. layer. position. y + _ homeBtn. layer. bounds. size. height * (_ homeBtn. layer. anchorPoint. y-oldAnchorPoint. y)]; CABasicAnimation * shakeAnima Tion = [CABasicAnimation animationWithKeyPath: @ "transform. rotation. z "]; shakeAnimation. duration = 0.07; shakeAnimation. autoreverses = YES; // when you set this attribute to YES, after it reaches the destination, the animation returns to the starting value, instead of directly redirecting to the starting value. ShakeAnimation. repeatCount = 2; shakeAnimation. removedOnCompletion = NO; shakeAnimation. fromValue = [NSNumber numberWithFloat:-0.05]; shakeAnimation. toValue = [NSNumber numberWithFloat: 0.05]; [self. homeBtn. layer addAnimation: shakeAnimation forKey: @ "shakeAnimation"];