iOS进阶_动画的多种实现方式

一、UIView动画

//UIView动画有开始beginAnimation,有结束commitAnimation
    //第一步:开始UIView动画
    [UIView beginAnimations:@"标识ID(可随意命名)" context:nil];
    //第二步:设置动画时长
    [UIView setAnimationDuration:3];
    //第三步:设置UIView动画的回调代理
    [UIView setAnimationDelegate:self];
    //第四步:设置相关的对象的frame(或者color,alpha等属性)
    _testView.frame = CGRectMake(100, 100, 200, 100);

_testView.backgroundColor = [UIColor redColor];

_testView.alpha = 0.2;
    //第五步:结束动画(提交动画效果)
    [UIView commitAnimations];

第三步满足回调协议后走协议方法:

//开始动画时的方法
- (void)animationWillStart:(NSString *)animationID context:(void *)context {
    NSLog(@"ID = %@,context = %@", animationID, context);
}

//结束动画时的方法
- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {
    NSLog(@"ID = %@,context = %@", animationID, context);
}

二、CoreAnimation动画

1.layer的属性

#pragma mark - Layer的常用属性

    /*
    //设置图片为圆角
    self.imageView.layer.cornerRadius = self.imageView.frame.size.width / 2;
    //注意:光设置上边一句代码是实现不了效果的(masksToBounds这个属性影响layer层的阴影效果,导致阴影不显示)
    //允许改变角度
    //self.imageView.layer.masksToBounds = YES;

    //设置layer的阴影颜色
    self.imageView.layer.shadowColor = [UIColor redColor].CGColor;
    //设置layer层的透明度
    self.imageView.layer.shadowOpacity = 0.5f;
    //设置阴影的偏移量
    self.imageView.layer.shadowOffset = CGSizeMake(-20, 10);
    //设置阴影的模糊度
    self.imageView.layer.shadowRadius = 1.0f;

    //需求:拖进来一个UIView设置它的阴影
    self.myView.layer.shadowColor = [UIColor blackColor].CGColor;
    self.myView.layer.shadowOpacity = 1;
    self.myView.layer.shadowOffset = CGSizeMake(20, 0);
    //self.imageView.layer.shadowRadius = 3;

    */

layer常用属性

2.各种动画实现方法步骤

  • 声明方法名称
  • 赋给对应动画操作的keyPath
  • 设置动画操作需要的属性值
  • 将该动画操作添加给图片的layer进行操作
#pragma mark - CASpringAnimation动画按钮的响应方法
- (IBAction)springAnimation:(id)sender {

    CASpringAnimation *springAnimation = [CASpringAnimation animation];

    springAnimation.keyPath = @"transform.scale";
    springAnimation.fromValue = @1;
    springAnimation.toValue = @0.25;
    springAnimation.duration = 3.0f;
    [self.imageView.layer addAnimation:springAnimation forKey:@"springAnimation"];

}

#pragma mark - CAAnimationGroup组动画按钮的响应方法
- (IBAction)animationGroup:(id)sender {

    //平移动画
    CABasicAnimation *basicAnimation1 = [CABasicAnimation animation];
    basicAnimation1.keyPath = @"transform.translation.y";
    basicAnimation1.toValue = @(400);

    //缩小动画
    CABasicAnimation *basicAnimation2 = [CABasicAnimation animation];
    basicAnimation2.keyPath = @"transform.scale";
    basicAnimation2.toValue = @(0.2);

    //旋转动画
    CABasicAnimation *basicAnimation3 = [CABasicAnimation animation];
    basicAnimation3.keyPath = @"transform.rotation";
    basicAnimation3.toValue = @(M_PI);

    //需要创建管理各个动画的动画组
    CAAnimationGroup *group = [CAAnimationGroup animation];
    group.animations = @[basicAnimation1, basicAnimation2, basicAnimation3];
    group.duration = 5.0f;

    [self.imageView.layer addAnimation:group forKey:@"groupAnimation"];

}

#pragma mark - CAKeyframeAnimation动画按钮的响应方法
- (IBAction)keyFrameAnimation:(id)sender {

    //第一步:创建对象
    CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animation];
    //第二步:设置动画轨迹
    keyFrameAnimation.keyPath = @"transform.rotation";
    //第三步:设置旋转角度(弧度的计算公式:度数/180*π)(π = M_PI)
    keyFrameAnimation.values = @[@(0 / 180.0 * M_PI), @(360 / 180.0 * M_PI)];
    keyFrameAnimation.repeatCount = 3;
    //第四步:设置时长
    keyFrameAnimation.duration = 3.0f;
    //第五步:添加动画到layer层
    [self.imageView.layer addAnimation:keyFrameAnimation forKey:@"keyFrameAnimation"];

}

#pragma mark - CABasicAnimation动画的响应方法
- (IBAction)basicAnimation:(id)sender {

    /***************移动效果***************/

    //第一步:创建动画对象
    CABasicAnimation *basicAnimation = [CABasicAnimation animation];
    //第二步:告诉layer层需要执行什么样子的动画[后面设置的内容为CALayer的相关属性]
    basicAnimation.keyPath = @"position";
    //第三步:告诉layer从哪里来,到哪里去
    basicAnimation.fromValue = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
    basicAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(300, 300)];
    //注意点:如果要实现移动到的位置不回到原来的位置,需要实现以下两句代码
    basicAnimation.removedOnCompletion = NO;
    //设置保存动画状态的内容
    basicAnimation.fillMode = kCAFillModeForwards;
    //第四步:设置动画持续时长
    basicAnimation.duration = 4;
    //第五步:将要执行的动画添加到calayer上
    [self.imageView.layer addAnimation:basicAnimation forKey:@"basic1"];

    /***************翻转效果***************/
    CABasicAnimation *basic = [CABasicAnimation animation];
    basic.keyPath = @"transform";
    //设置翻转到的地方
    basic.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0, 0, 1)];
    basic.duration = 2.0f;
    [self.imageView.layer addAnimation:basic forKey:@"basic2"];

    //根据key去除移除动画
//    [self.imageView.layer removeAnimationForKey:@"basic1"];

}
时间: 2024-10-25 05:23:46

iOS进阶_动画的多种实现方式的相关文章

iOS进阶_地图上定位的标志——大头针

一.添加大头针 地图使用的框架是MapKit 大头针走的是MKAnnotation协议 /* 注意:因为是满足协议MKAnnotation,所以没有MKAnnotation的系统大头针类,必须自定义大头针类,我自定义的为MyAnnotation 大头针: 在iOS开发中经常会标记某个位置,需要使用地图标注,也就是大家俗称的“大头针”.只要一个NSObject类实现MKAnnotation协议就可以作为一个大头针,通常会重写协议中coordinate(标记位置).title(标题).subtitl

强大的CSS3/JS:帧动画的多种实现方式与性能对比

Web动画形式 首先我们来了解一下Web有哪些动画形式 1\. CSS3动画 Transform(变形) Transition(过渡) Animation(动画) 2\. JS动画(操作DOM.修改CSS属性值) 3\. Canvas动画 4\. SVG动画 5\. 以Three.js为首的3D动画 以上各种动画形式都可以制作出一种类型的动画,那就是帧动画,也叫序列帧动画,定格动画,逐帧动画等,这里我们统一用帧动画来表述. 这里推荐一下我的前端学习交流扣qun:767273102 ,里面都是学习

IOS中实现动画的几种方式

1.UIView首末式动画(实现渐变效果) [UIView animateWithDuration:...] 在修改了自动布局的约束之后,执行下面代码实现动画效果 [UIView animateWithDuration:1.0 animations:^{ [添加了约束的view layoutIfNeeded]; }]; 2.UIImageView的startAnimating系列方法播放帧动画. 3.当对非Root Layer的部分属性(可动画属性)进行修改时,默认会自动产生一些动画效果(隐式动

iOS学习_动画

UIView动画 改变UIView的frame: - (IBAction)changeFrame:(id)sender { //UIView动画有开始beginAnimation, 有结束commitAnimation //第一步:开始UIview动画 [UIView beginAnimations:@"move" context:nil]; //第二步:设置动画的时长 [UIView setAnimationDuration:3]; //第三步:设置代理 [UIView setAni

iOS进阶_三方使用步骤

一.配置环境(:后为在终端输入的命令) 打开终端 查看自己电脑的Ruby环境:gem sources -l 如果环境已经是淘宝镜像了,此时不需要再进行环境的修改. 如果不是,发送gem sources —remove https://rubygems.org/移除当前镜像,然后gem sources -a https://ruby.taobao.org/来添加淘宝镜像. 二.安装Cocoapods 1.下载:sudo gem install Cocoa pods. 2.设置copos:pod s

ios客户端发现_动画屋后期页面重构与悬浮评论分享模块开发项目总结

从"看世界杯送流量"项目,遇到响应式布局问题之后,专门钻研了这方面专业的书籍,同时阅读了相关文章.响应式布局简单的说就是使开发的页面在不同设备上都有友好的效果.而最开始"暑期动画屋"的项目,当时并没有采用响应式布局,虽然ipad上可用,其他设备则会有显示问题.这也暴露了,目前所在移动业务事业部前端的问题:    1.考虑到响应式布局在不同设备上,UI设计师只给了一套UI原型图,而在不同设备上的显示只是根据前端工程师的理解或个人偏好来完成布局.从产品经理的角度以及测试

ios客户端发现_动画屋活动获奖展示和获奖模块开发总结

   最近在看<web2.0策略指南>,开篇即对flicker的DVD租赁业务模型进行分析,目前看来这样的商业模型仍然很强大,而自去年纸牌屋后,flicker又引领了一股自有内容的热潮,湖南卫视未来如爸爸去哪儿.快乐大本营等节目.央视世界杯独播.爱奇艺的晓说,刘春加盟后未可知的big thing的节目.热潮后,是人为对影音入口的切割,这个入口渐次增多,对用户和对各方入口都不太算是好事,影音入口又进入了战国时代,不要多久这种模式的风险就会显现,只靠自有内容留住用户还远远不是终点,或许国内的入口可

ios 图片的两种加载方式

控件加载图片,plist,懒加载,序列帧动画,添加动画效果. IOS中有2种加载图片的方式. 方式一:有缓存(图片所占用的内存会一直停留在程序中) [objc] view plaincopy + (UIImage *)imageNamed:(NSString *)name; 注:必须是png文件.需要把图片添加到 images.xcassets中 例如: [objc] view plaincopy @property (weak, nonatomic) IBOutlet UIImageView 

iOS 进阶 第二天(0324)

0324 创建transform transform 是形变属性. 如下图: 如果按照上面的方法来创建的话是这样解释:是相对初始状态来说的,不会在变化后的基础上进行形变.如果要持续变化就要自己去不断改变要变化的tx或者ty的值 如果要在当前的transform上直接进行不断改变就要按照下面的写法,如下图所示: 当然旋转也是一样,如下图: 当然缩放也是一样,如下图: plist 从本地程序包读取文件 懒加载数据 如下图: bundle 如下图: UIImageView的序列帧动画(每隔一段时间换一