zoukankan      html  css  js  c++  java
  • UICollectionView


    UICollectionView的使用

    自定义流水布局

     

    1.1 collectionView和tableView

    • 区别:布局(collectionView需要自己手动布局,而tableView不需要,系统会自动帮我们布局)
    • 共同点:循环利用(定义一个重用标识就可以实现循环利用)

     

    1.2 添加collectionView

    • 注意点:
      • 初始化必须要传入布局(流水布局:九宫格布局)
      • UICollectionViewCell必须注册
      • 必须自定义cell
    • 步骤:创建流水布局;创建UICollectionView;设置数据源

    • 效果图:

    • 分析:这并不能满足我们的需求,我们需要展示图片数据,所以我们必须自定义cell,因为里面的图片格式都是一样的,可以使用xib描述.

     

    1.3方法的抽取

    • 为了简化代码,使得代码简单明了,我们就把方法进行了抽取
    • 方式一:

    • 方式二:

    1.4自定义流水布局

    • 思路:照片浏览布局:流水布局,在拖动的时候,在原来的基础上重新计算下布局->在原来功能上再添加功能,自定义流水布局.
    • 自定义类:重写方法,达到一些效果
    • 复杂效果:分析 - > 解决:cell离中心点的距离越近就越大,越远就越小
    • 自定义布局,重写5个方法:
    // 什么时候调用:一开始布局就会调用,UICollectionView刷新的时候也会调用
    // 作用:计算所有的cell布局,条件:cell布局固定
    - (void)prepareLayout{
        [super prepareLayout]; 
    }
    
    // 作用:返回每个cell布局,
    // 给定一个区域,就返回这个区域内所有cell布局
    // 允许一次性返回所有cell布局
    - (nullable NSArray<__kindof UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect{
    
        //获取显示区域
        CGRect visiableRect = self.collectionView.bounds;
        //获取显示区域内的cell布局
       NSArray *attributes =  [super layoutAttributesForElementsInRect:visiableRect];
        
        //计算collectionView的偏移量x
        CGFloat offSetX = self.collectionView.contentOffset.x;
        //遍历cell布局
        for (UICollectionViewLayoutAttributes *attr in attributes) {
          //计算一下离中心的距离
            CGFloat delta = fabs(attr.center.x - offSetX - kscreenW * 0.5);
            //计算缩放比例 1 ~ 0.5
            CGFloat scale = 1 - delta / (kscreenW * 0.5) * 0.5;
            //缩放变换
            attr.transform = CGAffineTransformMakeScale(scale, scale);
        };
        return attributes;
    }
    
    // Invalidate:刷新
    // 是否允许在拖动的时候刷新布局
    // 谨慎使用,YES:只要一滚动就会布局
    - (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds {
        return YES;   
    }
    
    // 什么时候调用:手动拖动UICollectionView,当手指离开的时候,就会调用
    // 作用:返回UICollectionView最终的偏移量
    // proposedContentOffset:最终的偏移量
    - (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity 
    {
        //获取显示区域
        CGRect visiableRect = CGRectMake(proposedContentOffset.x, 0, self.collectionView.bounds.size.width, MAXFLOAT);
        
        //获取显示区域的cell布局
        NSArray *attributes = [super layoutAttributesForElementsInRect:visiableRect];
        //遍历cell布局,判断离center最近的cell
        CGFloat minDelta = MAXFLOAT;
        for (UICollectionViewLayoutAttributes *attr in attributes) {
            //计算离中心点的距离
            CGFloat delta = attr.center.x - proposedContentOffset.x - kscreenW * 0.5;
            //计算最小的距离
            if (fabs(delta) < fabs(minDelta)) {
                minDelta = delta;
            }        
        };
        //因为我们是从右往左滑动
        proposedContentOffset.x += minDelta;
        
        //考虑到小于0的情况的处理
        if (proposedContentOffset.x < 0) {
            proposedContentOffset.x = 0;
        }
        
        return proposedContentOffset;
    }
    
    // 设置collectionView滚动范围
    - (CGSize)collectionViewContentSize {
        return [super collectionViewContentSize];  
    }
    • UICollectionView滚动范围不需要手动管理,布局会自动计算.UITableView滚动范围也不需要手动管理,自动根据内容计算.
  • 相关阅读:
    php 验证码
    扫描登录
    正则表达式
    liunx 搭建svn
    jq
    spl_autoload_register()函数
    php函数操作文件
    配置nginx支持TP框架
    Object-c 访问控制
    Obiective
  • 原文地址:https://www.cnblogs.com/zhoudaquan/p/5135490.html
Copyright © 2011-2022 走看看