走进 Facebook POP 的世界
POP: 一个流行的可扩展的动画引擎iOS,它支持spring和衰变动态动画,使其可用于构建现实,基于物理交互。Objective - C API允许快速集成, 对于所有的动画和过渡他是成熟的.
解释:
1.1 POP 使用 Objective-C++ 编写,Objective-C++ 是对 C++ 的扩展,就像 Objective-C 是 C 的扩展。而至于为什么他们用 Objective-C++ 而不是纯粹的 Objective-C. 可能是偏爱。-.O
1.2 POP 目前由四部分组成:1. Animations;2. Engine;3. Utility;4. WebCore。下图有助于你更好的理解它的架构
1.它支持CocoaPods 你可以这样
pod 'pop', '~> 1.0.8'
2.或者这样点击下载拉入工程 https://github.com/facebook/pop
3.我使用的Cocoapods 所以使用之前你需要这样
#import <POP.h>
动图
E1:
- (void)clickPopAction
{
// kPOPLayerPositionY 向下
// kPOPLayerPositionX 向右
POPSpringAnimation *anim = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerPositionY];
// 移动距离
anim.toValue = [[NSNumber alloc] initWithFloat:_btnPop.center.y + 200];
// 从当前 + 1s后开始
anim.beginTime = CACurrentMediaTime() + 1.0f;
// 弹力--晃动的幅度 (springSpeed速度)
anim.springBounciness = 15.0f;
[_btnPop pop_addAnimation:anim forKey:@"position"];
POPSpringAnimation *anim1 = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerBounds];
anim1.toValue = [NSValue valueWithCGRect:CGRectMake(100, 100, 99, 99)];
[_btnPop pop_addAnimation:anim1 forKey:@"size"];
}
动图
E2:在很多金融类app中比较常见、支付宝中的余额包、京东金融余额、就类似这样
// 初始化
POPBasicAnimation *anim = [POPBasicAnimation animation];
// 限时 1s
anim.duration = 3.0;
POPAnimatableProperty * prop = [POPAnimatableProperty propertyWithName:@"count++" initializer:^(POPMutableAnimatableProperty *prop) {
prop.readBlock = ^(id obj, CGFloat values[]){ values[0] = [[obj description] floatValue]; };
prop.writeBlock = ^(id obj, const CGFloat values[])
{
[obj setText:[NSString stringWithFormat:@"%.2f",values[0]]];
};
prop.threshold = 0.01;
}];
anim.property = prop;
anim.fromValue = @(0.0);
anim.toValue = @(1314.52);
[self.xt_countLabel pop_addAnimation:anim forKey:@"counting"];
动图
E3
CALayer *layer0 = [CALayer layer];
layer0.opacity = 1.0;
layer0.transform = CATransform3DIdentity;
[layer0 setMasksToBounds:YES];
[layer0 setBackgroundColor:[UIColor colorWithRed:0.5448 green:0.6836 blue:0.9986 alpha:1.0].CGColor];
[layer0 setCornerRadius:12.5];
[layer0 setBounds:CGRectMake(0, 0, 25, 25)];
[self.view.layer addSublayer:layer0];
layer0.position = CGPointMake(self.view.center.x, 266);
[self performAnimation:layer0];
- (void)performAnimation:(CALayer *)layer
{
[layer pop_removeAllAnimations];
POPBasicAnimation *anim = [POPBasicAnimation animationWithPropertyNamed:kPOPLayerScaleXY];
static BOOL ani = YES;
if (ani) {
anim.toValue = [NSValue valueWithCGPoint:CGPointMake(1.0, 1.0)];
}else{
anim.toValue = [NSValue valueWithCGPoint:CGPointMake(1.5, 1.5)];
}
ani = !ani;
anim.completionBlock = ^(POPAnimation *anim, BOOL finished) {
if (finished) { [self performAnimation:layer]; }
};
[layer pop_addAnimation:anim forKey:@"Animation"];
}
走进 Facebook POP 的世界的更多相关文章
- [C#] 走进异步编程的世界 - 开始接触 async/await
走进异步编程的世界 - 开始接触 async/await 序 这是学习异步编程的入门篇. 涉及 C# 5.0 引入的 async/await,但在控制台输出示例时经常会采用 C# 6.0 的 $&qu ...
- [C#] 走进异步编程的世界 - 剖析异步方法(上)
走进异步编程的世界 - 剖析异步方法(上) 序 这是上篇<走进异步编程的世界 - 开始接触 async/await 异步编程>(入门)的第二章内容,主要是与大家共同深入探讨下异步方法. 本 ...
- [C#] 走进异步编程的世界 - 剖析异步方法(下)
走进异步编程的世界 - 剖析异步方法(下) 序 感谢大家的支持,这是昨天发布<走进异步编程的世界 - 剖析异步方法(上)>的补充篇. 目录 异常处理 在调用方法中同步等待任务 在异步方法中 ...
- [C#] 走进异步编程的世界 - 在 GUI 中执行异步操作
走进异步编程的世界 - 在 GUI 中执行异步操作 [博主]反骨仔 [原文地址]http://www.cnblogs.com/liqingwen/p/5877042.html 序 这是继<开始接 ...
- 走进异步编程的世界 - 开始接触 async/await
[C#] 走进异步编程的世界 - 开始接触 async/await 走进异步编程的世界 - 开始接触 async/await 序 这是学习异步编程的入门篇. 涉及 C# 5.0 引入的 async ...
- iOS开发Facebook POP动效库使用教程
如果说Origami这款动效原型工具是Facebook Paper的幕后功臣,那么POP便是Origami的地基.感谢Facebook开源了POP动效库,让人人都能制作出华丽的动效.我们只需5步,便能 ...
- [C#] 走进异步编程的世界 - 开始接触 async/await(转)
原文链接:http://www.cnblogs.com/liqingwen/p/5831951.html 走进异步编程的世界 - 开始接触 async/await 序 这是学习异步编程的入门篇. 涉及 ...
- Miox带你走进动态路由的世界——51信用卡前端团队
写在前面: 有的时候再做大型项目的时候,确实会被复杂的路由逻辑所烦恼,会经常遇到权限问题,路由跳转回退逻辑问题.这几天在网上看到了51信用卡团队开源了一个Miox,可以有效的解决这些痛点,于是乎我就做 ...
- 走进异步编程的世界 - 开始接触 async/await(转)
序 这是学习异步编程的入门篇. 涉及 C# 5.0 引入的 async/await,但在控制台输出示例时经常会采用 C# 6.0 的 $"" 来拼接字符串,相当于string.Fo ...
随机推荐
- shell编程的一些例子1
1.$0-$9及$# $@的使用 demo_arg 内容 #!/bin/bash echo "程序名:$0" echo "命令传递参数个数:$#" echo & ...
- (转载)Convolutional Neural Networks卷积神经网络
Convolutional Neural Networks卷积神经网络 Contents 一:前导 Back Propagation反向传播算法 网络结构 学习算法 二:Convolutional N ...
- HJA的异或值
HJA的异或值 查看 提交 统计 提问 总时间限制: 20000ms 内存限制: 512000kB 描述 形态形成场(Morphogenetic Field)假说是Rupert Sheldrake ...
- 如何使用 Python 创建一个 NBA 得分图?
本文意在创建一个得分图,该图同时描绘了从场上不同位置投篮得分的百分比和投篮次数,这和 Austin Clemen 个人网站上的帖子 http://www.austinclemens.com/shotc ...
- 两种QMultiMap的遍历方法(最好使用只读遍历器)
留个爪,备查 QMultiMap<QString, QString>& remote_map = my_obj->m_MapVersion; // ccc 这里体现了引用的好 ...
- leetcode面试准备:Decode Ways
1 题目 A message containing letters from A-Z is being encoded to numbers using the following mapping: ...
- OpenStack学习推荐
前言: 学习.了解.安装部署OpenStack也写了好一段时间了,现在觉得也有点必要写点总结.搞IT这一块基本就这样,不管是搞什么领域,一个项目超过两个月没动它,就基本不知道当时是怎么搞的,当时学 ...
- Goole音乐搜索
本博文的主要内容有 .Goole音乐搜索的介绍 1.Goole音乐搜索的介绍 https://zh.wikipedia.org/wiki/%E8%B0%B7%E6%AD%8C%E9%9F%B3% ...
- weekend110(Hadoop)的 第七天笔记
(2015年1月31日) 课程目录 01-storm基本概念 02-storm编程规范及demo编写 03-storm的topology提交执行 04-kafka介绍 05-kafka集群部署及客户端 ...
- 南京Uber优步司机奖励政策(1月18日~1月24日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...