iOS进阶

iOS-动画

2021-09-10  本文已影响0人  xiaofu666

学习动画之前,要先知道CALayer的一些属性

CALayer的基本属性

  1. 尺寸(bounds)
  2. 背影颜色(backgroundColor)
  3. 位置(position)
  4. 边框颜色(borderColor)、边框长度(borderWidth) "配合使用才有效果"
  5. 圆角(cornerRadius)
  6. 内容对象(contents) 通常设置图片,
  1. 阴影属性
  1. transform(CATransform3D)属性
    *缩放CATransform3DMakeScale
    *旋转CGAffineTransformMakeRotation,理解xyz方向的意思
    *平移CATransform3DMakeTranslation
    *熟练transform里的key Paths 如transform.scale transform.rotation transform.translation
    *查看文档,搜索CATransform3D key paths,了解更多key paths属性

UIView与CALayer的细节

  1. CALayer属于QuartzCore框架 与 CGColor所属于CoreGraphics框架
    QuartzCore框架与CoreGraphics框架都是可跨平台使用,能在iOS和Mac OS X上都能使用
  2. UIView比CALayer多了一个事件处理的功能
  3. CALayer有2个非常重要的属性:position和anchorPoint

@property CGPoint position;

用来设置CALayer在父层中的位置,以父层的左上角为原点(0, 0)

@property CGPoint anchorPoint;

称为“定位点”、“锚点”,决定着CALayer身上的哪个点会在position属性所指的位置,以自己的左上角为原点(0, 0),它的x、y取值范围都是0~1,默认值为(0.5, 0.5)

隐式动画

什么是隐式动画? -> 直接改变属性就会有动画效果

  1. 根层与非根层,
    *控件的layer属性是根层
    *控件的layer属性的子层就是非根层

  2. 非根层有隐式动画,根层是没有隐式动画的

  3. 隐藏动画怎么禁止

 [CATransaction begin];
 [CATransaction setDisableActions:YES];
 //设置隐式动画动画时间
  self.myview.layer.position = CGPointMake(10, 10);
 [CATransaction commit];

Core Animation

Core Animation是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍,使用它需要先添加QuartzCore.framework和引入对应的框架<QuartzCore/QuartzCore.h>
开发步骤:
初始化一个动画对象(CAAnimation)并设置一些动画相关属性
添加动画对象到层(CALayer)中,开始执行动画
CALayer中很多属性都可以通过CAAnimation实现动画效果,包括:opacity、position、transform、bounds、contents等(可以在API文档中搜索:CALayer Animatable Properties)
通过调用CALayer的addAnimation:forKey增加动画到层(CALayer)中,这样就能触发动画了。通过调用removeAnimationForKey可以停止层中的动画
Core Animation的动画执行过程都是在后台操作的,不会阻塞主线程

CAAnimation

所有动画对象的父类,负责控制动画的持续时间和速度,是个抽象类,不能直接使用,应该使用它具体的子类
属性解析:(红色代表来自CAMediaTiming协议的属性)

CAPropertyAnimation

是CAAnimation的子类,也是个抽象类,要想创建动画对象,应该使用它的两个子类:CABasicAnimation和CAKeyframeAnimation
属性解析:

CABasicAnimation

CAPropertyAnimation的子类
属性解析:

*keyPath 动画类型
/*如
 *平移动画: position / transform.translation.x
 *旋转动画: transform.rotation / transform.rotation.x / transform.rotation.y / transform.rotation.z
 *缩放动画: bounds / transform.scale / transform.scale.x / transform.scale.y
 */
* fromValue 动画开始位置
* toValue 动画结束位置
* byValue 动画增加值
* removedOnCompletion 动画完成后不要删除
* fillMode 保持最新状态
/*
 *默认动画执行后,会恢复到动画之前的状态
 *如果想保存动画之后的状态设置动画的removedOnCompletion=NO/fillMode=kCAFillModeForwards
 */
CAKeyframeAnimation

CApropertyAnimation的子类,跟CABasicAnimation的区别是:CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue),而CAKeyframeAnimation会使用一个NSArray保存这些数值
属性解析:

