澳门永利m5900cc

澳门永利m5900cc

  • 民营银行成长记:步入发展关键年 差异化将成突破口 2019-04-20
  • 中国技术助力马来西亚推广移动支付(组图) 2019-04-20
  • 隋末二傻子宇文化及,不堪回首的往事 2019-04-20
  • 大众冯思翰:做最国际化的中国主机厂 依靠三大支柱扩大领先优势 2019-04-20
  • 北京:住建委约谈多家房产中介网站 2019-04-20
  • 暑假到了,您的孩子“减负”了吗? 2019-04-20
  • 加强旅游安全建设 各环节都须系紧“安全带” 2019-04-20
  • 人民日报网上中国:废旧车回收拷问各方智慧 2019-04-20
  • 两岸交流30周年纪念大会在香港举行 2019-04-19
  • 这辆车,五年来抢救了百余名危重新生儿,但还是不能满足市民需要 2019-04-19
  • 体验乡村古宅成为江西婺源旅游新宠 2019-04-19
  • 陈数罕见晒一家三口照 继子长相帅气 2019-04-19
  • 男子驾车遇巨型驼鹿在绿化带散步 体型庞大如史前巨兽 2019-04-19
  • 新华网思客会 ● 中国经济的下一程 2019-04-19
  • 人民日报客户端宣传页 2019-04-19
  • 登录 立即注册
    金钱:

    澳门永利m5900cc

    JPLiquidLayout 简单易用的流式布局

    [复制链接]
    来自: Rogue24 分类: iOS精品源码 上传时间: 2018-8-16 14:23:26
    Tag:

    项目介绍:

    JPLiquidLayout

    简介

    澳门永利m5900cc www.alfanarrealestate.com 流式布局:按顺序排列,元素宽高比保持不变,每行高度相同并且不超过最大列数。
    GitHub地址:https://github.com/Rogue24/JPLiquidLayout

    功能介绍:
        1. 多种参数可自定义化;
        2. 包含ViewModel和CollectionViewLaout两种形式的使用;
        3. CollectionViewLaout形式下包含单个元素的增、删、改动画效果
        4. 简单易用;
    
    注意:
        1. 目前仅支持垂直方向
        2. CollectionViewLaout形式下目前仅支持单个section的情况;
        3. CollectionViewLaout形式下的动画效果目前仅支持单个元素的。
    
    • 画面展示:

    image

    • 相册照片应用:

    image

    如何使用

    一. ViewModel形式

    1. viewModel得遵守JPLiquidLayoutProtocol协议(用于记录元素的位置信息,如frame);

    2. 然后使用JPLiquidLayoutTool计算所有元素的位置;

    3. collectionView需要使用UICollectionViewFlowLayout布局,并且需要在"- (CGSize)collectionView:layout:sizeForItemAtIndexPath:"返回viewMdeol中计算好的的cellSize。

    // 在UICollectionViewDelegateFlowLayout的代理方法中返回viewModel的cellSize
    - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
        JPCollectionViewCellViewModel *cellVM = self.cellVMs[indexPath.item];\
        return cellVM.jp_itemFrame.size;
    }

    二. JPLiquidLayout形式

    1. JPLiquidLayout是继承于UICollectionViewFlowLayout的布局类,使用JPLiquidLayout作为collectionView的collectionViewLayout;

    2. 不需要JPLiquidLayoutTool进行计算,内部已进行计算。

    // 初始化配置
    - (instancetype)initWithCollectionViewLayout:(UICollectionViewLayout *)layout {
        if (self = [super initWithCollectionViewLayout:layout]) {
            if ([layout isKindOfClass:JPLiquidLayout.class]) {
                JPLiquidLayout *liquidLayout = (JPLiquidLayout *)layout;
    
                // 配置基本参数
                liquidLayout.sectionInset = UIEdgeInsetsMake(8, 8, 8, 8);
                liquidLayout.minimumLineSpacing = 2;
                liquidLayout.minimumInteritemSpacing = 2;
    
                // 配置其他参数
                liquidLayout.maxCol = 4;
                liquidLayout.maxWidth = [UIScreen mainScreen].bounds.size.width - liquidLayout.sectionInset.left - liquidLayout.sectionInset.right;
                liquidLayout.baseHeight = liquidLayout.maxWidth * 0.5;
                liquidLayout.itemMaxWhScale = 16.0 / 9.0;
    
                // 配置回调block,用于获取相应的图片宽高比
                __weak typeof(self) weakSelf = self;
                liquidLayout.itemWhScale = ^CGFloat(NSIndexPath *indexPath) {
                    __strong typeof(weakSelf) strongSelf = weakSelf;
                    if (!strongSelf || strongSelf.picModels.count == 0) return 1;
                        return [strongSelf.picModels[indexPath.item] picWhScale];
                };
            }
            self.picModels = [NSMutableArray array];
        }
        return self;
    }

    ViewModel形式和JPLiquidLayout形式的对比

    • ViewModel形式:图片数量很多时(例如相册照片有几千张的情况下)使用ViewModel形式效果更优,JPLiquidLayout形式会有些许卡顿(后续优化),每次数据发生变化都需要使用JPLiquidLayoutTool进行计算更新布局

    • JPLiquidLayout形式:代码会更简洁,只需要配置好参数后续不需要别的操作

    增、删、改三种动画效果

    • 使用ViewModel形式使用系统自带的方法即可

    • 使用JPLiquidLayout形式,则需要设置singleAnimated属性为YES(默认就为YES),同样使用系统自带的方法即可

    • 目前只支持单个元素的增删改动画,后续添加多个组合的动画和挪动动画

    1. 增(demo中为点击添加)

    [self.collectionView insertItemsAtIndexPaths:@[indexPath]];

    image

    1. 删(demo中为点击删除)

    [self.collectionView deleteItemsAtIndexPaths:@[indexPath]];

    image

    1. 改(demo中为点击替换)

    [self.collectionView reloadItemsAtIndexPaths:@[indexPath]];

    image

    安装

    JPLiquidLayout 可通过CocoaPods安装,只需添加下面一行到你的podfile:

    pod 'JPLiquidLayout'

    反馈地址

    邮箱:zhoujianping24@hotmail.com

    博客:https://www.jianshu.com/u/2edfbadd451c

    相关源码推荐:

    我来说两句
    *滑动验证:
    所有评论(5)
    bug是啥 2018-8-20 10:30:00
    支持,感谢,祝code4app越来越好~
    回复
    Wsdtg 2018-8-20 10:30:08
    code4app好的内容真的很多~赞
    回复
    A7472 2018-8-20 10:30:13
    小弟学习了~支持,支持
    回复
    Yf8546 2018-8-20 10:30:35
    膜拜大神~
    回复
    码农创新者 2018-8-20 10:30:45
    不错不错,楼主辛苦了。。。
    回复
    android小哥 2018-8-20 10:30:56
    感谢分享,code4app有你更精彩
    回复
    青丝萦剑舞 2018-8-20 10:34:31
    楼主威武啊,澳门永利m5900cc有你更给力!
    回复
    code4app热心网友 2018-8-20 11:58:24
    楼主用心了,内容非常精彩。
    回复
    code4app热心网友 2018-8-20 12:33:27
    精华内容,楼主V5!
    回复
    提取码:  下载次数:6 状态:已购或VIP 售价:0(原价:15)金钱 下载权限:初级码农 
    244 0 6
    联系我们
    首页/微信公众账号投稿

    帖子代码编辑/版权问题

    QQ:435399051,742864542

    如何获得代码达人称号?

    代码贡献英雄榜
    用户名 下载数
    通过邮件订阅最新 澳门永利m5900cc 信息
    上一条 /4 下一条
    联系我们
    关闭
    合作电话:
    13802416937
    Email:
    435399051@qq.com
    商务市场合作/投稿
    问题反馈及帮助
    联系我们

    广告投放| Github|申请友链|手机版|澳门永利m5900cc ( 粤ICP备15117877号-1 )

    快速回复 澳门永利m5900cc 返回列表