美文网首页程序猿阵线联盟-汇总各类技术干货
看着像电影选票,一个Excel表格样式的东西

看着像电影选票,一个Excel表格样式的东西

作者: 隔壁班小明 | 来源:发表于2017-11-24 10:29 被阅读36次

想这个标题想了两分钟也不知道怎么描述,先这样吧。词穷的我还是发个效果的GIF吧~


selectRoom.gif

就是这样的一个东西。左侧和选择的那个可以联系纵向滚动,上面可以和选择的那个横向联系滚动。
主要说一下是怎么实现的。
首先上面和左面都是用scrollerView实现的中间的那个是有个scrollerView的背景和上面放了一个很大的不会滑动的collectionView(滑动靠scrollerView)。
因为collectionView只能纵向或者横向排列。所以上面和左面两个scrollerView的上面的数据一定要有一个是确定长度的,我这个左侧时间是确定的,所以我的collectionView是横向扩展的。
先创建上面和左面两个scrollerView;之后创建中间的,中间的长等于上面的长,中间的高等于左面的高。里面的item也要对应上。这样页面就做出来了。下一步就是让他们联动。
关于让他们联动我的做法非常简单。就是计算当前scrollerView的偏移量。当上面滚动时让中间的x偏移量等于上面的x偏移;当左面滚动中让中间的y偏移量等于左面的y偏移量。当中间滚动时就让上面,左面的偏移量等于中间的。这样是不是很简单。这里中间是可以斜着滚动的,因为我们安卓的原因,我有控制了让它不能斜着滚动,所以上面的例子是没有斜着滚动的。下面就贴一下scrollerView代理里面的代码。

///_topView上面的scrollView;_leftView左面的scrollView;_mainBgView中间的scrollView;_oldMainBgViewOffset上次滑动停止时_mainBgView的偏移量
//====UIScrollViewDelegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    ///判断是哪个scrollView在滚动,把其他的代理先关上不然会冲突
    if (scrollView == _topView) {
        _mainBgView.delegate = nil;
        _mainBgView.contentOffset = CGPointMake(_topView.contentOffset.x, _mainBgView.contentOffset.y);
    }
    if (scrollView == _leftView) {
        _mainBgView.delegate = nil;
         _mainBgView.contentOffset = CGPointMake(_mainBgView.contentOffset.x, _leftView.contentOffset.y);
    }
    if (scrollView == _mainBgView) {
        CGFloat offx = _mainBgView.contentOffset.x - _oldMainBgViewOffset.x;
        CGFloat offy = _mainBgView.contentOffset.y - _oldMainBgViewOffset.y;
        if (fabs(offx) > fabs(offy)) {//让它不能斜着滑动
            _mainBgView.contentOffset = CGPointMake(_mainBgView.contentOffset.x, _oldMainBgViewOffset.y);
            _topView.delegate = nil;
            _topView.contentOffset = CGPointMake(_mainBgView.contentOffset.x, 0);
        }else{
            _mainBgView.contentOffset = CGPointMake(_oldMainBgViewOffset.x, _mainBgView.contentOffset.y);
            _leftView.delegate = nil;
            _leftView.contentOffset = CGPointMake(0, _mainBgView.contentOffset.y);
        }
    }
}

-(void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView{
    ///轻扫手势是先不让别的能响应
    if (scrollView == _topView) {
        _mainBgView.userInteractionEnabled = NO;
    }
    if (scrollView == _leftView) {
        _mainBgView.userInteractionEnabled = NO;
    }
    if (scrollView == _mainBgView) {
        _topView.userInteractionEnabled = NO;
        _leftView.userInteractionEnabled = NO;
    }
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    ///轻扫手势结束把代理打开,把用户响应打开记录中间scrollView当前停止时的偏移量
    _mainBgView.delegate = self;
    _topView.delegate = self;
    _leftView.delegate = self;
    _mainBgView.userInteractionEnabled = YES;
    _topView.userInteractionEnabled = YES;
    _leftView.userInteractionEnabled = YES;
    _oldMainBgViewOffset = _mainBgView.contentOffset;
}

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset{
    ///轻扫手势结束把代理打开,记录中间scrollView当前停止时的偏移量
    _mainBgView.delegate = self;
    _topView.delegate = self;
    _leftView.delegate = self;
    _oldMainBgViewOffset = _mainBgView.contentOffset;
}

还有一点我把三个scrollView的减速点都设置成了10.这样轻扫手势的减速效果好,嗯我是这样认为的。
就这样了,有什么问题都可以直接和我说。。

相关文章

网友评论

    本文标题:看着像电影选票,一个Excel表格样式的东西

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