UIRefreshControl使用總結

    UIRefreshControl 的使用仍是比較簡單的，看一下 UIRefreshControl 的定義，基本就知道怎麼用了。

    UIRefreshControl 是專門爲 UITableViewController 設計的，官方不建議在非 UITableViewController 中使用。

    本文主要解決兩個問題：一是在非 UITableViewController 中使用，二是修改菊花顯示位置。

一、UITableViewController + UIRefreshControl

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
    [refreshControl addTarget:self action:@selector(refresh:) forControlEvents:UIControlEventValueChanged];
    self.refreshControl = refreshControl;
}

- (void)refresh:(UIRefreshControl *)refreshControl
{
    NSLog(@"start refresh");
    [self performSelector:@selector(endRefresh:) withObject:refreshControl afterDelay:2.0f];
}

- (void)endRefresh:(UIRefreshControl *)refreshControl
{
    [refreshControl endRefreshing];
    NSLog(@"end refresh");
}

二、UIViewController + UITableView（UIScrollView） + UIRefreshControl

@interface TableViewDemo () <UITableViewDataSource, UITableViewDelegate>

@property (nonatomic, weak) IBOutlet UITableView *tableView;

@end

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
    [refreshControl addTarget:self action:@selector(refresh:) forControlEvents:UIControlEventValueChanged];
    [self.tableView addSubview:refreshControl];
}

- (void)refresh:(UIRefreshControl *)refreshControl
{
    NSLog(@"start refresh");
    [self performSelector:@selector(endRefresh:) withObject:refreshControl afterDelay:2.0f];
}

- (void)endRefresh:(UIRefreshControl *)refreshControl
{
    [refreshControl endRefreshing];
    NSLog(@"end refresh");
}

    直接集成上去，這時候你會發現下拉的時候，頁面會跳動一下（將UITableView 換成 UIScrollView 也會有一樣的問題）。

    既然 UIRefreshControl 是由 UITableViewController 控制的，那就讓 UITableViewController 來控制，修改代碼以下：

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UITableViewController *tableVC = [[UITableViewController alloc] init];
    tableVC.tableView = self.tableView;
    
    UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
    [refreshControl addTarget:self action:@selector(refresh:) forControlEvents:UIControlEventValueChanged];
    tableVC.refreshControl = refreshControl;
}

    修改以後，從新運行，這時內容跳動的問題沒有了。

    參考：http://stackoverflow.com/questions/12497940/uirefreshcontrol-without-uitableviewcontroller/

    對於 UIScrollView，目前沒有找到更好的解決方案，若是確實要使用的話，那就用只有一個Cell的UITableView來代替 UIScrollView。參考：http://segmentfault.com/q/1010000001823169

三、修改 UIRefreshControl 顯示的位置

    菊花默認位置是在中間，總有那麼一些奇葩需求，須要將菊花顯示在其餘位置。目前發現了兩種方式修改顯示位置，可是整體來講本質原理應該是同樣的。

    方案一：修改 UIRefreshControl 的 bounds，從而修改其顯示位置，代碼以下：

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
    [refreshControl addTarget:self action:@selector(refresh:) forControlEvents:UIControlEventValueChanged];
    self.refreshControl = refreshControl;
    
    CGRect bounds = refreshControl.bounds;
    bounds.origin.x = 50;//左移 50
//    rect.origin.x = -50;//右移 50
    bounds.origin.y = 10;//上移 10;
//    rect.origin.y = -10;//下移 10;
    refreshControl.bounds = bounds;
}

    方案二：用一個 UIView（refreshControlContainerView） 來顯示 UIRefreshControl，經過修改 refreshControlContainerView.frame 來修改菊花的顯示位置，代碼以下： 

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
    [refreshControl addTarget:self action:@selector(refresh:) forControlEvents:UIControlEventValueChanged];
    self.refreshControl = refreshControl;
    
    UIView *refreshControlContainerView = [[UIView alloc] initWithFrame:CGRectMake(-50, -10, [UIScreen mainScreen].bounds.size.width, 44.0f)];
    [self.tableView addSubview:refreshControlContainerView];
    [refreshControlContainerView addSubview:self.refreshControl];
}

四、一個我的主頁的實例

    實例代碼，請看 UserHomeViewController。

五、總結

    UIRefreshControl 只適用於一些簡單、與特殊的頁面，只能實現「下拉刷新」，不能實現「上拉加載更多」。

    這裏對於「下拉刷新」與「上拉加載更多」推薦使用 MJRefresh ，用法簡單。

項目源代碼：https://git.oschina.net/cavintang/refresh-control-demo.git