推薦一下: iOS鏈?zhǔn)絼?chuàng)建UI終結(jié)者 ? PPMaker
2018-05-10
注意
上拉和下拉的刷新控件都會(huì)顯示,如果沒有網(wǎng)的時(shí)候就兩個(gè)都顯示的解決辦法,詳細(xì)見評(píng)論
41樓。
生活要多點(diǎn)蛋定
俗話說 “工欲善其事,必先利其器”,好的成熟的第三方,是我們開發(fā)路上的利器;俗話又說“君子生非異也,善假于物也”
NB的人并不是生下來(lái)就和別人不一樣,只是他們擅于使用工具罷了!,熟練使用這些第三方,你就是開發(fā)者的"君子"!本篇旨在更詳細(xì)指導(dǎo)怎么使用對(duì)應(yīng)的第三方,不會(huì)過多說明第三方怎么實(shí)現(xiàn)!
就像你買了部新手機(jī),說明書只說明怎么使用(及注意事項(xiàng)),并不說明手機(jī)由什么構(gòu)造以及怎么制造!。
PPDemos地址
注意demo用的是3.1.2版本,運(yùn)行可能出現(xiàn)Terminating app due to uncaught exception 'NSRangeException', reason: '*** -[NSTaggedPointerString substringToIndex:]: Index 9223372036854775807 out of bounds; string length 2',請(qǐng)更新到最新就好了2016--07--04
一. 新舊版本比較
舊版本使用說明
#import "UIScrollView+MJRefresh.h" /** MJ友情提示: 1. 添加頭部控件的方法 [self.tableView addHeaderWithTarget:self action:@selector(headerRereshing)]; 或者 [self.tableView addHeaderWithCallback:^{ }]; 2. 添加尾部控件的方法 [self.tableView addFooterWithTarget:self action:@selector(footerRereshing)]; 或者 [self.tableView addFooterWithCallback:^{ }]; 3. 可以在MJRefreshConst.h和MJRefreshConst.m文件中自定義顯示的文字內(nèi)容和文字顏色 4. 本框架兼容iOS6\\\\iOS7,iPhone\\\\iPad橫豎屏 5.自動(dòng)進(jìn)入刷新狀態(tài) 1> [self.tableView headerBeginRefreshing]; 2> [self.tableView footerBeginRefreshing]; 6.結(jié)束刷新 1> [self.tableView headerEndRefreshing]; 2> [self.tableView footerEndRefreshing]; */
新版本介紹
version= '3.1.5',2016-06-13
1.添加前綴mj_;
2.支持國(guó)際化zh-Hans(簡(jiǎn)體中文),zh-Hant(繁體中文),en(英文)
3.可以自定義刷新控件
4.更加自由化,支持文字,圖片,GIF等混合搭配(有點(diǎn)扯)
最新的MJRefresh的GitHub倉(cāng)庫(kù)截圖如圖mj-01:
圖mj-01 MJRefresh的GitHub倉(cāng)庫(kù)截圖
二.MJRefresh解析
1 . MJRefresh的框架圖如圖mj-02:

2 . MJRefresh的框架圖梳理
| 類 | 作用 |
|---|---|
| MJRefreshComponent | 繼承自UIView,最基本的刷新類 |
| MJRefreshHeader | 最基本的下拉刷新類 |
| MJRefreshStateHeader | 可以下拉刷新,但是只有文字 |
| MJRefreshNormalHeader | 默認(rèn)的刷新樣式,有文字,有上下箭頭,有菊花 |
抱歉說下:上面MJ的框架圖說的已經(jīng)很詳細(xì)了,具體的上拉加載更多就不寫了
3 . MJRefresh使用技巧或建議
3.1 無(wú)論是下拉刷新還是上拉加載,都最好使用
圖mj-02分支最后面的某一個(gè),因?yàn)樵胶竺娣止ぴ皆敿?xì),刷新控件處理的越細(xì)致;
3.2 自定義刷新控件,后面有講解;
三 .MJRefresh詳細(xì)使用指導(dǎo)所有說明都配合代碼講解
① MJRefresh默認(rèn)的
下拉刷新和上拉加載
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
//默認(rèn)【下拉刷新】
self.tableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(refresh)];
//默認(rèn)【上拉加載】
self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingTarget:self refreshingAction:@selector(loadMore)];
}
-(void)refresh
{
[self getNetworkData:YES];
}
-(void)loadMore
{
[self getNetworkData:NO];
}
② MJRefresh默認(rèn)的
下拉刷新和上拉加載【使用Block方法】
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
__weak typeof(self) weakSelf = self;
//默認(rèn)block方法:設(shè)置下拉刷新
self.tableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
[weakSelf getNetworkData:YES];
}];
//默認(rèn)block方法:設(shè)置上拉加載更多
self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingBlock:^{
//Call this Block When enter the refresh status automatically
[weakSelf getNetworkData:NO];
}];
}
③ MJRefresh更自定義化的
下拉刷新和上拉加載
- 動(dòng)畫圖片樣式;
- 隱藏刷新控件狀態(tài)或者時(shí)間樣式;
- 自定義刷新狀態(tài)和刷新時(shí)間文字樣式【當(dāng)然了,對(duì)應(yīng)的Label不能隱藏】
- (void)viewDidLoad {
[super viewDidLoad];
//樣式一:設(shè)置一張圖片(無(wú)動(dòng)畫效果)
// NSArray *idleImages = [NSArray arrayWithObject:[UIImage imageNamed:@"xiala_icon.png"]];
//樣式二:設(shè)置多張圖片(有動(dòng)畫效果)
NSArray *idleImages = [NSArray arrayWithObjects:
[UIImage imageNamed:@"dropdown_loading_01.png"],
[UIImage imageNamed:@"dropdown_loading_02.png"],
[UIImage imageNamed:@"dropdown_loading_03.png"],nil];
NSArray *pullingImages = [NSArray arrayWithObject:[UIImage imageNamed:@"shifang_icon.png"]];
NSArray *refreshingImages = [NSArray arrayWithObjects:
[UIImage imageNamed:@"load_view_01.png"],
[UIImage imageNamed:@"load_view_02.png"],
[UIImage imageNamed:@"load_view_03.png"],
[UIImage imageNamed:@"load_view_04.png"],
[UIImage imageNamed:@"load_view_05.png"],
[UIImage imageNamed:@"load_view_06.png"],
[UIImage imageNamed:@"load_view_07.png"],
[UIImage imageNamed:@"load_view_08.png"],
[UIImage imageNamed:@"load_view_09.png"],
[UIImage imageNamed:@"load_view_010.png"], nil];
// MJRefreshGifHeader *header = [MJRefreshGifHeader headerWithRefreshingTarget:self refreshingAction:@selector(animationRefresh)];
//-------以下是使用block方法【不包含animationRefresh方法】,動(dòng)畫設(shè)置在上面的部分代碼---------
__weak typeof(self) weakSelf = self;
MJRefreshGifHeader *header = [MJRefreshGifHeader headerWithRefreshingBlock:^{
[weakSelf getNetworkData:YES];
}];
//-------以上是使用block方法【不包含animationRefresh方法】,動(dòng)畫設(shè)置在上面的部分代碼---------
//1.設(shè)置普通狀態(tài)的動(dòng)畫圖片
[header setImages:idleImages forState:MJRefreshStateIdle];
//2.設(shè)置即將刷新狀態(tài)的動(dòng)畫圖片(一松開就會(huì)刷新的狀態(tài))
[header setImages:pullingImages forState:MJRefreshStatePulling];
//3.設(shè)置正在刷新狀態(tài)的動(dòng)畫圖片
[header setImages:refreshingImages forState:MJRefreshStateRefreshing];
self.tableView.mj_header = header;
#pragma mark --- 下面兩個(gè)設(shè)置根據(jù)各自需求設(shè)置
// // 隱藏更新時(shí)間
// header.lastUpdatedTimeLabel.hidden = YES;
//
// // 隱藏刷新狀態(tài)
// header.stateLabel.hidden = YES;
#pragma mark --- 自定義刷新狀態(tài)和刷新時(shí)間文字【當(dāng)然了,對(duì)應(yīng)的Label不能隱藏】
// Set title
[header setTitle:@"Pull down to refresh" forState:MJRefreshStateIdle];
[header setTitle:@"Release to refresh" forState:MJRefreshStatePulling];
[header setTitle:@"Loading ..." forState:MJRefreshStateRefreshing];
// Set font
header.stateLabel.font = [UIFont systemFontOfSize:15];
header.lastUpdatedTimeLabel.font = [UIFont systemFontOfSize:14];
// Set textColor
header.stateLabel.textColor = [UIColor redColor];
header.lastUpdatedTimeLabel.textColor = [UIColor blueColor];
}
#pragma mark --- "動(dòng)畫圖片"樣式的非block方法
-(void)animationRefresh
{
[self getNetworkData:YES];
}
④ MJRefresh完全自定義化的
下拉刷新和上拉加載
④-1. 最終調(diào)用
- (void)viewDidLoad {
[super viewDidLoad];
//MJRefresh自定義刷新控件
__weak typeof(self) weakSelf = self;
self.tableView.mj_header = [MJDIYHeader headerWithRefreshingBlock:^{
[weakSelf getNetworkData:YES];
}];
}
④-2. 完全自定義的下拉刷新控件上拉暫還沒看
更多信息請(qǐng)參看MJDIYHeade.m
更多信息請(qǐng)參看MJDIYHeade.m
更多信息請(qǐng)參看MJDIYHeade.m
(嘿嘿,我錯(cuò)了,當(dāng)然不能這樣忽悠過了,請(qǐng)往下繼續(xù)......)
④-3. 【附】:MJRefresh自定義刷新控件步驟(just 3 步)重要
說明:最好參考MJDIYHeader.m來(lái)學(xué)習(xí),就不一一截圖說明
① 首先創(chuàng)建一個(gè)類(譬如MJDIYHeader),繼承自MJRefreshHeader;
② 重寫相關(guān)方法 【 在MJRefreshComponent.h中有下面的提示】
#pragma mark - 交給子類們?nèi)?shí)現(xiàn)
/** 初始化 */
#pragma mark 在這里做一些初始化配置(比如添加子控件)
-(void)prepare NS_REQUIRES_SUPER;
/** 擺放子控件frame */
#pragma mark 在這里設(shè)置子控件的位置和尺寸
-(void)placeSubviews NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的contentOffset發(fā)生改變的時(shí)候調(diào)用 */
-(void)scrollViewContentOffsetDidChange:(NSDictionary *)change NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的contentSize發(fā)生改變的時(shí)候調(diào)用 */
-(void)scrollViewContentSizeDidChange:(NSDictionary *)change NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的拖拽狀態(tài)發(fā)生改變的時(shí)候調(diào)用 */
-(void)scrollViewPanStateDidChange:(NSDictionary *)change NS_REQUIRES_SUPER;
③ 調(diào)用!OK啦!嘿嘿!
四. 最后,上面的刷新和加載這么簡(jiǎn)單,等等,還有一點(diǎn)注意呢
下拉刷新 --- 獲取最新數(shù)據(jù);
上拉加載 --- 獲取更多數(shù)據(jù);
四-1. PPDemos中的刷新類都是繼承自MJViewController的,所以在刷新和加載的類MJDefaultViewController,MJDefaultBlockViewController,MJAnimationImageViewController,MJCustomRefreshViewController中,只需要在viewDidLoad中調(diào)用即可;
四-2. MJViewController.h 父類的,子類都可以用
//
// MJViewController.h
// MJDemos
//
// Created by Abner on 16/6/13.
// Copyright ? 2016年 PPAbner. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface MJViewController : UIViewController
{
int page;
BOOL isFirstCome; //第一次加載帖子時(shí)候不需要傳入此關(guān)鍵字,當(dāng)需要加載下一頁(yè)時(shí):需要傳入加載上一頁(yè)時(shí)返回值字段“maxtime”中的內(nèi)容。
int totalPage;//總頁(yè)數(shù)
BOOL isJuhua;//是否正在下拉刷新或者上拉加載。default NO。
}
@property(nonatomic,strong)NSMutableArray *pictures;
@property(nonatomic,strong)UITableView *tableView;
/** maxtime */
@property(nonatomic,copy)NSString *maxtime;
/**
* 獲取網(wǎng)絡(luò)數(shù)據(jù)
* @param isRefresh 是否是下拉刷新
*/
-(void)getNetworkData:(BOOL)isRefresh;
@end
四-3. MJViewController.m
//
// MJViewController.m
// MJDemos
//
// Created by Abner on 16/6/13.
// Copyright ? 2016年 PPAbner. All rights reserved.
//
#import "MJViewController.h"
#import "MJPicture.h"
@interface MJViewController ()<UITableViewDelegate,UITableViewDataSource>
@end
@implementation MJViewController
-(void)viewWillDisappear:(BOOL)animated
{
isFirstCome = YES;
}
//一進(jìn)來(lái)就讓自動(dòng)刷新
-(void)viewWillAppear:(BOOL)animated
{
[self.tableView.mj_header beginRefreshing];
}
- (void)viewDidLoad {
[super viewDidLoad];
page = 0;
isFirstCome = YES;
isJuhua = NO;
[self creatUI];
}
/**
* 停止刷新
*/
-(void)endRefresh{
if (page == 0) {
[self.tableView.mj_header endRefreshing];
}
[self.tableView.mj_footer endRefreshing];
}
-(void)creatUI
{
self.tableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, ScreenWidth, ScreenHeight) style:UITableViewStylePlain];
self.tableView.delegate =self;
self.tableView.dataSource =self;
[self.view addSubview:self.tableView];
self.tableView.tableFooterView = [UIView new];
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
}
-(void)getNetworkData:(BOOL)isRefresh
{
if (isRefresh) {
page = 0;
isFirstCome = YES;
}else{
page++;
}
NSString *url;
if (isFirstCome) {
url = [NSString stringWithFormat:MissBaisiImageUrl,@"",page];
}else{
url = [NSString stringWithFormat:MissBaisiImageUrl,self.maxtime,page];
}
// [HYBNetworking cacheGetRequest:YES shoulCachePost:YES];
[HYBNetworking getWithUrl:url refreshCache:NO params:nil progress:^(int64_t bytesRead, int64_t totalBytesRead) {
} success:^(id response) {
PPLog(@"請(qǐng)求成功---%@",response);
[self endRefresh];
isJuhua = NO; //數(shù)據(jù)獲取成功后,設(shè)置為NO
NSDictionary *dict = (NSDictionary *)response;
NSDictionary *infoDict = [dict objectForKey:@"info"];
totalPage = (int)[infoDict objectForKey:@"page"];
self.maxtime = [infoDict objectForKey:@"maxtime"];
if (page == 0) {
[_pictures removeAllObjects];
}
//判斷是否有菊花正在加載,如果有,判斷當(dāng)前頁(yè)數(shù)是不是大于最大頁(yè)數(shù),是的話就不讓加載,直接return;(因?yàn)橄吕漠?dāng)前頁(yè)永遠(yuǎn)是最小的,所以直接return)
if (isJuhua) {
if (page >= totalPage) {
[self endRefresh];
}
return ;
}
//沒有菊花正在加載,所以設(shè)置yes
isJuhua = YES;
//顯然下面的方法適用于上拉加載更多
if (page >= totalPage) {
[self endRefresh];
return;
}
//獲取模型數(shù)組
NSArray *pictureArr = [dict objectForKey:@"list"];
for (NSDictionary *dic in pictureArr) {
MJPicture *picture = [[MJPicture alloc]init];
[picture setValuesForKeysWithDictionary:dic];
[self.pictures addObject:picture];
}
[self.tableView reloadData];
//獲取成功一次就判斷
isFirstCome = NO;
} fail:^(NSError *error) {
PPLog(@"請(qǐng)求失敗---%@",error);
}];
}
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return _pictures.count;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
if (!cell) {
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];
}
MJPicture * picture = _pictures[indexPath.row];
cell.textLabel.text = picture.name;
cell.detailTextLabel.text = picture.passtime;
[cell.imageView sd_setImageWithURL:[NSURL URLWithString:picture.profile_image]];
return cell;
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
-(NSMutableArray *)pictures
{
if (_pictures == nil) {
_pictures = [NSMutableArray array];
}
return _pictures;
}
@end
結(jié)束語(yǔ):最初自己在簡(jiǎn)書上轉(zhuǎn)載別人的文章MJRefresh實(shí)現(xiàn)刷新(使用它的Block方法),看到有好多閱讀量,并且還有小伙伴問我,自己也一直說更新,但沒有更新,6月13號(hào)剛好有空,就去下了最新的MJRefresh準(zhǔn)備自己寫篇使用指導(dǎo),下午快下班的時(shí)候遇到MJRefresh國(guó)際化的bug,在Issues了MJ后,bug被當(dāng)晚解決了,14號(hào)早上也是收到MJ的郵件,非常開心!??!為開源點(diǎn)贊,也要做貢獻(xiàn)!
最后附上一張圖,iOS開發(fā)我的偶像吧,算是!激勵(lì)自己而已!

2016--06--17 00:37:10,晚安!