* values 动画轨迹
* timingFunction
* path 动画路径 如果设置了path values将被忽略
 /*如添加一个圆的路径
  *
  CGMutablePathRef path = CGPathCreateMutable();
  CGPathAddEllipseInRect(path, NULL, CGRectMake(10, 30, 300, 300));
  animation.path = path;
  CFRelease(path);
  */

CAAnimationGroup

CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行
属性解析:

CATransition

CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果。iOS比Mac OS X的转场动画效果少一点
UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果
属性解析:


type:动画类型

Common transition types.


subtype: 动画方向

当 type 为@"rotate"(旋转)的时候,它也有几个对应的 subtype,分别为:
90cw 逆时针旋转 90°
90ccw 顺时针旋转 90°
180cw 逆时针旋转 180°
180ccw 顺时针旋转 180°

UIView动画

UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持,执行动画所需要的工作由UIView类自动完成,但仍要在希望执行动画时通知视图,为此需要将改变属性的代码放在[UIView beginAnimations:nil context:nil]和[UIView commitAnimations]之间

+ (void)setAnimationDelegate:(id)delegate
//设置动画代理对象,当动画开始或者结束时会发消息给代理对象
+ (void)setAnimationWillStartSelector:(SEL)selector
//当动画即将开始时,执行delegate对象的selector,并且把beginAnimations:context:中传入的参数传进selector
+ (void)setAnimationDidStopSelector:(SEL)selector
//当动画结束时,执行delegate对象的selector,并且把beginAnimations:context:中传入的参数传进selector
+ (void)setAnimationDuration:(NSTimeInterval)duration
//动画的持续时间,秒为单位
+ (void)setAnimationDelay:(NSTimeInterval)delay
//动画延迟delay秒后再开始
+ (void)setAnimationStartDate:(NSDate *)startDate
//动画的开始时间,默认为now
+ (void)setAnimationCurve:(UIViewAnimationCurve)curve
//动画的节奏控制,具体看下面的”备注”
+ (void)setAnimationRepeatCount:(float)repeatCount
//动画的重复次数
+ (void)setAnimationRepeatAutoreverses:(BOOL)repeatAutoreverses
//如果设置为YES,代表动画每次重复执行的效果会跟上一次相反
+ (void)setAnimationTransition:(UIViewAnimationTransition)transition forView:(UIView *)view cache:(BOOL)cache
//设置视图view的过渡效果, transition指定过渡类型, cache设置YES代表使用视图缓存,性能较好

UIViewAnimationOptions

Block动画

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion

参数解析:
duration:动画的持续时间
delay:动画延迟delay秒后开始
options:动画的节奏控制
animations:将改变视图属性的代码放在这个block中
completion:动画结束后,会自动调用这个block

+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion

参数解析:
duration:动画的持续时间
view:需要进行转场动画的视图
options:转场动画的类型
animations:将改变视图属性的代码放在这个block中
completion:动画结束后,会自动调用这个block

+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion

方法调用完毕后,相当于执行了下面两句代码:

// 添加toView到父视图
[fromView.superview addSubview:toView];
// 把fromView从父视图中移除
[fromView.superview removeFromSuperview];

参数解析:
duration:动画的持续时间
options:转场动画的类型
animations:将改变视图属性的代码放在这个block中
completion:动画结束后,会自动调用这个block


#### UIImageView的帧动画
UIImageView可以让一系列的图片在特定的时间内按顺序显示
相关属性解析:
animationImages:要显示的图片(一个装着UIImage的NSArray)
animationDuration:完整地显示一次animationImages中的所有图片所需的时间
animationRepeatCount:动画的执行次数(默认为0,代表无限循环)
相关方法解析:

#### UIActivityIndicatorView
是一个旋转进度轮,可以用来告知用户有一个操作正在进行中,一般用initWithActivityIndicatorStyle初始化
方法解析:
* UIActivityIndicatorViewStyle                      有3个值可供选择:
* UIActivityIndicatorViewStyleWhiteLarge   //大型白色指示器
* UIActivityIndicatorViewStyleWhite             //标准尺寸白色指示器
* UIActivityIndicatorViewStyleGray               //灰色指示器,用于白色背景
上一篇下一篇

猜你喜欢

热点阅读