UITableView优化技巧5

上篇我们讲到了tableView是继承自scrollView，假如cell中有比较多的图片需要通过网络加载，这时候我们可以利用scrollView的代理来进行网络请求的时机选择从而减小网络开销和性能损耗。这是看了一篇关于UIScrollView 实践经验后得到的启发。
首先我们得了解scrollView的几个常用的代理方法。为了方便理解，特地把方法进行排序，滑动时调用顺序从上到下

//在手指开始滑动的时候进行调用，在滑动过程中可以多次调用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;

//只要产生偏移量，就会调用这个方法，并且不分代码和手势
- (void)scrollViewDidScroll:(UIScrollView *)scrollView;

//即将结束拖动的时候调用
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset;

//手指结束拖动的时候调用，在滑动过程中可以多次调用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;

//手指离开屏幕后，在didEndDragging后调用
- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView;

如下图

4D7CABDF-A844-42B4-BB74-B3CA8586E993.png

在iOS5以后，scrollView多了一个代理方法- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset。
这个方法能够在你手手指拖动结束的时候计算出tableView的contentOffset，注意这里的contentOff是一个指针，这意味我们可以修改这个值，从而设定最终偏移量使滑动看起来更顺畅，呃，跑遍了，目前暂时不会用到修改这个指针。我们拿到这个contentOffset后，就可以得到滑动结束后的可视矩形visibleRect的范围。
另外，这时候调用tableViewCell- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath方法时，假如cell中图片需要网络请求，这时候我们可以先暂时不请求图片，只需要把imageView的大小确定（通过服务器传回来的imageSize）。然后根据CGRect targetRect = CGRectMake(targetContentOffset->x, targetContentOffset->y, scrollView.frame.size.width, scrollView.frame.size.height);获取到滑动目的地的targetRect。这时候代码如下：

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset
{
  //  NSLog(@"%s",__func__);
    CGRect targetRect = CGRectMake(targetContentOffset->x, targetContentOffset->y, scrollView.frame.size.width, scrollView.frame.size.height);
    self.targetRect = [NSValue valueWithCGRect:targetRect];
}

在- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView这个方法中我们先将self.targetRect设为nil，这时候我们可以根据tableView的visibleCells获取到当前屏幕中正在显示的cell，然后先进行判断后在进行网络请求，那么如何判断呢？1.先判断需要显示图片的imageView是否存在与modelArray[indexPath.row]相同的sd_imageURL，这是为了排除cell重用的弊端。2.然后判断targetRect是否与当前可视的cell的frame有交集，可以利用CGRectIntersectsRect(CGRect rect1, CGRect rect2)进行判断，假如没有交集，不需要进行图片的网络加载。

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{

//    NSLog(@"%s",__func__);
    self.targetRect = nil;
    [self loadVisibleCell];
}

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset
{
  //  NSLog(@"%s",__func__);
    CGRect targetRect = CGRectMake(targetContentOffset->x, targetContentOffset->y, scrollView.frame.size.width, scrollView.frame.size.height);
    self.targetRect = [NSValue valueWithCGRect:targetRect];
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
  //  NSLog(@"%s",__func__);
    self.targetRect = nil;
    [self loadVisibleCell];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *cellIdentifier = @"ImageCell";
    HYImageCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier forIndexPath:indexPath];
//这里可以对非图片的控件进行直接显示，只是把图片用下面的方法进行加载就行
    [self configureCell:cell withIndexPath:indexPath];

    return cell;
}

- (void)configureCell:(HYImageCell *)cell withIndexPath:(NSIndexPath *)indexPath{
    Model *model = _modelArray[indexPath.row];
    NSURL *targetURL = [NSURL URLWithString:model.hoverURL];

    NSLog(@" 111---  %@ ---111",cell.photoView.sd_imageURL );

        BOOL shouldLoadImage = YES;

   // 根据targetRect的值来判断是否加载图片
   //targetRect什么时候有值呢？看前面的代理方法，在willEndDragging的时候我们获得了targetRect的frame然后在DidEndDecelerating里我们又清空了targetRect的值
   //targetRect有值 && 当前显示的cell与targetRect不相交，所以不用进行网络请求
   //targetRect没值就进行图片加载
   //因此无论各种手指操作，都能得到想要的效果--快速滑动的时候中间是空白的，只有与targetRect相交的cell图片才会被显示出来
          if (self.targetRect && !CGRectIntersectsRect([self.targetRect CGRectValue], cellFrame)){
          shouldLoadImage = NO;
  }
           if (shouldLoadImage) {   
           //图片加载

       }


}

原文链接：http://www.jianshu.com/p/d849759316f8