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) {

//动画完成后做的事

}];

}

动画(2)

ps:打算做一个像微信 漂流瓶的效果,有快到慢,淡出等,有时间深入研究在更新。谢谢!

iOS 手机淘宝加入购物车动画分析相关推荐

  1. iOS手机淘宝加入购物车动画分析

    1.最终效果 仿淘宝动画 2.核心代码 _cartAnimView=[[UIImageView alloc] initWithFrame:CGRectMake(_propView.frame.size ...

  2. 【Android 动画】仿淘宝加入购物车动画实现(附件demo)

    在开发详情页时,我们需要实现这样一个下面这样的动画. 在看到这个动画设计的时候,我就想到"京东"和"淘宝"的加入购物车的动画. 话不多说,讲一下这个动画的实现原 ...

  3. 仿淘宝加入购物车动画

    #pragma mark - 动画(加入购物车) - (void)shopBagAni {CGRect startRect;CGRect endRect;CGPoint imgPoint;//最右上角 ...

  4. iOS 手机淘宝 自动创建一个人的群聊 实现源码 hook 代码源码

    目录 实现步骤 获取UID 创建群Call 实现步骤 1.获取自己的UID 2.根据自己UID创建群聊 获取UID //获取自己的UID %hook TBSDKConnection- (void)ad ...

  5. 电商客户端竞品分析-手机淘宝、京东、唯品会、聚美优品

    市场状况 艾瑞最新统计数据显示,2013年移动网购整体交易规模1676.4亿元,同比增幅高达165.4%,而同期PC端网购规模将近16000多亿元,同比增速35.7%.预计2017年市场规模将近万亿, ...

  6. 求助:Appium 如何实现登录手机淘宝时拖动苹果到购物车的验证

    有没有哪位大神知道,用appium-python 对夜神模拟器上的手机淘宝登录时,怎么做才能分别识别到苹果和购物车,从而实现自动将苹果拖到购物成的操作啊?

  7. iOS应用内跳转到手机淘宝天猫

    info.plist 中需要添加(实测没填写的话不会去判断是否安装了此APP) 代码如下: 需要跳转的按钮点击事件:func copyStrKey(_ sender: UIButton) {let p ...

  8. 手机淘宝 521 性能优化项目揭秘

    http://www.infoq.com/cn/articles/mobile-taobao-521-performance-optimization-project 又是一年双十一,亿万用户都会在这 ...

  9. 天猫11.11:手机淘宝 521 性能优化项目揭秘

    又是一年双十一,亿万用户都会在这一天打开手机淘宝,高兴地在会场页面不断浏览,面对琳琅满目的商品图片,抢着添加购物车,下单付款.为了让用户 更顺畅更方便地实现这一切,做到"如丝般顺滑" ...

最新文章

  1. 我是如何在webpack中使用postcss-px2rem的
  2. 无法识别的属性 configProtectionProvider的解决方案
  3. 【论文复现与改进】针对弱标注数据多标签矩阵恢复问题,改进后的MCWD算法,让你的弱标注多标签数据赢在起跑线上
  4. weblogic0638_Java安全之Weblogic 2016-0638分析
  5. Hadoop之NameNode和SecondaryNameNode工作机制详解
  6. SAP concur image download on request
  7. js数组的拷贝赋值复制二三事总结
  8. LeetCode 35. Search Insert Position
  9. UVA - 10474
  10. 数据结构上机实践第七周项目1 - 自建算法库——顺序环形队列
  11. mysql too many connection解决方法
  12. python isodd()判断奇偶_EXCEL VBA:Iseven Isodd 判断奇偶
  13. Kotlin中定义编译时常量
  14. CC2530休眠-PM2-PM3
  15. 电脑系统相关问题收录(windows10)
  16. Flutter 接入iOS苹果内购支付踩坑过程
  17. TLC5615 10位DA模块数模转换芯片驱动
  18. 零基础入门,资深吃货带你搞懂大数据
  19. [学习][数据结构]二叉搜索树
  20. 蚂蚁集团两地上市暂缓,阿里巴巴股价大跌,员工快到手的大 House 飞了!

热门文章

  1. SolidWorks打开stp文件后零件的图标上有一个箭头且打不开这个零件
  2. 科大讯飞—python实习生/JAVA实习生(内推)—电话面试
  3. 干货集锦 | Github上的AR、VR开发资源库
  4. Python运行时打印汉语拼音表
  5. QQ群文件无法显示,空白,加载不出来
  6. 项目管理中各种英文简称
  7. 复试被刷的学长学姐都是因为这些原因
  8. 威联通NAS(QNAP)采用HybridMount挂载百度云网盘
  9. android获取短信验证码自动填入
  10. 图片批量重命名/更改图片格式