facebook pop 学习笔记

本文主要参考:https://github.com/maxmyers/FacebookPop,如E文好的同窗可直接移步到此。git

简单介绍下pop,Facebook 2月发布的新闻类应用Paper,由于其灵动的用户界面和交互,成为近来最使人眼前一亮的移动产品之一。github

而其支撑其的动画引擎正是pop,13年4月Facebook将Pop开源了:https://github.com/facebook/pop动画

感谢facebook,感谢开源!spa

POP共有4种动画类型,3d

一、POPBasicAnimation   基本动画类blog

二、POPSpringAnimation   带有弹簧效果的动画类ci

三、POPDecayAnimation  衰减动画类get

四、POPCustomAnimation  可自定义动画类产品

STEP2:选择是对view property(视图属性)或是对layer property(层属性)作动画it

View Properties

Alpha - kPOPViewAlpha
Color - kPOPViewBackgroundColor
Size - kPOPViewBounds
Center - kPOPViewCenter
Location & Size - kPOPViewFrame
Size - kPOPViewScaleXY
Size(Scale) - kPOPViewSize

Layer Properties

Color - kPOPLayerBackgroundColor
Size - kPOPLayerBounds
Size - kPOPLayerScaleXY
Size - kPOPLayerSize
Opacity - kPOPLayerOpacity
Position - kPOPLayerPosition
X Position - kPOPLayerPositionX
Y Position - kPOPLayerPositionY
Rotation - kPOPLayerRotation
Color - kPOPLayerBackgroundColor

STEP3:选择你须要的属性,而后设置.toValuew值

View Properties

Alpha - kPOPViewAlpha

与之直接将view的透明度设为0相比,pop更有种动态感受,视觉效果更好。

Size - kPOPViewBounds

Size(Scale) - kPOPViewSize

Center - kPOPViewCenter

Location & Size - kPOPViewFrame

Size - kPOPViewScaleXY

 

文件下载:下载地址

相关文章
相关标签/搜索