UIScrollView自动滚动到屏幕中间

UIScrollView通过设置contentSize,能够将总宽度超过屏幕的UIButton控件,放在屏幕中同一行的位置.从提高用户体验的角度,应该在用户点击某个按钮时,将按钮放在屏幕中间的位置,方便点击其他按钮,最终效果如下:

scrollerToCenter.gif

屏幕默认显示6个按钮.选中按钮时,当按钮中心距离屏幕左边的距离(D1)大于UIScrollView宽度(W)的一半时,重新设置UIScrollView的contentOffset的x为D1-W*0.5;小于W的一半时, 设置contentOffset的x为0.右边的设置和左边的类似.实现代码如下:

- (void)selectedBtn: (UIButton *)btn {
    if (selectIndex >= BaseTag_btn) {
        UIButton *oldSelectedBtn = [self viewWithTag: selectIndex];
        oldSelectedBtn.selected = false;
    }
    btn.selected = true;
    selectIndex =  btn.tag;
    
    [UIView animateWithDuration:0.25 animations:^{
        self.lineV.frame = CGRectMake(btn.frame.origin.x, self.frame.size.height - _lineHeight, (ScreenSize.width - 2 * _margin) / 6, _lineHeight);
        CGFloat offSetX = btn.center.x - self.bounds.size.width * 0.5 + _margin;
        CGFloat offsetX1 = (self.contentSize.width - btn.center.x) - self.bounds.size.width * 0.5 + _margin;
        if (offSetX > 0 && offsetX1 > 0) {
            self.contentOffset = CGPointMake(offSetX, 0);
        }else if(offSetX < 0){
            self.contentOffset = CGPointMake(0, 0);
        }else if (offsetX1 < 0){
            self.contentOffset = CGPointMake(self.contentSize.width - self.bounds.size.width - _margin, 0);
        }
    }];
}

为了优化交互,可以将UIScrollView的scrollEnable属性设置为No.

详细实现请参看
Demo

关注和喜欢都是对我的鼓励和支持~