MJRefresh是一個好用的上下拉刷新的控件,github地址如下:https://github.com/CoderMJLee/MJRefresh很多app都使用這個控件,我們也來了解一下它的用法。下面主要是介紹在UITableView下的使用。
使用
在github上下載之後,將MJRefresh文件添加到項目中,並且在需要使用的文件上引入MJRefresh.h。然後在該文件的viewDidLoad方法中指定tableView的header和footer,如下:
#import "MJRefreshtableViewController.h"
#import "MJRefresh.h"
@interface MJRefreshtableViewController ()
@property (strong, nonatomic) IBOutlet UITableView *tableView;
@end
@implementation MJRefreshtableViewController
- (void)viewDidLoad {
[super viewDidLoad];
__weak typeof(self) weakSelf = self;
self.tableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
//刷新時候,需要執行的代碼。一般是請求最新數據,請求成功之後,刷新列表
[weakSelf loadNewData];
}];
self.tableView.mj_footer = [MJRefreshBackNormalFooter footerWithRefreshingBlock:^{
//刷新時候,需要執行的代碼。一般是請求更多數據,請求成功之後,刷新列表
[weakSelf loadNoreData];
}];
}
/**
請求獲取最新的數據
*/
- (void)loadNewData {
NSLog(@"請求獲取最新的數據");
//這裡假設2秒之後獲取到了最新的數據,刷新tableview,並且結束刷新控件的刷新狀態
__weak typeof(self) weakSelf = self;
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
//刷新列表
[weakSelf.tableView reloadData];
//拿到當前的刷新控件,結束刷新狀態
[weakSelf.tableView.mj_header endRefreshing];
});
}
/**
請求獲取更多的數據
*/
- (void)loadNoreData {
NSLog(@"請求獲取更多的數據");
//這裡假設2秒之後獲取到了更多的數據,刷新tableview,並且結束刷新控件的刷新狀態
__weak typeof(self) weakSelf = self;
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
//刷新列表
[weakSelf.tableView reloadData];
//拿到當前的刷新控件,結束刷新狀態
[weakSelf.tableView.mj_footer endRefreshing];
});
}
@end
按照app的實際情況來說,loadNoreData 和 loadNewData方法應該是發送數據請求,而結束刷新控件的刷新狀態應該是在請求失敗或者請求成功的方法中調用。
如果是帶動圖的刷新控件的話,就直接替換在viewDidLoad中的寫法即可。
- (void)viewDidLoad {
[super viewDidLoad];
__weak typeof(self) weakSelf = self;
MJRefreshGifHeader *header = [MJRefreshGifHeader headerWithRefreshingTarget:self refreshingAction:@selector(loadNewData)];
[header setImages:idleImages forState:MJRefreshStateIdle];
[header setImages:pullingImages forState:MJRefreshStatePulling];
[header setImages:refreshingImages forState:MJRefreshStateRefreshing];
self.tableView.mj_header = header;
}
其中idleImages,pullingImages,refreshingImages是圖片數組,分別對應普通閒置狀態,松開就可以進行刷新的狀態,正在刷新中的狀態等的圖片。注意,idleImages等圖片數組存儲的對象是UIImage。
如果只設置了refreshingImages,只要在刷新狀態下顯示圖片,其他狀態不顯示圖片。如果設置了idleImages或者pullingImages其中之一,所有狀態下都顯示設置的圖片。
同理,設置底部帶動畫效果的footer:
- (void)viewDidLoad {
[super viewDidLoad];
MJRefreshBackGifFooter *footer = [MJRefreshBackGifFooter footerWithRefreshingTarget:self refreshingAction:@selector(endRefreshing)];
[footer setImages:idleImages forState:MJRefreshStateIdle];
[footer setImages:pullingImages forState:MJRefreshStatePulling];
[footer setImages:refreshingImages forState:MJRefreshStateRefreshing];
self.tableView.mj_footer = footer;
}
PO一張效果圖:
header.stateLabel.hidden = YES; header.lastUpdatedTimeLabel.hidden = YES;
如果隱藏右邊狀態或者更新時間其中一行文字,則顯示的一行文字會垂直居中,效果如下:
如果把右邊的兩行文字都隱藏了,只顯示圖片,則圖片居中,效果如下:
如果覺得動畫頻率過快或者過低,可以修改MJRefresh以下位置。
使用以下方法還可以修改顯示文字
[header setTitle:@"下拉刷新" forState:MJRefreshStateIdle]; [header setTitle:@"釋放開始刷新哦~" forState:MJRefreshStatePulling]; [header setTitle:@"正在快馬加鞭地刷新著呢" forState:MJRefreshStateRefreshing];
其他控件的用法
UICollectionView 和UIScrollView的用法與UITableView的用法一致,只需將上面所說的tableView.mj_header 改成 collectionView.mj_header 和 scrollView.mj_header 即可。例如:
self.collectionView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
//刷新時候,需要執行的代碼。一般是請求最新數據,請求成功之後,刷新列表
[weakSelf loadNewData];
}];
self.scrollView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
//刷新時候,需要執行的代碼。一般是請求最新數據,請求成功之後,刷新列表
[weakSelf loadNewData];
}];
又因UIWebView 自帶一個UIScrollView的屬性,所以UIWebView也可以使用MJRefresh,用法如下:
self.webView.scrollView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
//刷新時候,需要執行的代碼。一般是請求最新數據,請求成功之後,刷新列表
[weakSelf loadNewData];
}];
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持本站。
[db:作者簡介][db:原文翻譯及解析]【iOS上下拉刷新控件MJRefresh使用方法詳解】的相關資料介紹到這裡,希望對您有所幫助! 提示:不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦!