當我們使用上拉或著下拉的時候,自己實現的話, 往往會耗費很多的時候來計算縮進。我們可以選擇第三方的刷新控件,MJRefresh,這個也是現在使用的比較多的一個刷新,集成的話可以到github上面下載https://github.com/CoderMJLee/MJRefresh,也可以使用cocoapods集成 pod 'MJRefresh'
-
1 最簡單添加方法 有狀態,時間 默認顏色
UITableView *mytableView = [[UITableView alloc] initWithFrame:self.view.bounds];
mytableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
[self.view addSubview:mytableView];
- (void)headerAction
{
}
//手動進入刷新狀態
[mytableView.mj_header beginRefreshing];
//手動結束刷新狀態
[mytableView.mj_header endRefreshing];
//根據拖拽比例自動切換透明度
mytableView.mj_header.automaticallyChangeAlpha = YES;
//2使用block
mytableView.mj_header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
//刷新代碼
}];
下拉默認2.gif
-
下拉刷新有動畫圖片
我們在github下載框架,是可以動態展示刷新動畫的,如果我們自己公司的項目,要提前準備好,三組動畫圖片,這樣在不同的狀態我們要顯示,這里我演示了一下如何添加,并顯示刷新狀態的圖片。圖片資源可以從下載的MJRefresh例子找到!
//有動畫圖片
MJRefreshGifHeader *header = [MJRefreshGifHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
//普通狀態下的圖片
NSMutableArray *idleImages = [NSMutableArray array];
for (int i = 0; i < 44; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d", i+1]];
NSLog(@"%@", [NSString stringWithFormat:@"dropdown_anim__000%02d", i+1]);
if (img) {
[idleImages addObject:img];
}
}
[header setImages:idleImages forState:MJRefreshStateIdle];
NSMutableArray *pullingImages = [NSMutableArray array];
for (int i = 45; i < 60; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d", i+1]];
NSLog(@"%@", [NSString stringWithFormat:@"dropdown_anim__000%d", i+1]);
if (img) {
[pullingImages addObject:img];
}
}
[header setImages:pullingImages forState:MJRefreshStatePulling];
//刷新d中的動畫圖片
NSMutableArray *refreshingImages = [NSMutableArray array];
for (int i = 0; i < 2; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%i", i + 1]];
if (img) {
[refreshingImages addObject:img];
}
}
[header setImages:refreshingImages forState:MJRefreshStateRefreshing];
mytableView.mj_header = header;
下拉可愛動畫.gif
如果我們想要控制是否顯示時間之類
MJRefreshNormalHeader *header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
//是否隱藏時間
header.lastUpdatedTimeLabel.hidden = YES;
//文字顏色
header.stateLabel.textColor = [UIColor redColor];
//普通狀態的文字
[header setTitle:@"下拽刷新" forState:MJRefreshStateIdle];
//松開可以刷新
[header setTitle:@"你刷開" forState:MJRefreshStatePulling];
//正在刷新
[header setTitle:@"刷新中sll" forState:MJRefreshStateRefreshing];
- 隱藏時間
MJRefreshNormalHeader *header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
header.lastUpdatedTimeLabel.hidden = YES;
mytableView.mj_header = header;
隱藏時間2.gif
- 隱藏時間和狀態
MJRefreshNormalHeader *header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
// //是否隱藏時間
header.lastUpdatedTimeLabel.hidden = YES;
//隱藏狀態
header.stateLabel.hidden = YES;
mytableView.mj_header = header;
隱藏時間和狀態2.gif
自定義文字
MJRefreshNormalHeader *header = [MJRefreshNormalHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
// //文字顏色
header.stateLabel.textColor = [UIColor redColor];
header.lastUpdatedTimeLabel.textColor = [UIColor blueColor];
//字體
header.stateLabel.font = [UIFont systemFontOfSize:15];
header.lastUpdatedTimeLabel.font = [UIFont systemFontOfSize:14];
//菊花的顏色
header.loadingView.color = [UIColor whiteColor];
// //普通
[header setTitle:@"往下拉刷新數據" forState:MJRefreshStateIdle];
//松開可以刷新
[header setTitle:@"松開加載數據" forState:MJRefreshStatePulling];
//正在刷新
[header setTitle:@"拼命加載中..." forState:MJRefreshStateRefreshing];
//文字慢慢的顯現
mytableView.mj_header.automaticallyChangeAlpha = YES;
[self.view addSubview:mytableView];
mytableView.mj_header = header;
自定義文字.gif
完全自定義內部刷新控件
這是我們創建的類要繼承于MJRefreshHeader,可以根據里面設置狀態的時候,處理我們自己的控件。
@implementation MyDiyRefreshHeader
- (instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame])
{
/* 如果我們a在拖拽的時候希望上面要現實一張圖片,廣告,公司的標志等,可以在這個空間上面添加,只不過位置要改成負數的
*/
UILabel *label = [[UILabel alloc] init];
label.backgroundColor = [UIColor orangeColor];
label.hidden = YES;
[self addSubview:label];
self.label = label;
UIImageView *ad = [[UIImageView alloc] init];
ad.image = [UIImage imageNamed:@"dropdown_anim__00024"];
[self addSubview:ad];
self.adImageView = ad;
}
return self;
}
- (void)layoutSubviews
{
[super layoutSubviews];
self.label.frame = CGRectMake(0, 0, 220, 50);
self.adImageView.frame = CGRectMake((self.bounds.size.width -50) / 2, -50, 50, 50);
}
- (void)setState:(MJRefreshState)state
{
[super setState:state];
self.label.hidden = NO;
if (state == MJRefreshStateIdle) //正常
{
self.label.backgroundColor = [UIColor redColor];
}
else if (state == MJRefreshStatePulling) { //松開可以刷新
self.label.backgroundColor = [UIColor blueColor];
}
else if (state == MJRefreshStateRefreshing){ //正在刷新
self.label.backgroundColor = [UIColor orangeColor];
}
}
很方便的使用,我們不需要去關心滾動的計算了
//添加方法
self.tableView.mj_header = [MyDiyRefreshHeader headerWithRefreshingTarget:self refreshingAction:@selector(headerAction)];
//block方式添加
self.tableView.mj_header = [MyDiyRefreshHeader headerWithRefreshingBlock:^{
}];
完全自定義內部控件.gif
上拉加載更多的使用
//默認方式
//block
// self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingBlock:^{
// }];
//
self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
//結束刷新
[mytableView.mj_footer endRefreshing];
//如果提醒他沒有更多的數據了
[mytableView.mj_footer endRefreshingWithNoMoreData];
上拉默認.gif
上拉帶動畫圖片
//上拉加載帶動畫
MJRefreshAutoGifFooter *footer = [MJRefreshAutoGifFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
//刷新d中的動畫圖片
NSMutableArray *refreshingImages = [NSMutableArray array];
for (int i = 0; i < 2; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%i", i + 1]];
if (img) {
[refreshingImages addObject:img];
}
}
[footer setImages:refreshingImages forState:MJRefreshStateRefreshing];
self.tableView.mj_footer = footer;
上拉帶動畫.gif
上拉隱藏刷新的文字
MJRefreshAutoGifFooter *footer = [MJRefreshAutoGifFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
//刷新d中的動畫圖片
NSMutableArray *refreshingImages = [NSMutableArray array];
for (int i = 0; i < 2; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%i", i + 1]];
if (img) {
[refreshingImages addObject:img];
}
}
[footer setImages:refreshingImages forState:MJRefreshStateRefreshing];
//隱藏刷新的文字
footer.refreshingTitleHidden = YES;
self.tableView.mj_footer = footer;
上拉隱藏文字.gif
上拉全部加載完畢
//全部加載完畢
self.tableView.mj_footer = [MJRefreshAutoNormalFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
//刷新結束的時候要調用
[self.tableView.mj_footer endRefreshingWithNoMoreData];
上拉全部加載完畢.gif
上拉自定義文字
/上拉自定義文字
MJRefreshAutoNormalFooter *footer = [MJRefreshAutoNormalFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
[footer setTitle:@"點擊或拖拽加載" forState:MJRefreshStateIdle];
[footer setTitle:@"加載中 ..." forState:MJRefreshStateRefreshing];
[footer setTitle:@"沒有更多數據" forState:MJRefreshStateNoMoreData];
// Set font
footer.stateLabel.font = [UIFont systemFontOfSize:17];
// Set textColor
footer.stateLabel.textColor = [UIColor blueColor];
self.tableView.mj_footer = footer;
上拉自定義文字.gif
上拉自動回彈在最底部
self.tableView.tableFooterView = [[UIView alloc] init];
self.tableView.mj_footer = [MJRefreshBackNormalFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
上拉自動回彈.gif
上拉加載回彈帶圖片動畫
//自動回彈2帶h動畫圖片
MJRefreshBackGifFooter *footer = [MJRefreshBackGifFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
// 普通狀態下的圖片
NSMutableArray *idleImages = [NSMutableArray array];
for (int i = 0; i < 44; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d", i+1]];
NSLog(@"%@", [NSString stringWithFormat:@"dropdown_anim__000%02d", i+1]);
if (img) {
[idleImages addObject:img];
}
}
[footer setImages:idleImages forState:MJRefreshStateIdle];
// 松開刷開的時候
NSMutableArray *pullingImages = [NSMutableArray array];
for (int i = 45; i < 60; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_anim__000%d", i+1]];
NSLog(@"%@", [NSString stringWithFormat:@"dropdown_anim__000%d", i+1]);
if (img) {
[pullingImages addObject:img];
}
}
[footer setImages:pullingImages forState:MJRefreshStatePulling];
// 刷新的圖片
NSMutableArray *refreshingImages = [NSMutableArray array];
for (int i = 0; i < 2; i++)
{
UIImage *img = [UIImage imageNamed:[NSString stringWithFormat:@"dropdown_loading_0%i", i + 1]];
if (img) {
[refreshingImages addObject:img];
}
}
[footer setImages:refreshingImages forState:MJRefreshStateRefreshing];
// Set footer
self.tableView.mj_footer = footer;
self.tableView.tableFooterView = [[UIView alloc] init];
上拉自動回彈帶圖片動畫.gif
自定義刷新控件
#import "MyDIYAutoFooter.h"
@interface MyDIYAutoFooter ()
@property (nonatomic, weak) UILabel *label;
@property (nonatomic, weak) UIActivityIndicatorView *loading;
@end
@implementation MyDIYAutoFooter
#pragma mark - 添加子控件 -
- (void)prepare
{
[super prepare];
UILabel *label = [[UILabel alloc] init];
label.backgroundColor = [UIColor orangeColor];
label.text = @"自定義的刷新";
label.textAlignment = NSTextAlignmentCenter;
[self addSubview:label];
self.label = label;
UIActivityIndicatorView *loading = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
[self addSubview:loading];
self.loading = loading;
}
#pragma mark - 設置自控件的尺寸和位子 -
- (void)placeSubviews
{
[super placeSubviews];
self.label.frame = CGRectMake((self.bounds.size.width - 200) / 2, 0, 200, 50);
self.loading.center = CGPointMake(35, 25);
}
#pragma mark - 監聽狀態的改變 -
- (void)setState:(MJRefreshState)state
{
MJRefreshCheckState;
switch (state) {
case MJRefreshStateIdle:
self.label.text = @"拖動加載更多";
[self.loading stopAnimating];
break;
case MJRefreshStatePulling:
self.label.text = @"松開加載更多";
[self.loading stopAnimating];
break;
case MJRefreshStateRefreshing:
self.label.text = @"加載數據中!!!";
[self.loading startAnimating];
break;
case MJRefreshStateNoMoreData:
self.label.text = @"沒有更多的數據!!!";
[self.loading stopAnimating];
break;
default:
break;
}
}
使用
self.tableView.mj_footer = [MyDIYAutoFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
自定義上拉加載控件1.gif
上拉自動回彈,自定義視圖
#import "MJRefreshBackFooter.h"
@interface MyDIYBackFooter : MJRefreshBackFooter
@end
#import "MyDIYBackFooter.h"
@interface MyDIYBackFooter ()
@property (nonatomic, weak) UILabel *label;
@property (nonatomic, weak) UIActivityIndicatorView *loading;
@end
@implementation MyDIYBackFooter
#pragma mark - 添加子控件 -
- (void)prepare
{
[super prepare];
UILabel *label = [[UILabel alloc] init];
label.backgroundColor = [UIColor orangeColor];
label.text = @"自定義的刷新";
label.textAlignment = NSTextAlignmentCenter;
[self addSubview:label];
self.label = label;
UIActivityIndicatorView *loading = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
[self addSubview:loading];
self.loading = loading;
}
#pragma mark - 設置自控件的尺寸和位子 -
- (void)placeSubviews
{
[super placeSubviews];
self.label.frame = CGRectMake((self.bounds.size.width - 200) / 2, 0, 200, 50);
self.loading.center = CGPointMake(35, 25);
}
#pragma mark - 監聽狀態的改變 -
- (void)setState:(MJRefreshState)state
{
MJRefreshCheckState;
switch (state) {
case MJRefreshStateIdle:
self.label.text = @"拖動加載更多";
[self.loading stopAnimating];
break;
case MJRefreshStatePulling:
self.label.text = @"松開加載更多";
[self.loading stopAnimating];
break;
case MJRefreshStateRefreshing:
self.label.text = @"加載數據中!!!";
[self.loading startAnimating];
break;
case MJRefreshStateNoMoreData:
self.label.text = @"沒有更多的數據!!!";
[self.loading stopAnimating];
break;
default:
break;
}
}
@end
//使用
self.tableView.mj_footer = [MyDIYBackFooter footerWithRefreshingTarget:self refreshingAction:@selector(footerAction)];
self.tableView.tableFooterView = [[UIView alloc] init];
上拉回彈自定義視圖.gif
如果我們的刷新控件自已的很多地方都需要使用,需要對刷新控件進行調整,需要自己定義一個類來完成操作
//是否隱藏時間
header.lastUpdatedTimeLabel.hidden = YES;
//文字顏色
header.stateLabel.textColor = [UIColor redColor];
//文字顏色
header.stateLabel.textColor = [UIColor redColor];
//普通
[header setTitle:@"下拽刷新" forState:MJRefreshStateIdle];
//松開可以刷新
[header setTitle:@"你刷開" forState:MJRefreshStateIdle];
//正在刷新
[header setTitle:@"刷新中sll" forState:MJRefreshStateIdle];
如果很多的地方都需要使用到這些屬性的人話,我們可以自己定義一個類,讓他繼承于MJRefreshNormalHeader
#import "MyRefreshHeader.h"
@implementation MyRefreshHeader
- (instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
//是否隱藏時間
self.lastUpdatedTimeLabel.hidden = YES;
//文字顏色
self.stateLabel.textColor = [UIColor redColor];
//普通
[self setTitle:@"下拽刷新" forState:MJRefreshStateIdle];
//松開可以刷新
[self setTitle:@"你刷開" forState:MJRefreshStatePulling];
//正在刷新
[self setTitle:@"刷新中sll" forState:MJRefreshStateRefreshing];
return self;
}
}
@end