其实很简单核心就是UITableViewDelegate的三个代理方法,这里我只把实现的核心代码放出来
先说明下界面的布局,我将两个tableView放在同一个VC下的,_categoryTableView
是左侧分类table列表
_contentTableView
是右侧的内容tableView,具体布局如下图:
核心代码:
1、点击categoryTableView时使 contentTableView滑动到对应位置
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
if (tableView == _categoryTableView) {
NSIndexPath *scrollIndexPath = [NSIndexPath indexPathForRow:0 inSection:indexPath.row];
//这里用_currentSection标记当前contentTableView的section,用以在后面判断是滑动到了哪个section
_currentSection = indexPath.row;
[_contentTableView scrollToRowAtIndexPath:scrollIndexPath atScrollPosition:UITableViewScrollPositionTop animated:YES];
return;
}
}
2、通过检测contentTableView的sectionHeaderView的显示与消失来控制categoryTableView的显示
- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section{
if (tableView.isDragging || tableView.decelerating) {
//这里判断是否是交互拖动很重要,用以解决当用户点击左侧categoryTableView 使右侧 contentTableView滑动时导致左侧categoryTableViewCell重复被调用点击方法而导致的categoryTableViewCell显示UI闪动的问题(文字表述起来不好理解,把判断取消了再看就知道我说的是什么了)
if (section < _currentSection) {
_currentSection = section;
NSIndexPath *scrollIndexPath = [NSIndexPath indexPathForRow:_currentSection inSection:0];
[_categoryTableView selectRowAtIndexPath:scrollIndexPath animated:YES scrollPosition:UITableViewScrollPositionMiddle];
}
}
}
- (void)tableView:(UITableView *)tableView didEndDisplayingHeaderView:(UIView *)view forSection:(NSInteger)section{
if (tableView.isDragging) {
if (section == _currentSection && section < _dataSource.count - 1) {
_currentSection = section + 1;
NSIndexPath *scrollIndexPath = [NSIndexPath indexPathForRow:_currentSection inSection:0];
[_categoryTableView selectRowAtIndexPath:scrollIndexPath animated:YES scrollPosition:UITableViewScrollPositionMiddle];
}
}
}
自己和美团饿了么等外卖APP对比了下,单就两个tableView联动上基本和那些外卖APP没有差别了
网友评论