让一个视图在随着贝塞尔曲线的变化上动起来

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/yu_4074/article/details/54972136

具体demo@上海-邓泽淼


1、涉及概念
1)UIDynamicItemCollisionBoundsType 碰撞界限的枚举类型(矩形,椭圆,路径)
2)CADisplayLink是一个能让我们以和屏幕刷新率相同的频率将内容画到屏幕上的定时器。我们在应用中创建一个新的 CADisplayLink 对象,把它添加到一个runloop中,并给它提供一个 target 和selector 在屏幕刷新的时候调用。
3)UIDynamicAnimator 可以通过该类添加不同的行为,来实现一些动态效果。
4)UIGravityBehavior 重力行为
5)UICollisionBehavior 碰撞行为
6)UIDynamicItemBehavior UIDynamicItemBehavior-动画效果:增加各种物理特性
7) CAShapeLayer可以用来绘制所有通过CGPath来表示的形
2、实现过程
I、控制器的调用
1)如果tableView 下拉大于0.5则开始准备动画视图,否则移除;scrollView.contentOffset.y 下拉的时候小于0
2)创建动画视图 同时 开始 同频率刷新方法
3)创建动画视图
1\高超出屏幕300的高度,这个高度是小球最终加载时背景高度
2\创建一个形状图层,方便通过CGPath来绘制图形
3\创建动画主角,一个UIImageView的图片(球)
4\创建动画帮助类UIDynamicAnimator animator
5\为 animator 添加 重力、碰撞、物理特性等行为
4)同频率刷新方法
1\如果正在加载,保持加载旋转状态
2\否则根据tableView下拉状态 刷新控制辅助点的位置,以此改变图形变化
3\setNeedsDisplay 重新绘制动画层视图
5)停止下拉时,并且设定最小位置时的操作
1\设置动画层为小球最终加载旋转状态
2\让贝塞尔曲线动画趋于水平
3\延迟2s完成加载完成的回调
4\加载完成时,停止小球的旋转动画
II、动画视图内部
1、绘制的过程
1)如果发现此时是加载旋转状态,给小球一个推力,弹到指定位置,旋转加载
2)否则移除碰撞行为的边界
3)获取当前的贝塞尔曲线,赋值给视图形状图层的path上
4)如果还没有到加载旋转状态,此时如果球不再贝塞尔曲线区域内,要重置下,然后更新碰撞行为的边界
2、小球的弹出
1)判断是否可以弹出
2)设置吸附行为,将球定位在顶部的中心位置
3)开始旋转动画
3、贝塞尔曲线的创建
1)左上角 右上角 右下角 左下角 连线
2)贝塞尔曲线 由 右下角 左下角 以及 控制辅助点 控制
[bezierPath addQuadCurveToPoint:CGPointMake(0, self.selfFrame.size.height) controlPoint:self.controlPoint.center];
3)根据外界tableView下拉状态 刷新控制辅助点的位置,以此改变图形变化
III、具体demo@上海-邓泽淼
利用 贝塞尔曲线,CADisplayLink,UIKit Dynamics 实现Q弹的下拉刷新,有兴趣的可以看看

猜你喜欢

转载自blog.csdn.net/yu_4074/article/details/54972136