(一).在view层次上的动画
一、动画简单实用
/** setAnimationDelay的时间间隔一般设置在0.25~0.35s*/
//————方法1 ———
CGRect f = view.frame;
origin.y
[UIView beginAnimations:@"Ani1" context:@"123"];
[UIView setAnimationDelay:1.35f];
// 代理
[UIView setAnimationDelegate:self];
/**
UIViewAnimationCurveEaseOut 先快后慢
UIViewAnimationCurveEaseIn 先慢后快
UIViewAnimationCurveEaseInOut 先慢快后快慢
UIViewAnimationCurveLinear 水平
*/
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
//设置动画完毕执行的方法
UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)];
//动画开始
view.frame
动画结束
[UIView commitAnimations];
-(void)animationDidStop:(NSString
NSNumber
void
{
NSLog(@"%@---%@",animationID,context);
}
//————方法2 ———
[UIView animateWithDuration:1.35f animations:^(void)
{
// 旋转
//
view.transform = t;
//缩放
CGAffineTransform t1 = CGAffineTransformMakeScale(0.5, 0.5);
view.transform = t1;
//位移
CGAffineTransform t2 = CGAffineTransformMakeTranslation(3, 3);
view.transform = t2;
}];
二、关键帧动画
为UIView封装了一组API,让我们很容易的得到与Core Animation框架中的 CAKeyframeAnimation一样的效果。
注意:
delay 是推迟多少时间执行
duration:执行时间
UIViewAnimationOptionRepeat
UIViewAnimationOptionAutoreverse
…
1. [UIView animateKeyframesWithDuration:duration delay:delay
1. options:options animations:^{
2. [UIView addKeyframeWithRelativeStartTime:0.0
3. relativeDuration:0.5 animations:^{
4. //第一帧要执行的动画
5. }];
6. [UIView addKeyframeWithRelativeStartTime:0.5
7. relativeDuration:0.5 animations:^{
8. //第二帧要执行的动画
9. }];
10. } completion:^(BOOL
11. //动画结束后执行的代码块
12. }];
新引入的animateKeyframesWithDuration与CAKeyframeAnimation的关系,可以比对animateWithDuration和CABasicAnimation,我们只需要将每一帧动画加入到block方法中,并传入此段动画在全过程中的相对开始时间和执行时间(duration具体是指此段动画的执行时间占全过程的百分比)。同时,你可以在一次动画中使用多个关键帧,只需使用addKeyframe依次将所有关键帧加入动画执行栈中。
[UIView animateKeyframesWithDuration:3 delay:0 options:UIViewKeyframeAnimationOptionLayoutSubviews animations:^{
// first frame
[UIView addKeyframeWithRelativeStartTime:0.0 relativeDuration:0.15 animations:^{
// 顺时针旋转 90度
view.transform = CGAffineTransformMakeRotation(M_PI*-1.5);
}];
// second frame
[UIView addKeyframeWithRelativeStartTime:0.15 relativeDuration:0.10 animations:^{
// 180度
view.transform =CGAffineTransformMakeRotation(M_PI*1.0);
}];
//third frame
[UIView addKeyframeWithRelativeStartTime:0.25 relativeDuration:0.20 animations:^{
// 摆过中点 225度
view.transform = CGAffineTransformMakeRotation(M_PI*1.3);
}];
// fourth frame
[UIView addKeyframeWithRelativeStartTime:0.45 relativeDuration:0.20 animations:^{
// 再摆回来 140度
view.transform = CGAffineTransformMakeRotation(M_PI*0.8);
}];
// fifth frame
[UIView addKeyframeWithRelativeStartTime:0.65 relativeDuration:0.35 animations:^{
CGAffineTransform
CGAffineTransformMakeTranslation(180.0, 0.0);
CGAffineTransform
CGAffineTransformMakeRotation(M_PI*0.3);
view.transform = CGAffineTransformConcat(shift, rotate);
view.alpha
}];
completion:^(BOOL
}];
三、弹簧动画
弹簧动画
iOS7新引入的另一个block方法可以让你轻松将真实物理世界中的弹性效果集成进视图动画中。苹果公司一直建议开发者尽可能将动画效果做的跟真实物理世界一样——在视图滑动时,可以像弹簧一样,稍微拉伸一些,再弹回正确位置。使用新的弹簧动画API来实现此效果相较以往要简单很多。
usingSpringWithDamping:阻尼值越接近0时,弹性越明显
velocity参数代表弹性修正速度,它表示视图在弹跳时恢复原位的速度,例如,如果在动画中视图被拉伸的最大距离是200像素,你想让视图以100像素每秒的速度恢复原位,那么就设置velocity的值为0.5。
[UIView animateWithDuration:2 delay:0.0 usingSpringWithDamping:0.1 initialSpringVelocity:1 options:UIViewAnimationOptionCurveEaseInOut animations:^{
// 旋转
CGAffineTransform t = CGAffineTransformRotate(view.transform, 0.3);//
// view.transform = t;
//缩放
CGAffineTransform t1 = CGAffineTransformMakeScale(0.5, 0.5);
// view.transform = t1;
//位移
CGAffineTransform t2 = CGAffineTransformMakeTranslation(0, 100);
view.transform
completion:^(BOOL
}];
代码中damping设置为0.8不够明显,你可以将damping调为0.1,然后慢慢调整velocity看看效果)
0.8,弹性修正速度为1.0,运行后可以看到,视图将冲出15像素的距离,然后慢慢降回原位。如果我设置弹性阻尼为0.6或者更小,那么视图会冲得更高,而且降回原位前还会继续向下反弹。(也就是停止前来回弹的次数越来越多,弹性效果越来越明显)需要注意的是,不要将弹性动画与UIKit的动态特效引擎相混淆。弹性动画是一个标准的UIView动画API,仅仅提供了有限的几种真实物理效果。
屏幕快照
iOS7 以前, 获取一个UIView的快照有以下步骤: 首先创建一个UIGraphics的图像上下文,然后将视图的layer渲染到该上下 文中,从而取得一个图像,最后关闭图像上下文,并将图像显示在UIImageView中。
现在我们只需要一行代码就可以完成上述步骤了:
- [view snapshotViewAfterScreenUpdates:NO];
UIView的副本,如果我们希望视图在执行动画之前保存现在的外观,以备之后使用(动画中视图可能会被子视图遮盖或者发生其他一些变 化),该方法就特别方便。
afterUpdates参数表示是否在所有效果应用在视图上了以后再获取快照。例如,如果该参数为NO,则立马获取该视图现在状态的快照,反之,以下代码只能得 到一个空白快照:
- [view snapshotViewAfterScreenUpdates:YES];
- [view setAlpha:0.0];
由于我们设置afterUpdates参数为YES,而视图的透明度值被设置成了0,所以方法将在该设置应用在视图上了之后才进行快照,于是乎屏幕空空如也。另外就是……你可以对快照再进行快照……继续快照……
结论
苹果公司在iOS7中为开发者添加了新的用于创建和自定义动画的API。iOS7 SDK不仅引入了强大的动画block和许多易于使用的方法,而且彻底改变了为视图自定义动画的方式。
(二)在layer层动画
前提要导入包:#import <QuartzCore/QuartzCore.h>
一、基础动画效果
二、帧动画
CABasicAnimation
自己只有三个
property fromValue toValue ByValue
CABasicAnimation provides basic,single-keyframe animation capabilities for a layer property.
>创建CABasicAnimation>设置属性值:duration、toValue、autoreverse 、repeatCount> 加入控件中的layer中
//
动画效果
CGRect r = CGRectMake(0, 0, 120, 120);
@“position” @“bounds”
// bounds is layer's property
// position is layer's property
CABasicAnimation *ani = [CABasicAnimation animationWithKeyPath:@"position"];
ani.duration = .35f;
ani.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
// ani.toValue = [NSValue valueWithCGRect:r];
ani.toValue = [NSValue valueWithCGPoint:self.view.center];
//
路径反转
ani.autoreverses = YES;
ani.repeatCount = 100;
[view.layer addAnimation:ani forKey:@"ani-1"];
//动画是在多线程执行的
创建CAKeyframeAnimation对象>加入values>设置对象的属性值>加入空件的layer中
//---------帧动画
CGPoint c =tf.center;
CGPoint l = CGPointMake(c.x - 15,c.y);
CGPoint r =CGPointMake(c.x + 15,c.y);
CAKeyframeAnimation *ani = [CAKeyframeAnimation animationWithKeyPath:@"position"];
ani.values = [NSArray arrayWithObjects:
NSValue valueWithCGPoint:l],
NSValue valueWithCGPoint:c],
NSValue valueWithCGPoint:r],
NSValue valueWithCGPoint:c],
NSValue valueWithCGPoint:l],
NSValue valueWithCGPoint:c],
nil];
autoreverses = YES;
repeatCount
[tf.layer addAnimation:ani forKey:@"122"];