ios-上拉載入更多的介面

標籤：ios 上拉載入更多

想試一下上拉載入更多怎麼實現開始自己的研究之旅，看了兩天終於做出了介面。

之所以這麼慢是因為，我不知道要將上拉出現的view放在哪，就能在scrollView拉到底部的時候被拉出來。還有就是怎麼拉出來之後停在這裡。網上下載例子之後研究了兩天：

先說一下，在下面處理圖片中橘色view的位置的時候用了kvo進行了監聽；

先一個枚舉 來指示目前重新整理view是在哪個狀態：

typedef enum {    RefreshStateLoading = 1,//重新整理狀態為正在載入    RefreshStateRelease,    //下拉完成釋放之前    RefreshStateNomal,      //原始狀態}RefreshState;

下面一個類view來描述重新整理view

@interface FootView : UIView@property (nonatomic,strong) UIActivityIndicatorView *activity;//活動指示條@property (nonatomic,strong) UIImageView *imageView;            //箭頭圖片@property (nonatomic,strong) UILabel *infolabel;                //文字指示@property (nonatomic,assign) RefreshState refreshState;         //重新整理的狀態- (void)refreshStateLoading;- (void)refreshStateNomal;- (void)refreshStateRelsease;@end

#import "FootView.h"@implementation FootView@synthesize activity;@synthesize imageView;@synthesize infolabel;@synthesize refreshState;- (id)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {        self.backgroundColor = [UIColor orangeColor];                //活動指標初始化        activity = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];        activity.frame = CGRectMake(10, 0, 50, 70);        [self addSubview:activity];                //箭頭圖片初始化        imageView = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, 30, 50)];        imageView.image = [UIImage imageNamed:@"blackArrow.png"];        [self addSubview:imageView];                //資訊label初始化        infolabel = [[UILabel alloc]initWithFrame:CGRectMake(100,0 ,100, 70)];        infolabel.text = @"下拉重新整理...";        infolabel.font = [UIFont fontWithName:@"Helvetica" size:20];        infolabel.textAlignment = NSTextAlignmentCenter;        infolabel.textColor = [UIColor blackColor];        [self addSubview:infolabel];                //設定初始狀態        self.refreshState = RefreshStateNomal;    }    return self;}//初始狀態- (void)refreshStateNomal{    self.refreshState = RefreshStateNomal;    [self.activity stopAnimating];    self.infolabel.text = @"下拉載入更多...";    self.imageView.layer.transform = CATransform3DMakeRotation(M_PI * 2, 0, 0, 1);    self.imageView.hidden = NO;}//正在請求資料時- (void)refreshStateLoading{    self.refreshState = RefreshStateLoading;    self.imageView.hidden = YES;    [UIView beginAnimations:nil context:nil];    self.infolabel.text = @"正在載入...";    [self.activity startAnimating];    [UIView commitAnimations];}//下拉完成後- (void)refreshStateRelsease{    self.refreshState = RefreshStateRelease;    [UIView beginAnimations:nil context:nil];    self.infolabel.text = @"釋放後載入...";    self.imageView.layer.transform = CATransform3DMakeRotation(M_PI, 0, 0, 1);    [UIView commitAnimations];    }@end

下面來寫table

#import <UIKit/UIKit.h>@interface MyTableVC : UITableViewController<UIScrollViewDelegate>@property (nonatomic,strong) NSMutableArray *dataArray;//資料@end

#import "MyTableVC.h"#import "FootView.h"#define TABLE_CELL_HIGHT 50.0@interface MyTableVC ()@end@implementation MyTableVC{    FootView *footView;}@synthesize dataArray;- (id)initWithStyle:(UITableViewStyle)style{    self = [super initWithStyle:style];    if (self) {            }    return self;}- (void)viewDidLoad{    [super viewDidLoad];    dataArray = [NSMutableArray arrayWithArray:@[@"列表1",@"列表2",@"列表3",@"列表2",@"列表3",@"列表2",@"列表3",@"列表2",@"列表3",@"列表2",@"列表3",@"列表2",@"列表3",@"列表2",@"列表5"]];    [self addPullToRefreshFooter];}//添加FootView指標- (void)addPullToRefreshFooter{    //FootView初始化    footView = [[FootView alloc]initWithFrame:CGRectMake(0, dataArray.count*50 , 320, 251)];    [self.tableView addSubview:footView];    //監視資料數組    [self addObserver:self forKeyPath:@"dataArray" options:NSKeyValueObservingOptionNew context:nil];}#pragma mark - Table view data source- (float)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{    return TABLE_CELL_HIGHT;}- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{    return 1;}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{    return dataArray.count;}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{    static NSString *inditifierCell = @"Cell";    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:inditifierCell];    if (cell == nil) {        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:inditifierCell];    }    cell.textLabel.text = [dataArray objectAtIndex:indexPath.row];        return cell;}- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{    NSMutableArray *new = [[NSMutableArray alloc]initWithArray:dataArray];    [new addObject:@"張三"];    self.dataArray  = new;    [footView refreshStateNomal];    self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0);    }#pragma mark - kvo//用於監聽dataArray數組來設定footview的位置- (void) observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context{    NSLog(@"%d",dataArray.count);    NSMutableArray *mutableArray = [change objectForKey:@"new"];    footView.frame = CGRectMake(0,TABLE_CELL_HIGHT* mutableArray.count, 320, 251);    [self.tableView reloadData];}#pragma mark - Scroller//當scroller滑動時調用- (void) scrollViewDidScroll:(UIScrollView *)scrollView{    if (footView.refreshState == RefreshStateNomal&& scrollView.contentOffset.y > scrollView.contentSize.height - scrollView.frame.size.height + 70) {        [footView refreshStateRelsease];    }}//當滑動結束時調用- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{    if (footView.refreshState == RefreshStateRelease) {        [UIView beginAnimations:nil context:nil];        self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 70, 0);        [footView refreshStateLoading];        [UIView commitAnimations];    }}@end

在table中處理一些事件：

為了測試添加資料後footview的位置是否會跟著變動，當點擊cell的時候會添加一個資料；

為了測試載入完成後第二次拖拽是否頁面還能夠完成，當點擊cell的時候foottview會停止；

下載代碼：http://download.csdn.net/detail/u010123208/8036577

ios-上拉載入更多的介面