- 浏览: 2144270 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (1240)
- mac/IOS (287)
- flutter (1)
- J2EE (115)
- android基础知识 (582)
- android中级知识 (55)
- android组件(Widget)开发 (18)
- android 错误 (21)
- javascript (18)
- linux (70)
- 树莓派 (18)
- gwt/gxt (1)
- 工具(IDE)/包(jar) (18)
- web前端 (17)
- java 算法 (8)
- 其它 (5)
- chrome (7)
- 数据库 (8)
- 经济/金融 (0)
- english (2)
- HTML5 (7)
- 网络安全 (14)
- 设计欣赏/设计窗 (8)
- 汇编/C (8)
- 工具类 (4)
- 游戏 (5)
- 开发频道 (5)
- Android OpenGL (1)
- 科学 (4)
- 运维 (0)
- 好东西 (6)
- 美食 (1)
最新评论
-
liangzai_cool:
请教一下,文中,shell、C、Python三种方式控制led ...
树莓派 - MAX7219 -
jiazimo:
...
Kafka源码分析-序列5 -Producer -RecordAccumulator队列分析 -
hp321:
Windows该命令是不是需要安装什么软件才可以?我试过不行( ...
ImageIO读jpg的时候出现javax.imageio.IIOException: Unsupported Image Type -
hp321:
Chenzh_758 写道其实直接用一下代码就可以解决了:JP ...
ImageIO读jpg的时候出现javax.imageio.IIOException: Unsupported Image Type -
huanghonhpeng:
大哥你真强什么都会,研究研究。。。。小弟在这里学到了很多知识。 ...
android 浏览器
一、简单介绍
CAPropertyAnimation的子类
属性解析:
随着动画的进行,在长度为duration的持续时间内,keyPath相应属性的值从fromValue渐渐地变为toValue
如果fillMode=kCAFillModeForwards和removedOnComletion=NO,那么在动画执行完毕后,图层会保持显示动画执行后的状态。但在实质上,图层的属性值还是动画执行前的初始值,并没有真正被改变。
比如,CALayer的position初始值为(0,0),CABasicAnimation的fromValue为(10,10),toValue为(100,100),虽然动画执行完毕后图层保持在(100,100)这个位置,实质上图层的position还是为(0,0)
二、平移动画
代码示例:
代码说明:
第42行设置的keyPath是@"position",说明要修改的是CALayer的position属性,也就是会执行平移动画
第44,45行,这里的属性接收的时id类型的参数,因此并不能直接使用CGPoint这种结构体类型,而是要先包装成NSValue对象后再使用。
默认情况下,动画执行完毕后,动画会自动从CALayer上移除,CALayer又会回到原来的状态。为了保持动画执行后的状态,可以加入第48,50行代码
byValue和toValue的区别,前者是在当前的位置上增加多少,后者是到指定的位置。
执行效果:
设置代理:设置动画的代理,可以监听动画的执行过程,这里设置控制器为代理。
代码示例:
打印position的属性值,验证图层的属性值还是动画执行前的初始值{50,50},并没有真正被改变为{200,300}。
三、缩放动画
实现缩放动画的代码示例:
实现效果:
四、旋转动画
代码示例:
实现效果:
提示:如果要让图形以2D的方式旋转,只需要把CATransform3DMakeRotation在z方向上的值改为1即可。
anima.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_2+M_PI_4, 1, 1, 0)];
四、补充
可以通过transform(KVC)的方式来进行设置。
代码示例(平移):
实现效果:
绘制的图形在y的方向上移动100个单位。
CAPropertyAnimation的子类
属性解析:
- fromValue:keyPath相应属性的初始值
- toValue:keyPath相应属性的结束值
随着动画的进行,在长度为duration的持续时间内,keyPath相应属性的值从fromValue渐渐地变为toValue
如果fillMode=kCAFillModeForwards和removedOnComletion=NO,那么在动画执行完毕后,图层会保持显示动画执行后的状态。但在实质上,图层的属性值还是动画执行前的初始值,并没有真正被改变。
比如,CALayer的position初始值为(0,0),CABasicAnimation的fromValue为(10,10),toValue为(100,100),虽然动画执行完毕后图层保持在(100,100)这个位置,实质上图层的position还是为(0,0)
二、平移动画
代码示例:
// // YYViewController.m // 07-核心动画(基础动画) // // Created by apple on 14-6-21. // Copyright (c) 2014年 itcase. All rights reserved. // #import "YYViewController.h" @interface YYViewController () @property(nonatomic,strong)CALayer *myLayer; @end @implementation YYViewController - (void)viewDidLoad { [super viewDidLoad]; //创建layer CALayer *myLayer=[CALayer layer]; //设置layer的属性 myLayer.bounds=CGRectMake(0, 0, 50, 80); myLayer.backgroundColor=[UIColor yellowColor].CGColor; myLayer.position=CGPointMake(50, 50); myLayer.anchorPoint=CGPointMake(0, 0); myLayer.cornerRadius=20; //添加layer [self.view.layer addSublayer:myLayer]; self.myLayer=myLayer; } //设置动画(基础动画) -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { //1.创建核心动画 // CABasicAnimation *anima=[CABasicAnimation animationWithKeyPath:<#(NSString *)#>] CABasicAnimation *anima=[CABasicAnimation animation]; //1.1告诉系统要执行什么样的动画 anima.keyPath=@"position"; //设置通过动画,将layer从哪儿移动到哪儿 anima.fromValue=[NSValue valueWithCGPoint:CGPointMake(0, 0)]; anima.toValue=[NSValue valueWithCGPoint:CGPointMake(200, 300)]; //1.2设置动画执行完毕之后不删除动画 anima.removedOnCompletion=NO; //1.3设置保存动画的最新状态 anima.fillMode=kCAFillModeForwards; //2.添加核心动画到layer [self.myLayer addAnimation:anima forKey:nil]; } @end
代码说明:
第42行设置的keyPath是@"position",说明要修改的是CALayer的position属性,也就是会执行平移动画
第44,45行,这里的属性接收的时id类型的参数,因此并不能直接使用CGPoint这种结构体类型,而是要先包装成NSValue对象后再使用。
默认情况下,动画执行完毕后,动画会自动从CALayer上移除,CALayer又会回到原来的状态。为了保持动画执行后的状态,可以加入第48,50行代码
byValue和toValue的区别,前者是在当前的位置上增加多少,后者是到指定的位置。
执行效果:
设置代理:设置动画的代理,可以监听动画的执行过程,这里设置控制器为代理。
代码示例:
#import "YYViewController.h" @interface YYViewController () @property(nonatomic,strong)CALayer *myLayer; @end @implementation YYViewController - (void)viewDidLoad { [super viewDidLoad]; //创建layer CALayer *myLayer=[CALayer layer]; //设置layer的属性 myLayer.bounds=CGRectMake(0, 0, 50, 80); myLayer.backgroundColor=[UIColor yellowColor].CGColor; myLayer.position=CGPointMake(50, 50); myLayer.anchorPoint=CGPointMake(0, 0); myLayer.cornerRadius=20; //添加layer [self.view.layer addSublayer:myLayer]; self.myLayer=myLayer; } //设置动画(基础动画) -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { //1.创建核心动画 // CABasicAnimation *anima=[CABasicAnimation animationWithKeyPath:<#(NSString *)#>] CABasicAnimation *anima=[CABasicAnimation animation]; //1.1告诉系统要执行什么样的动画 anima.keyPath=@"position"; //设置通过动画,将layer从哪儿移动到哪儿 anima.fromValue=[NSValue valueWithCGPoint:CGPointMake(0, 0)]; anima.toValue=[NSValue valueWithCGPoint:CGPointMake(200, 300)]; //1.2设置动画执行完毕之后不删除动画 anima.removedOnCompletion=NO; //1.3设置保存动画的最新状态 anima.fillMode=kCAFillModeForwards; anima.delegate=self; //打印 NSString *str=NSStringFromCGPoint(self.myLayer.position); NSLog(@"执行前:%@",str); //2.添加核心动画到layer [self.myLayer addAnimation:anima forKey:nil]; } -(void)animationDidStart:(CAAnimation *)anim { NSLog(@"开始执行动画"); } -(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag { //动画执行完毕,打印执行完毕后的position值 NSString *str=NSStringFromCGPoint(self.myLayer.position); NSLog(@"执行后:%@",str); } @end
打印position的属性值,验证图层的属性值还是动画执行前的初始值{50,50},并没有真正被改变为{200,300}。
三、缩放动画
实现缩放动画的代码示例:
// // YYViewController.m // 08-核心动画平移 // // Created by apple on 14-6-21. // Copyright (c) 2014年 itcase. All rights reserved. // #import "YYViewController.h" @interface YYViewController () @property(nonatomic,strong)CALayer *myLayer; @end @implementation YYViewController - (void)viewDidLoad { [super viewDidLoad]; //创建layer CALayer *myLayer=[CALayer layer]; //设置layer的属性 myLayer.bounds=CGRectMake(0, 0, 150, 60); myLayer.backgroundColor=[UIColor yellowColor].CGColor; myLayer.position=CGPointMake(50, 50); myLayer.anchorPoint=CGPointMake(0, 0); myLayer.cornerRadius=40; //添加layer [self.view.layer addSublayer:myLayer]; self.myLayer=myLayer; } -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { //1.创建动画 CABasicAnimation *anima=[CABasicAnimation animationWithKeyPath:@"bounds"]; //1.1设置动画执行时间 anima.duration=2.0; //1.2设置动画执行完毕后不删除动画 anima.removedOnCompletion=NO; //1.3设置保存动画的最新状态 anima.fillMode=kCAFillModeForwards; //1.4修改属性,执行动画 anima.toValue=[NSValue valueWithCGRect:CGRectMake(0, 0, 200, 200)]; //2.添加动画到layer [self.myLayer addAnimation:anima forKey:nil]; } @end
实现效果:
四、旋转动画
代码示例:
// // YYViewController.m // 09-核心动画旋转 // // Created by apple on 14-6-21. // Copyright (c) 2014年 itcase. All rights reserved. // #import "YYViewController.h" @interface YYViewController () @property(nonatomic,strong)CALayer *myLayer; @end @implementation YYViewController - (void)viewDidLoad { [super viewDidLoad]; //创建layer CALayer *myLayer=[CALayer layer]; //设置layer的属性 myLayer.bounds=CGRectMake(0, 0, 150, 60); myLayer.backgroundColor=[UIColor yellowColor].CGColor; myLayer.position=CGPointMake(50, 50); myLayer.anchorPoint=CGPointMake(0, 0); myLayer.cornerRadius=40; //添加layer [self.view.layer addSublayer:myLayer]; self.myLayer=myLayer; } -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { //1.创建动画 CABasicAnimation *anima=[CABasicAnimation animationWithKeyPath:@"transform"]; //1.1设置动画执行时间 anima.duration=2.0; //1.2修改属性,执行动画 anima.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_2+M_PI_4, 1, 1, 0)]; //1.3设置动画执行完毕后不删除动画 anima.removedOnCompletion=NO; //1.4设置保存动画的最新状态 anima.fillMode=kCAFillModeForwards; //2.添加动画到layer [self.myLayer addAnimation:anima forKey:nil]; } @end
实现效果:
提示:如果要让图形以2D的方式旋转,只需要把CATransform3DMakeRotation在z方向上的值改为1即可。
anima.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_2+M_PI_4, 1, 1, 0)];
四、补充
可以通过transform(KVC)的方式来进行设置。
代码示例(平移):
#import "YYViewController.h" @interface YYViewController () @property(nonatomic,strong)CALayer *myLayer; @end @implementation YYViewController - (void)viewDidLoad { [super viewDidLoad]; //创建layer CALayer *myLayer=[CALayer layer]; //设置layer的属性 myLayer.bounds=CGRectMake(0, 0, 150, 60); myLayer.backgroundColor=[UIColor yellowColor].CGColor; myLayer.position=CGPointMake(50, 50); myLayer.anchorPoint=CGPointMake(0, 0); myLayer.cornerRadius=40; //添加layer [self.view.layer addSublayer:myLayer]; self.myLayer=myLayer; } -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { //1.创建动画 CABasicAnimation *anima=[CABasicAnimation animation]; anima.keyPath=@"transform"; //1.1设置动画执行时间 anima.duration=2.0; //1.2修改属性,执行动画 anima.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeTranslation(0, 100, 1)]; //1.3设置动画执行完毕后不删除动画 anima.removedOnCompletion=NO; //1.4设置保存动画的最新状态 anima.fillMode=kCAFillModeForwards; //2.添加动画到layer [self.myLayer addAnimation:anima forKey:nil]; }
实现效果:
绘制的图形在y的方向上移动100个单位。
发表评论
-
带你深入理解 FLUTTER 中的字体“冷”知识
2020-08-10 23:40 565本篇将带你深入理解 Flutter 开发过程中关于字体和文 ... -
Flutter -自定义日历组件
2020-03-01 17:56 1021颜色文件和屏幕适配的文件 可以自己给定 import ... -
Dart高级(一)——泛型与Json To Bean
2020-02-23 19:13 923从 Flutter 发布到现在, 越来越多人开始尝试使用 Da ... -
flutter loading、Progress进度条
2020-02-21 17:03 1029Flutter Progress 1 条形无固定值进度条 ... -
Flutter使用Https加载图片
2020-02-21 01:39 898Flutter使用Https加载图片 使用http加载图片出 ... -
flutter shared_preferences 异步变同步
2020-02-21 00:55 762前言 引用 在开发原生iOS或Native应用时,一般有判断上 ... -
Flutter TextField边框颜色
2020-02-19 21:31 849监听要销毁 myController.dispose(); T ... -
flutter Future的正确用法
2020-02-18 21:55 725在flutter中经常会用到异步任务,dart中异步任务异步处 ... -
记一次Flutter简单粗暴处理HTTPS证书检验方法
2020-02-18 14:13 821最近在做Flutter项目到了遇到一个无解的事情,当使用Ima ... -
flutter 获取屏幕宽度高度 通知栏高度等屏幕信息
2019-07-27 08:39 1221##MediaQuery MediaQuery.of(con ... -
Mac上制作Centos7系统U盘安装盘
2019-07-23 11:25 586Centos7 下载地址: https://www.cento ... -
关于flutter RefreshIndicator扩展listview下拉刷新的问题
2019-07-10 19:40 994当条目过少时listview某些嵌套情况下可能不会滚动(条目 ... -
flutter listview 改变状态的时候一直无限添加
2019-07-10 16:01 671setstate的时候会一直无限的调用listview.bui ... -
Flutter Android端启动白屏问题的解决
2019-07-09 00:51 1399问题描述 Flutter 应用在 Android 端上启动时 ... -
Flutter中SnackBar使用
2019-07-08 23:43 676底部弹出,然后在指定时间后消失。 注意: build(Bui ... -
Flutter 之点击空白区域收起键盘
2019-07-08 18:43 1656点击空白处取消TextField焦点这个需求是非常简单的,在学 ... -
Flutter 弹窗 Dialog ,AlertDialog,IOS风格
2019-07-08 18:04 1287import 'package:flutter/mate ... -
flutter ---TextField 之 输入类型、长度限制
2019-07-08 14:30 2196TextField想要实现输入类型、长度限制需要先引入impo ... -
【flutter 溢出BUG】键盘上显示bottom overflowed by 104 PIXELS
2019-07-08 11:13 1442一开始直接使用Scaffold布局,body:new Colu ... -
解决Flutter项目卡在Initializing gradle...界面的问题
2019-07-07 12:53 787Flutter最近很火,我抽出了一点时间对Flutter进行了 ...
相关推荐
IOS之UI风格片头动画PPT模板.pptx
模仿IOS的UI动画,有4个效果,弹窗,对话框等等,有兴趣的可以下载看看
iOS开发 汤姆猫 UI基础
关于一个时钟和幸运转盘 的两个小程序,对应博客地址:http://blog.csdn.net/nsryan
ios系统风格动态片头动画,顺滑UI风格,系统动画效果展示ppt模板。
ios开发 简单demo(包含动画、时钟、计算器和常用UI界面) 供初学者一起学习
iOS开发 - 第02篇 - UI进阶 - 14 - 彩票(第一天)源代码,对应博客地址:http://blog.csdn.net/nsryan
这是一套IOS之UI风格片头PPT动画,第一PPT模板网提供幻灯片动画免费下载; PPT动画采用了流行的IOS半透明设计UI风格,紫黑色的PPT背景图片非常模糊,PPT动画首页有人物头像和PPT文本框简介;PPT动画内容页面有简洁...
如果fillMode=kCAFillModeForwards和removedOnComletion=NO,那么在动画执行完毕后,图层会保持显示动画执行后的状态。但在实质上,图层的属性值还是动画执行前的初始值,并没有真正被改变。 比如,CALayer的...
与大家分享一些iOS开发的学习... 精通ios开发介绍了iOS中UI设计模式,iOS中详细ui控件介绍,并通过小案例进行分析讲解,并深入介绍iOS应用开发中的数据存储,服务器客户端开发知识,动画,多媒体,map,触摸事件等。
本书共分三篇,*篇为基础篇,主要介绍了iOS开发基础知识,包括iOS系统的历史、Swift 3.0语言、UI界面构建技术、视图控制器、常用的控件、表和集合视图、视图和层、声音、视频、动画等。第二篇为进阶篇,主要介绍了...
ios 视频 高级UI 视频,有需要的可以拿去。讲解的非常详细。。
IOS按钮长按效果,类似微信录音按钮,还做了iphone和ipad的适配,很适合初学者
包含collectionView,UIBezierPath,ActionSheet,DatePicker,pickerView,SearchBar,UIActivityIndicatorView,UIAlertView,UIButton,...UISwitch,UITabarController,UItableView,UItextView,UIWebView,动画的基础应用
美国Matt Drance、Paul Warren编著的《iOS应用开发攻略》收录了最新的iOS软件开发的最佳做法,涵盖了应用开发及构建优雅解决方案的必备知识,包括:编写通用的启动画面和嵌入式Web浏览器;构建复杂表视图;使app或...
类似于屏保的动画效果,可以自己设置动画颜色的丰富度和动画的快慢。
iOS_多媒体_转场动画_TableVew缩略图的转场动画_16Hero3-swiftui
AnimatedTabBar是一个Swift UI模块库,用于向iOS tabBar项目和图标添加动画。.zip
用于iOS,通过使用UITableView结合Pop动画的方式,创建带有数字(金额)滚动效果的UI控件