iOS 手机淘宝加入购物车动画分析
1、最终效果
仿淘宝动画
2、核心代码
_cartAnimView=[[UIImageView alloc] initWithFrame:CGRectMake(_propView.frame.size.height*0.025,_propView.frame.size.height* -0.025 , _propView.frame.size.height*0.2, _propView.frame.size.height*0.2)];
[self.view addSubview:_cartAnimView];
CABasicAnimation* rotationAnimation;
rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI * 11.0 ];
rotationAnimation.duration = 1.0;
rotationAnimation.cumulative = YES;
rotationAnimation.repeatCount = 0;
//这个是让旋转动画慢于缩放动画执行
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
[_cartAnimView.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];
});
[UIView animateWithDuration:1.0 animations:^{
_cartAnimView.frame=CGRectMake(self.screenWidth-55, -(self.screenHeight - CGRectGetHeight(self.view.frame) - 40), 0, 0);
} completion:^(BOOL finished) {
//动画完成后做的事
}];
3、动画分析
这个动画有两个动作,一个是旋转,一个是缩小。(更好的动画是增加一个:抛物线轨道)
基于分析,所以用核心动画组应该更好,以后有时间在做,或者有高手可以分享一下,谢谢!
这个实现的代码一定不是最好的,请大家多多指教,一起进步,我也在深入学习中,学好一点会再更新本文。
ps:淘宝的加入购物车动画相对我自己实现的更畅,分析发现,淘宝在点击加入购物车动作后,并没有先跟服务器请求加入购物车,而是动画后,返回到商品详情dmd消失后,后台才请求吧。这样动画就不用等待了。但这样的逻辑合理吗?我不清楚为什么这样做,有懂的请多指教!
4、其它动画
动画(1)
#### 核心代码
#pragma mark - 加入购物车动画
-(void)addAnimations
{
_cartAnimView=[[UIImageView alloc] initWithFrame:CGRectMake(_propView.frame.size.height*0.025,_propView.frame.size.height* -0.025 , _propView.frame.size.height*0.2, _propView.frame.size.height*0.2)];
[self.view addSubview:_cartAnimView];
[UIView animateWithDuration:1.0 animations:^{
_cartAnimView.frame=CGRectMake(self.screenWidth-55, -(self.screenHeight - CGRectGetHeight(self.view.frame) - 40), 0, 0);
_cartAnimView.transform = CGAffineTransformRotate(_cartAnimView.transform, M_PI_2);
} completion:^(BOOL finished) {
//动画完成后做的事
}];
}
iOS 手机淘宝加入购物车动画分析的更多相关文章
- iOS手机淘宝加入购物车动画分析
本文转载至 http://www.jianshu.com/p/e77e3ce8ee24 1.最终效果 仿淘宝动画 2.核心代码 _cartAnimView=[[UIImageView alloc] i ...
- iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)
这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...
- 手机淘宝中的那些Web技术-使用了类似PhoneGap的实现
Native APP与Web APP的技术融合已经逐渐成为一种趋势,使用标准的Web技术来开发应用中的某些功能,不仅可以降低开发成本,同时还可以方便的进行功能迭代更新.但是如何保证Web APP的流畅 ...
- 《转》冯森林:手机淘宝中的那些Web技术(2014年)
Native APP与Web APP的技术融合已经逐渐成为一种趋势,使用标准的Web技术来开发应用中的某些功能,不仅可以降低开发成本,同时还可以方便的进行功能迭代更新.但是如何保证Web APP的流畅 ...
- Android热补丁技术—dexposed原理简析(手机淘宝采用方案)
上篇文章<Android无线开发的几种常用技术>我们介绍了几种android移动应用开发中的常用技术,其中的热补丁正在被越来越多的开发团队所使用,它涉及到dalvik虚拟机和android ...
- 关于手机淘宝3.25bug我的一些思考与建议
这两天被手淘ios版3.25bug刷屏了,影响还是挺大的,仅3.25日当天截止到下午5点在微博上的话题阅读量,已经突破8000万.给广大网友带来一次吃瓜盛宴.我们先简单回顾下这个bug的故事线: 我查 ...
- 手机淘宝UWP
各位园主好! bug 走势: 哪天bug 足够少,哪天就可以发布了 :) 2015/10/23: 49 2015/10/26: 40 2015/10/27: 36 2015/10/28: 30 20 ...
- Appium(Python)驱动手机淘宝App
请注意操作步骤: 1. 用数据线连接手机, 打开开发者模式, 并赋予相关权限, 并保持不锁屏状态: 2. 启动Appium桌面服务端: 3. 运行程序: 首次运行, Appium会在手机上安装3个Ap ...
- 淘宝网购物车jquery源码和网易新用户注册页面表单验证的练习
淘宝网购物车源码: <html lang="en"> <head> <meta charset="UTF-8"> <t ...
随机推荐
- keil对51单片机变量和函数的编译处理
(1)初始值不是0的全局变量 在程序调到main()函数执行前,除了要进行内存清零.初始化堆栈外,还需要将全局变量的初始值加载到RAM的指定区域(编译过程中为全局变量分配的空间). (2)未初始化的局 ...
- [译]36 Days of Web Testing(六)
Day 30 Test in situ 真实场景下的测试 为什么? 我十分推崇现场测试,简单讲就是要在你的站点或应用真实使用的场景下进行测试.但随着人口增长,对于"真实场景"的定 ...
- 从零开始学习MySQL1---MySQL基础
数据库基础 数据库是一个长期存储在计算机内的.有组织的.有共享的.统一管理的.数据集合.它是一个按数据结构来存储和管理数据的计算机软件系统.数据库包含两层含义:保管数据的仓库,以及数据管理的方法和技术 ...
- 使用Unity游戏引擎在IOS模拟器中运行的方法
在Unity编译IOS程序时,在Unity导航栏菜单中选择Edit->ProjectSettings ->Player(菜单项)选择IOS平台在下方SDK Version处选择运行设备为I ...
- HTML和CSS特殊属性
禁止用户选中html元素: <body onselectstart="return false"> 禁止事件传递: favorite.find("span&q ...
- 如何使用 Laravel Facades ?
Facade 布局是在面向对象编程中经常使用的一种软件设计布局方式.Facade 实际上是一种包括复杂函数库的类,提供了更加简洁易读的接口.Facade 布局还能为一组结构复杂.设计简陋的 API 提 ...
- Struts2 全局拦截器、result 的实现
定义一个可以继承的包,在这个包里面写入自己常用的拦截器,于是就实现了全局拦截器的实现. 现在,我们定义一个专门用来继承的包: <!--专门提供前台继承的包--> <package n ...
- jsp分页技术
1.以下为分页类: import java.io.Serializable; import java.util.List; import org.apache.commons.lang.bui ...
- heap表按字符串和数值型排序规则
SQL> create user scan identified by scan default tablespace users; User created. SQL> grant db ...
- ubuntu 增加新硬盘
在校内建了一个ftp,本来是想放一点东西的,没想到越放越多,然后硬盘就不够了. 服务器是虚拟出来的ubuntu-server 12.04.想要将新硬盘挂载到/home/ftp目录. 操作步骤: 1.可 ...