两个联动的TableView

作者: qazws | 来源:发表于2017-02-14 11:18 被阅读150次

    有的软件有联动效果,两个tableview左右可以联动,上下也可以联动,这是怎么做到的呐。
    先看效果图

    ![Simulator Screen Shot 2017年2月14日 上午11.06.36.png](http:https://img.haomeiwen.com/i715050/76ff5988df6044e3.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

    代码结构

    屏幕快照 2017-02-14 上午11.14.40.png

    头部是headView,分别加在两个tableview的头上面
    左右两边分别是两个tableview,这是毫无疑问的,但是右侧的tableview要加在scrollview上,根据scrollview的偏移来改变。

    @property(nonatomic,strong)UITableView *leftTbView;//左边的TableView
    @property(nonatomic,strong)UITableView *rightTbView;//右边的TableView
    @property(nonatomic,strong)UIScrollView *bottomScrollView;//底层ScrollView
    

    有一点需要注意的就是右侧的tableview的坐标和底部scrollview的坐标,因为rightTbView可以藏到leftTbView下面,所以rightTbView的坐标是从0开始的,但是bottomScrollView 的坐标却是从leftTbView的右侧开始的

    -(void)initRightTbView{
        _rightTbView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, (6*100+7), kScreenHeight-64) style:UITableViewStylePlain];
        _rightTbView.delegate = self;
        _rightTbView.dataSource = self;
        _rightTbView.showsVerticalScrollIndicator = NO;
        _rightTbView.backgroundColor = [UIColor clearColor];
        _rightTbView.separatorStyle = UITableViewCellSelectionStyleNone;
        _rightTbView.allowsSelection = NO;
    
        
        _bottomScrollView = [[UIScrollView alloc]init];
        _bottomScrollView.contentSize = CGSizeMake(_rightTbView.frame.size.width, 0);
        _bottomScrollView.backgroundColor = [UIColor whiteColor];
        _bottomScrollView.bounces = NO;
        _bottomScrollView.showsHorizontalScrollIndicator = NO;
        _bottomScrollView.backgroundColor = [UIColor clearColor];
        [_bottomScrollView addSubview:_rightTbView];
        [_mainView addSubview:_bottomScrollView];
        _bottomScrollView.frame = CGRectMake(102, 0,_mainView.frame.size.width , kScreenHeight);
    }
    

    制造假的数据源

     for (NSInteger i=0; i<80; i++) {
            GradeModel *model = [[GradeModel alloc] init];
            model.totalScore = [NSString stringWithFormat:@"%ld分",740-i*4];
            model.chineseScore = [NSString stringWithFormat:@"%ld分",142-i];
            model.mathScore = [NSString stringWithFormat:@"%ld分",150-i];
            model.englishScore = [NSString stringWithFormat:@"%ld分",148-i];
            model.comprehensiveScore = [NSString stringWithFormat:@"%ld分",300-i];
            [self.dataArr addObject:model];
        }
    

    tableview的代理方法

     (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
        if(tableView == _leftTbView){
            return 1;
        }else{
            return 1;
        }
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
        if(tableView == _leftTbView){
            return _dataArr.count;
        }else{
            return _dataArr.count;
        }
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
        return 0.1;
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
        return 36;
    }
    
    - (nullable UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
        if(tableView == _leftTbView){
            LeftHeadView *tHView = [[LeftHeadView alloc]init];
            return tHView;
        }else{
            RightHeadView *tHView = [[RightHeadView alloc]init];
            return tHView;
        }
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
        if(tableView == _leftTbView){
            return kLabelHeight + kMenuLineWidth*2;
        }else{
            return kLabelHeight + kMenuLineWidth*2;
        }
    }
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
        if(tableView == _leftTbView){
            static NSString *strCell = @"LeftCell";
            UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:strCell];
            if(!cell){
                cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:strCell];
            }
            cell.backgroundColor = HexRGB(0xEAEAEA);
            cell.textLabel.text = [NSString stringWithFormat:@"第%ld名",indexPath.row];
            return cell;
        }else{
            static NSString *strCell = @"RightCell";
            RightCell *cell = [tableView dequeueReusableCellWithIdentifier:strCell];
            if(!cell){
                cell = [[RightCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:strCell];
            }
            [cell configModel:self.dataArr[indexPath.row]];
            return cell;
        }
    }
    
    
    - (void)tableView:(UITableView *)tableView didHighlightRowAtIndexPath:(NSIndexPath *)indexPath{
        [_leftTbView selectRowAtIndexPath:indexPath animated:NO scrollPosition:UITableViewScrollPositionNone];
        [_rightTbView selectRowAtIndexPath:indexPath animated:NO scrollPosition:UITableViewScrollPositionNone];
    }
    
    

    联动的实现

    直接上代码

    #pragma mark - 两个tableView联动
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView
    {
        if (scrollView == _leftTbView) {
            [self tableView:_rightTbView scrollFollowTheOther:_leftTbView];
        }else{
            [self tableView:_leftTbView scrollFollowTheOther:_rightTbView];
        }
    }
    
    - (void)tableView:(UITableView *)tableView scrollFollowTheOther:(UITableView *)other{
        CGFloat offsetY= other.contentOffset.y;
        CGPoint offset=tableView.contentOffset;
        offset.y=offsetY;
        tableView.contentOffset=offset;
    }
    

    代码传送门

    相关文章

      网友评论

        本文标题:两个联动的TableView

        本文链接:https://www.haomeiwen.com/subject/kqjxwttx.html