示意图：
2.0.gif
demo地址：仿朋友圈下拉刷新动画
动画的起源源于好奇
因为刚开是学动画，恨不得把所有的都实现一遍，试了一下微信朋友圈的下拉刷新动画。
如果ViewController的第一个子视图为UIScrollview的子类，系统会默认有个偏移量 ，如果不想这样可以设置
self.automaticallyAdjustsScrollViewInsets = NO;
下面所有的Navbar 都是默认透明的，设置为不透明就需要处理下。
- 首先我们需要自定义一个headerView，但是不要设置self.layer.masksToBounds = Yes ,这样超出的部分都会被剪掉。
header 的组成部分：
{
UIImageView *_backgroundImageView;
UIImageView *_iconView;
UILabel *_nameLabel;
}
因为要做成微信朋友圈的效果我们需要这样处理
//背景图 y 设置为 负的。
_backgroundImageView.frame = CGRectMake(0, -60, KWidth, CGRectGetHeight(self.frame)+60);
_iconView.frame = CGRectMake(KWidth - 70 -15, CGRectGetHeight(self.frame)-40, 70, 70);
_nameLabel.frame = CGRectMake(KWidth - 70 -15 -20-200, CGRectGetHeight(self.frame)-20-10, 200, 20);
- 接下来处理下拉刷新的部分
tableview是Viewcontroller的第一个子视图，所以默认的Contentoffset.y为-64，我们需要的就是在下拉刷新的时候给headerview添加动画。
可以将监听contentoffset抽取出来，减少Viewcontroller的冗杂。
- 自定义一个view，给其一些属性：
#import <UIKit/UIKit.h>
typedef enum {
LXWXRefreshViewStateNormal,
LXWXRefreshViewStateWillRefresh,
LXWXRefreshViewStateRefreshing,
} LXWXRefreshViewState;
@interface LX_RefreshView : UIView <CAAnimationDelegate>
+ (instancetype)refreshHeaderWithCenter:(CGPoint)center;
//传入我们需要的处理下拉刷新的UIscrollview的子类
@property(nonatomic,strong)UIScrollView *scrollView;
//刷新ing的回调，用来处理数据
@property (nonatomic, copy) void(^refreshingBlock)();
@property (nonatomic, assign) LXWXRefreshViewState refreshState;
//结束刷新，回到主线程刷新tableview
- (void)endRefreshing;
2 .m文件中的处理
- (void)setupView
{
self.backgroundColor = [UIColor clearColor];
//动态添加到 headerview上，做动画处理
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"AlbumReflashIcon"]];
self.bounds = imageView.bounds;
[self addSubview:imageView];
//刷新时请求数据等待动画
_rotateAnimation = [[CABasicAnimation alloc] init];
_rotateAnimation.keyPath = @"transform.rotation.z";
_rotateAnimation.fromValue = @0;
_rotateAnimation.toValue = @(M_PI * 2);
_rotateAnimation.duration = 1.0;
_rotateAnimation.repeatCount = MAXFLOAT;
}
将viewcontroller中监听contentoffset属性迁移到这里，在设置属性的时候开始监听
- (void)setScrollView:(UIScrollView *)scrollView
{
_scrollView = scrollView;
[scrollView addObserver:self forKeyPath:ObserveKeyPath options:NSKeyValueObservingOptionNew context:nil];
}
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSString *,id> *)change context:(void *)context
{
if (keyPath != ObserveKeyPath) return;
[self updateRefreshHeaderWithOffsetY:self.scrollView.contentOffset.y];
}
在更新contentoffset.y 的时候做一些判断，处理旋转角度，可以自己调整。在拖拽以及停止拖拽的时候判断刷新状态，进而进行不同的动画处理。
- (void)updateRefreshHeaderWithOffsetY:(CGFloat)y
{
CGFloat rotateValue = y / 47.0 * M_PI;
if (y < contentOffetY) {
y = contentOffetY;
if (self.scrollView.isDragging && self.refreshState != LXWXRefreshViewStateWillRefresh) {
self.refreshState = LXWXRefreshViewStateWillRefresh;
} else if (!self.scrollView.isDragging && self.refreshState == LXWXRefreshViewStateWillRefresh) {
self.refreshState = LXWXRefreshViewStateRefreshing;
} }
if (self.refreshState == LXWXRefreshViewStateRefreshing) return;
CGAffineTransform transform = CGAffineTransformIdentity;
//这里处理纵向偏移是因为 tableview为第一个子视图，我们需要设向下偏移，所以取负值。否则是看不到这个视图的。
transform = CGAffineTransformTranslate(transform, 0, -y);
transform = CGAffineTransformRotate(transform, rotateValue);
self.transform = transform;
}
对不同刷新状态的处理 在刷新完成时我们需要再做一个动画，使其纵向消失，然后在动画完成后移除。
- (void)setRefreshState:(LXWXRefreshViewState)refreshState
{
_refreshState = refreshState;
if (refreshState == LXWXRefreshViewStateWillRefresh) {
self.hidden = NO;
}
if (refreshState == LXWXRefreshViewStateRefreshing) {
if (self.refreshingBlock) {
self.refreshingBlock();
}
[self.layer addAnimation:_rotateAnimation forKey:AnimationKey];
} else if (refreshState == LXWXRefreshViewStateNormal) {
[self.layer removeAnimationForKey:AnimationKey];
self.transform = CGAffineTransformIdentity;
CABasicAnimation *basic =[CABasicAnimation animation];
basic.keyPath = @"position";
basic.fromValue =[NSValue valueWithCGPoint:self.center];
basic.toValue = [NSValue valueWithCGPoint:CGPointMake(self.center.x, -self.center.y)];
basic.duration = 0.5;
basic.delegate = self;
[self.layer addAnimation:basic forKey:PositionKey];
}
}
-(void)animationDidStop:(CABasicAnimation *)anim finished:(BOOL)flag
{
if ([anim.keyPath isEqualToString:PositionKey]) {
[self.layer removeAnimationForKey:PositionKey];
self.hidden = YES;
}
}
刷新view 封装完成，接下来 我们在Viewcontroller中引用下即可
