UIScrollView 回顾

在最美的年龄，为最初的梦想，尽最大的努力！

做iOS开发有段时间了，后来因为公司的要求，转了前端的开发，回过头来再温习iOS有了不同的感触，写文章还是第一次，希望通过简书来记录一个菜鸟程序员的成长。

UIScrollVIew 知识总结

• scrollView 常用属性

//监控目前滚动的位置
CGPoint contentOffSet
//滚动范围的大小
CGSize contentSize
//视图在scrollView中的位置
UIEdgeInsets contentInset
//设置协议
id<UIScrollerViewDelegate>delegate
//控制控件遇到边框是否反弹
BOOL bounces
//控制垂直方向遇到边框是否反弹
BOOL alwaysBounceVertical
//控制水平方向遇到边框是否反弹
BOOL alwaysBounceHorizontal
//控制控件是否整页翻动
BOOL pagingEnabled
//控制控件是否能滚动
BOOL scrollEnabled
//控制是否显示水平方向的滚动条
BOOL showsHorizontalScrollIndicator
//控制是否显示垂直方向的滚动条
BOOLshowsVerticalScrollIndicator
//指定滚动条在scrollerView中的位置
UIEdgeInsets scrollIndicatorInsets
//设定滚动条的样式
UIScrollViewIndicatorStyleindicatorStyle
//缩小的最小比例
float minimumZoomScale
//放大的最大比例
float maximumZoomScale
//设置变化比例
float zoomScale
//控制缩放的时候是否会反弹
BOOL bouncesZoom
//判断控件的大小是否正在改变
BOOL zooming
//控制控件滚动到顶部 
BOOL scrollsToTop

• scrollView 常用代理方法

//滑动时触发
- (void)scrollViewDidScroll:(UIScrollView *)scrollView; 
//捏合时触发                          
- (void)scrollViewDidZoom:(UIScrollView *)scrollView 
//将要开始拽动时触发
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;
//将要结束拖拽时触发
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView 
//已经结束拖拽时
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView 
//拖拽结束会有个惯性减速过程，这个过程即将开始时触发
- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView;  
//惯性结束时
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;
//非人为托转，代码控制scroll滑动动画结束时触发
- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView; 
//返回一个可以进行捏合的view  (必须是scroll的子控件)
- (nullable UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;  
//将要开始进行捏合操作事触发
- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(nullable UIView *)view 
//结束捏合时触发
- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(nullable UIView *)view atScale:(CGFloat)scale; 
//是否可以滑到顶部
- (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView;  
//滑动到顶部时
- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView;   

UIScrollVIew 实现轮播图

想想以前面试官问你怎么写轮播图，我还很装逼的说5123451思路制造假象实现跳转轮播，现在想想，真是 too young too simple，于是我自己试着封装了一个利用三个UIImageVIew 思路 进行无限轮播

实现思路：默认加载三张UIImageView，无论怎么滑动永远显示中间那张，每次滑动先渲染图片在切换scrollView的contentOffSet到中间，造成无限循环的假象

• 核心代码

首先渲染三张图片 最后一张 第一张 第二张，渲染后让scrollView滑到中间图片位置，然后向右滑动 到第二张的位置 渲染三张图片为 第一张 第二张 第三张， 然后让scrollVIew滑动到中间第二张的位置，依次类推，造成循环的假象！

#pragma mark  更新图片 渲染
//渲染图片的方法
- (void)updateImage{
    //始终让中间的图片显示
    //图片变换顺序后 设置scrollView contentOffset 显示中间
    for (int i = 0; i < COUNT; i++) {
        ZZHImageView * imageView = self.scrollView.subviews[i];
        NSInteger index = self.pageControl.currentPage;
        if(i == 0){ 
            index --;
        }else if (i == 2){
            index++;
        }
        if (index < 0) {
            //第一张的前一张是最后一张
            index = self.imageArr.count - 1;
        } else if (index >= self.imageArr.count) {
            //最后一张的的后一张是第一张
            index = 0;
        }
        //把index赋给imageView  起到媒介作用， 后面拿到tag 就是pageControl的index
        imageView.tag = index;
        imageView.image = [UIImage imageNamed:self.imageArr[index]];
    }
//跳转到中间图片位置
    self.scrollView.contentOffset = CGPointMake(self.scrollView.frame.size.width, 0);
}

在scrollViewDidScroll方法中获取滑动结束后停留在最中间位置的UIImageView， 就是当前显示的图片。

#pragma mark - UIScrollviewDelegate
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    //找到位于最中间的imageView;
    //scroll滚动时 判断三个图片的x与scrollView的contentOffset的x 的绝对值最小的就是即将停在最中间的imageView
    NSInteger page = 0;
    CGFloat minDistance = MAXFLOAT;
    for (int i = 0; i<COUNT; i++) {
        ZZHImageView *imageView = self.scrollView.subviews[i];
        CGFloat distance = ABS(imageView.frame.origin.x - scrollView.contentOffset.x);
        if (distance < minDistance) {
            minDistance = distance;
            //拿到中间位置的tag 设置 pageControl 的currentPage
            page = imageView.tag;
        }
    }
//当前是第几张图片
    self.pageControl.currentPage = page;
}
//手动拖拽结束后重新渲染
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    [self updateImage];
}
//定时器 动画结束后重新渲染
- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView
{
    [self updateImage];
}

Demo地址( https://github.com/heiheiLqq/ZZHBannerDemo )

UIScrollVIew 实现相册图片放大缩小功能

通常我们看到的类似相册捏合放大缩小图片的功能也是用scrollView做的

• 一个简单的例子

//在scrollView中添加一个UIImageView
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"我是图片"]];
[self.scrollview addSubview:imageView];
 self.imageView = imageView;
//设置捏合的形变最大值最小值
self.scrollview.maximumZoomScale = 2.0;
self.scrollview.minimumZoomScale = 0.2;

//在代理方法设置进行可以进行捏合的控件，必须是scrollView的子控件
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return self.imageView;
}
//用户捏合过程中会走一下的代理方法
- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
  //被捏合控件的形变值
  NSLog(@"缩放ing-----%f", scrollView.zoomScale);
  //图片缩小放大的时候图片不会居中，在该方法中设置图片中心点
  self.imageView.center=self.scrollview.center
}

UIScrollView无法滚动的解决办法

• 没有设置contentSize
• scrollEnabled = NO
• 没有接收到触摸事件:userInteractionEnabled = NO

这波总结先到这作为程序员我还是个小白，其实最常用的UITableView和UICollectionView ，准备接下来两天在自己总结下，第一次在简书上写文章，希望像记笔记一样记录一下自己的成长，希望大家多多支持！