iOS--不同效果思路分析

• 本节主要讲解关于iOS中Swift下拉刷新的思路。

  1. 创建一个scrollView的category：

     • 为scrollView添加headerView与footerView，表示上下拉的窗口。

     • 为scrollView提供两个属性:header与footer，表示是进行上拉或者下拉刷新。

  2. 创建视图RefreshView:

     • 为其添加一个枚举，表示下拉的状态（正在加载，正常状态，下拉状态，松手后刷新视图）
     • 为刷新视图(例如headerView)添加动画，在正在加载的时候开始刷新视图的动画，结束刷新的时候停止视图动画。
  • 为其添加监听observer，监听用户下拉的距离，并且根据此距离来决定下拉刷新的状态。
  3. 自定义视图，添加到RefreshView上面，此视图可以根据自己的要求来自定义。用于与用户交互。

• 本节主要讲解UIBezierPath + CADisplayLink来实现上升水满效果。

  • 创建自定义的View:GoupView：

//用于屏幕刷新的计时器
@property (nonatomic, strong) CADisplayLink *display;
//视图起始的状态
@property (nonatomic, assign) CGFloat start;
//视图末位的状态
@property (nonatomic, assign) CGFloat end;

    -(void)animation;

   -(void)completeAnimation;

• 利用UIView动画机制，先让一个基础视图实现上升的效果

[UIView animateWithDuration:2.0 delay:0 usingSpringWithDamping:1 initialSpringVelocity:0.8 options:UIViewAnimationOptionCurveLinear animations:^{
     goupview.center = CGPointMake(375/2, to);
 } completion:^(BOOL finished) {
     [goupview completeAnimation];
 }];

 ```
+ 在GoupView中实现drawRect

//记载一个视图图层变化（当前正在变化的图层）
CALayer *layer = self.layer.presentationLayer;
//当前变化图层的位置
CGPoint curpoi = layer.position;

// Drawing code
UIBezierPath *path = [UIBezierPath bezierPath];
CGFloat width = rect.size.width;
CGFloat height = rect.size.height;

//比例 根据数学运算出的比例
CGFloat progress =1-(height/2 - (curpoi.y-667)) / (self.from - self.to);
CGFloat delHeight = height/2 * progress;
NSLog(@"%lf",delHeight);
CGPoint startPoint = CGPointMake(0.0, 0.0);
CGPoint endPoint = CGPointMake(width, 0.0);

//接下来是画出图层
[path moveToPoint:startPoint];
[path addQuadCurveToPoint:endPoint controlPoint:CGPointMake(width/2, delHeight)];
[path addLineToPoint:CGPointMake(width, height)];
[path addQuadCurveToPoint:CGPointMake(0, height) controlPoint:CGPointMake(width/2, height)];

[[UIColor magentaColor] setFill];

[path closePath];
[path fill];

+ 本节主要讲述 QQ粘连效果的实现原理。
本节网上已经有很多很好的讲解，可以移步[至此](http://kittenyang.com/drawablebubble/)。
   1.   首先创建自定义QQButton,继承于UIButton。此类包含了两个View，一个代表着本身的layer，另一个则在其之下添加一个小的视图，这个视图是一个小的圆饼。
   2.  并且在QQButton中添加一个CAShapeLayer，此layer用于在其中连接两个圆之间的图层。
   3.  接下来我们添加pan手势，此手势解决button移动小圆随着其与圆心的距离变换半径的方式。
   4.  最后，通过UIBezierPath 曲线来画出计算公式中的图层即可。
注意下面的方式可以让button随着手势的移动而移动，需要用setTranslation设定其参照点:

//  移动
CGPoint transPoint = [pan translationInView:self];
CGPoint center = self.center;

// NSLog(@"%lf",transPoint.x);
center.x += transPoint.x;
center.y += transPoint.y;
self.center = center;
// NSLog(@"%lf",center.x);
[pan setTranslation:CGPointZero inView:self];

另外，记载一个果冻效果的实例，没有使用drawRect(此方法占据很大的内存)，而巧妙的运用一个小的视图的位置来决定视图的变化。移步[至此](http://www.cocoachina.com/ios/20151231/14823.html)。