在写这篇文章之前，我一直很纠结，到底要不要写呢？任何一个写iOS的程序员或者称为编程者，都应该对MJRefresh熟悉的不能再熟悉了。几乎每个人都用过，也知道如何使用，那么我又何必再在这里写下这篇文章呢？回答这个问题之前，我想问几个问题：
1：MJRefresh 与header和Footer相关的类有几个？
2：MJRefresh 中不同的Footer有什么区别？
3：MJRefresh 中不同的Header有什么区别？
4：如何自定义Footer和Header？
如果你都能回答上来，那么这篇文章可以不用往下看了。如果有些许疑问，那么希望这篇浅显的文章可以给您提供些许帮助。
（MJRefresh下载地址：https://github.com/CoderMJLee/MJRefresh.git）
一、MJRefresh目录简介
首先让我们浏览下，MJRefresh都有哪些类文件。
这些文件大致分为四类：
辅助类（扩展类）
资源类（图片等）
自定义类（custom）
基础类 (base)
继续展开看：
Custom文件夹：
这里又包括两个文件夹，Header和Footer，我们经常使用的也是这个里面的一些类文件。
继续展开：
我们发现，这个文件夹中，Header有三种，Footer有六种。看到这里的时候，想必大家跟我一样有个疑问：
这么多种有什么区别呢？
先把疑问留在这里，我们继续往下看。
Base文件夹：
再次发现，base文件夹里还有很多个Header和Footer,这是怎么回事呢？
二、类之间的关系图
看完这个图之后，是不是基本理清楚了他们之间的关系呢？有没有又发现个小问题呢？
会回弹的刷新控件和会自动刷新的上拉刷新控件又是什么呢？
小练习：
看完上面的目录介绍以及结构图之后，如果觉得自己理解了或者有印象但不清晰的话，建议自己画一幅MJRefresh的主要刷新类之间关系图。下面是我自己画的：
如果你自己不参考任何东西就可以画出来的话，说明你真的对他们之间的关系弄清楚了。
三、详细介绍 Header和Footer
1、Header
- MJRefreshHeader
效果：
MJRefreshHeader 没有文字和提示，不能弹回去，只能刷新一次。
用法：
-(void)MJRefreshHeader_Default{
__weak DownDefaultController * weakSelf = self;
self.tableView.mj_header = [MJRefreshHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
}];
}
运行结果：
正常状态：
下拉状态：
下拉恢复之后状态：
发现刷新结束之后，tableView上面多了一部分空白，使用xcode查看结构之后发现：
上面多出了一个空白的View，就是MJRefreshHeader 。
- MJRefreshNormalHeader
效果：
MJRefreshNormalHeader:最常用的那种刷新样式，有刷新状态、有时间、有上下指示的箭头。
用法：
-(void)MJRefreshNormalHeader_Normal{
__weak DownDefaultController * weakSelf = self;
self.tableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
运行效果：
正常状态：
下拉状态：
刷新状态
结束状态：
这种样式应该是最常用的一种了。
- MJRefreshGifHeader
效果：
MJRefreshGifHeader: 左边带动图的刷新，有时间，有状态。
用法：
-(void)MJRefreshGifHeader_gif{
__weak DownDefaultController * weakSelf = self;
MJRefreshGifHeader * header = [MJRefreshGifHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
NSMutableArray * imagesNormal = [NSMutableArray array];
for (int i=1; i<51; i++) {
//dropdown_anim__00060
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d",i]];
[imagesNormal addObject:image];
}
NSMutableArray * imagesPulling = [NSMutableArray array];
for (int i=51; i<61; i++) {
//dropdown_anim__00060
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d",i]];
[imagesPulling addObject:image];
}
NSMutableArray * imagesRefreshing = [NSMutableArray array];
for (int i=1; i<4; i++) {
//dropdown_loading_01
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%d",i]];
[imagesRefreshing addObject:image];
}
[header setImages:imagesNormal forState:MJRefreshStateIdle];
[header setImages:imagesPulling forState:MJRefreshStatePulling];
[header setImages:imagesRefreshing forState:MJRefreshStateRefreshing];
self.tableView.mj_header = header;
}
运行效果：
- MJRefreshStateHeader
效果：
MJRefreshStateHeader: 隐藏上下箭头图片，只有状态和时间。
用法：
-(void)MJRefreshStateHeader_state{
__weak DownDefaultController * weakSelf = self;
self.tableView.mj_header = [MJRefreshStateHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
}
运行效果：
可以看到，这里没有左边的箭头，其他功能都是与MJRefreshNormalHeader相同的。
到此为止，我们已经把Header的基本类都使用了一遍，也知道了他们的用法和运行效果。接下来呢，我们再使用上面的几个类，实现一些其他效果。
- 把时间隐藏掉（MJRefreshNormalHeader）
用法：
//把时间隐藏掉
-(void)MJRefreshHeader_HideTime{
__weak DownDefaultController * weakSelf = self;
MJRefreshNormalHeader * header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
//隐藏时间
header.lastUpdatedTimeLabel.hidden = YES;
self.tableView.mj_header = header;
}
我们到MJRefreshNormalHeader的.h中看下，我们都可以取到哪些东西呢？
这里并没有时间和状态信息，只有一个旋转菊花的样式。不在这里，就在他的父类中。继续点击到MJRefreshStateHeader中去看看。
太好了，我们发现，在这个声明文件中，我们能够拿到
刷新时间和状态。那么我们就可以自由的操作它了。虽然是readonly的属性，但是我们仍然可以更改stateLabel的文字颜色等。
注意：readonly属性的含义
readonly是修饰的当前的这个属性，也就是stateLabel这个对象。针对stateLabel，你不可以给它重新赋值，也就是不能把另一个Label对象赋值给它。但是，stateLabel自己的属性，比如
image.png
等属性都是可以更改的。可不要搞错咯。
- 自定义文字、颜色等
用法：
- 自定义文字、颜色等
-(void)MJRefreshHeader_CustomText{
__weak DownDefaultController * weakSelf = self;
MJRefreshNormalHeader * header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
[weakSelf loadData];
[weakSelf.tableView reloadData];
[weakSelf endRefresh];
}];
//设置刷新状态的文字
[header setTitle:@"正常状态" forState:MJRefreshStateIdle];
[header setTitle:@"刷新状态" forState:MJRefreshStateRefreshing];
[header setTitle:@"正在下拉状态" forState:MJRefreshStatePulling];
//设置字体
header.stateLabel.font = [UIFont systemFontOfSize:10];
header.lastUpdatedTimeLabel.font = [UIFont systemFontOfSize:7];
//设置文字颜色
header.stateLabel.textColor = [UIColor redColor];
header.lastUpdatedTimeLabel.textColor = [UIColor blueColor];
self.tableView.mj_header = header;
}
运行效果：
这里，我们就是更改了它的文字颜色和大小。
最后，我们介绍下自定义header.
大家直接看源码吧。
新建一个类CustomHeader继承自MJRefreshHeader。
.h文件：
#import "MJRefreshHeader.h"
@interface CustomHeader : MJRefreshHeader
@end
.m文件：
//
// CustomHeader.m
// TestMJ
//
// Created by weiman on 2017/11/17.
// Copyright © 2017年 weiman. All rights reserved.
//
#import "CustomHeader.h"
@interface CustomHeader()
@property(nonatomic,weak)UILabel * stateLabel;
@property(nonatomic,weak)UIImageView * imageV;
@property(nonatomic,weak)UIActivityIndicatorView *loading;
@end
@implementation CustomHeader
#pragma mark - 重写方法
#pragma mark 在这里做一些初始化配置（比如添加子控件）
-(void)prepare{
[super prepare];
//设置控件的高度
self.mj_h = 50;
//添加label
UILabel * label = [[UILabel alloc] init];
label.textColor = [UIColor redColor];
label.font = [UIFont systemFontOfSize:15];
label.textAlignment = NSTextAlignmentCenter;
[self addSubview:label];
self.stateLabel = label;
//图片
UIImageView * imageV = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
imageV.image = [UIImage imageNamed:@"refresh"];
imageV.contentMode = UIViewContentModeScaleAspectFit;
[self addSubview:imageV];
self.imageV = imageV;
//loading
UIActivityIndicatorView * loading = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
[self addSubview:loading];
self.loading = loading;
}
#pragma mark 在这里设置子控件的位置和尺寸
-(void)placeSubviews{
[super placeSubviews];
self.stateLabel.frame = self.bounds;
self.imageV.frame = CGRectMake(50, self.mj_h*0.25, 30, 30);
//self.imageV.center = CGPointMake(self.mj_w * 0.5, - self.imageV.mj_h + 20);
self.loading.center = CGPointMake(self.mj_w-30, self.mj_h*0.5);
}
#pragma mark 监听scrollView的contentOffset改变
-(void)scrollViewContentOffsetDidChange:(NSDictionary *)change{
[super scrollViewContentOffsetDidChange:change];
}
#pragma mark - 监听scrollView的contentSize改变
-(void)scrollViewContentSizeDidChange:(NSDictionary *)change{
[super scrollViewContentSizeDidChange:change];
}
#pragma mark 监听scrollView的拖拽状态改变
-(void)scrollViewPanStateDidChange:(NSDictionary *)change{
[super scrollViewPanStateDidChange:change];
}
#pragma mark - 监听控件的刷新状态
-(void)setState:(MJRefreshState)state{
MJRefreshCheckState;
switch (state) {
case MJRefreshStateIdle:
{
[self.loading stopAnimating];
self.stateLabel.text = @"下拉哟，哟乎乎";
}
break;
case MJRefreshStatePulling:
{
[self.loading stopAnimating];
self.stateLabel.text = @"赶紧放开我吧";
}
break;
case MJRefreshStateRefreshing:
{
self.stateLabel.text = @"数据加载中";
[self.loading startAnimating];
}
break;
default:
break;
}
}
#pragma mark - 监听拖拽比例（控件被拖出来的比例）
-(void)setPullingPercent:(CGFloat)pullingPercent{
[super setPullingPercent:pullingPercent];
CGFloat red = 1.0 - pullingPercent * 0.5;
CGFloat green = 0.5 - 0.5 * pullingPercent;
CGFloat blue = 0.5 * pullingPercent;
self.stateLabel.textColor = [UIColor colorWithRed:red green:green blue:blue alpha:1.0];
}
@end
运行效果：
到这里，我们了解了MJRefresh的Header的不同类之间的关系以及他们的使用方法和差别。如果您有时间，建议您自己花点时间自己敲一下，很简单的，加深记忆，也加深理解。如果您不想自己敲，也可以看我的源码，demo下载地址：
https://github.com/weiman152/TestMJ.git
欢迎大家评论，讨论，指出问题。
最后，祝大家开心。
