简书详情滚动效果

研究了老半天，早上醒来吹了一会电风扇突然顿悟，不过不知道是不是和简书的思路一样的。

代码其实非常简单

只需要一个tableView和webView

创建WebView

UIWebView *webView = [[UIWebView alloc] init];
webView.frame = self.view.bounds;
webView.delegate = self;
webView.scrollView.delegate = self;

创建tableView

UITableView *tableView = [[UITableView alloc] init];
tableView.delegate = self;
tableView.dataSource = self;
tableView.tableHeaderView = webView;
tableView.bounces = NO;
tableView.scrollEnabled = NO;
tableView.frame = CGRectMake(0, 0, viewWidth, viewHeight);
[self.view addSubview:tableView];
self.tableView = tableView;

由于webView在顶部一开始有弹簧收缩效果。tableView在底部，一开始是不需要的，所以暂时禁用tableView的bounces和scrollEnabled。不能一开始就可以让tableView滚动，不然就GG了.

监听滚动条的变化

然后就是各种判断是否要禁用scrollEnabled和设置bounces的NO/YES了
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGFloat top = scrollView.contentOffset.y;
if ([scrollView isKindOfClass:[UITableView class]]) {
if (top > (_tableView.contentSize.height - viewHeight - 100)) {
_tableView.bounces = YES;
}else{
_tableView.bounces = NO;
}
}else if(scrollView == _webView.scrollView){
if (top > 30) {
_tableView.bounces = NO;
_webView.scrollView.bounces = NO;
if (top >= _webView.scrollView.contentSize.height - viewHeight - 100) {
_tableView.bounces = YES;
_tableView.scrollEnabled = YES;
}
}else{
_tableView.bounces = NO;
_webView.scrollView.bounces = NO;
_tableView.scrollEnabled = NO;
if (top < 30) {
_webView.scrollView.bounces = YES;
}
}
}
}

demo

https://github.com/ryanypm/demoScrollView