{"id":13696887,"url":"https://github.com/czl0325/ZLCollectionView","last_synced_at":"2025-05-03T17:32:34.773Z","repository":{"id":37632448,"uuid":"95192918","full_name":"czl0325/ZLCollectionView","owner":"czl0325","description":"为应对类似淘宝首页，京东首页，国美首页等复杂布局而写的Collectionview。基于UICollectionView实现，目前支持标签布局，列布局，百分比布局，定位布局，填充式布局，瀑布流布局等。支持纵向布局和横向布局，可以根据不同的section设置不同的布局，支持拖动cell，头部悬浮，设置section背景色和自定义section背景view，向自定义背景view传递自定义方法。功能强大，超过Android的recyclerview，实现了电影选座等高难度的布局。","archived":false,"fork":false,"pushed_at":"2023-05-09T02:46:51.000Z","size":15865,"stargazers_count":1161,"open_issues_count":14,"forks_count":166,"subscribers_count":14,"default_branch":"master","last_synced_at":"2024-11-05T03:51:35.364Z","etag":null,"topics":["collectionview","collectionviewcell","collectionviewflowlayout","layout"],"latest_commit_sha":null,"homepage":"","language":"Objective-C","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/czl0325.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2017-06-23T07:04:18.000Z","updated_at":"2024-10-16T02:25:30.000Z","dependencies_parsed_at":"2024-04-19T10:31:25.738Z","dependency_job_id":null,"html_url":"https://github.com/czl0325/ZLCollectionView","commit_stats":{"total_commits":127,"total_committers":4,"mean_commits":31.75,"dds":0.2362204724409449,"last_synced_commit":"9f2fbfb555a6d51b7cffb4f83a17d18a7471e333"},"previous_names":[],"tags_count":52,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/czl0325%2FZLCollectionView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/czl0325%2FZLCollectionView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/czl0325%2FZLCollectionView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/czl0325%2FZLCollectionView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/czl0325","download_url":"https://codeload.github.com/czl0325/ZLCollectionView/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224198006,"owners_count":17271999,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["collectionview","collectionviewcell","collectionviewflowlayout","layout"],"created_at":"2024-08-02T18:00:49.157Z","updated_at":"2024-11-13T00:31:09.711Z","avatar_url":"https://github.com/czl0325.png","language":"Objective-C","funding_links":[],"categories":["UI Components","OOM-Leaks-Crash"],"sub_categories":["FlowLayout"],"readme":"# ZLCollectionView\n\n为应对类似淘宝首页，京东首页，国美首页等复杂布局而写的ZLCollectionview。基于UICollectionView实现，目前支持标签布局，列布局，百分比布局，定位布局，填充式布局，瀑布流布局等。支持纵向布局和横向布局，可以根据不同的section设置不同的布局，支持拖动cell，头部悬浮，设置section背景色和自定义section背景view，向自定义背景view传递自定义方法。实现了电影选座等高难度的布局。\u003cbr\u003e\n特别感谢[donggelaile](https://github.com/donggelaile)贡献了降低cpu占用率的代码\n\n### gif效果图\n\n\u003cimg src=\"https://github.com/czl0325/ZLCollectionView/blob/master/demo1.gif?raw=true\"/\u003e   \u003cimg src=\"https://github.com/czl0325/ZLCollectionView/blob/master/demo2.gif?raw=true\"/\u003e\n\n### 导入\n\n支持cocoapod导入，最新版本 1.4.9\n\n```\npod 'ZLCollectionViewFlowLayout' \n```\n\n### 推荐项目\n使用uitableview或者uicollectionview的朋友可以使用我的另外一个库  [ZLCellDataSource](https://github.com/czl0325/ZLCellDataSource)\u003cbr\u003e\n至少可以少写1/3的代码量，在开发界面可以快速帮你构建uitableview和uicollectionview\u003cbr\u003e\n觉得好用的朋友可以去点个star\u003cbr\u003e\n\n### 注意事项：\n版本1.0开始加入了横向布局，有升级到1.0的，原来的类ZLCollectionViewFlowLayout提示找不到，请更换成ZLCollectionViewVerticalLayout即可，其余不变。如果不想升级可用  pod 'ZLCollectionViewFlowLayout','0.8.7.1'  \u003cbr\u003e\u003cbr\u003e\n\u003cbr\u003e\n* ZLCollectionViewVerticalLayout    ====     纵向布局   \u003cbr\u003e\n* ZLCollectionViewHorzontalLayout   ====     横向布局(暂时先做了标签页布局和瀑布流，其余的后续增加)\u003cbr\u003e\n\u003cbr\u003e\n\n如果遇到以下错误，\nUnable to find a specification for `ZLCollectionViewFlowLayout`\n请使用pod update命令来安装。\n\n### 参数列表\n\n| 可配置参数               | 类型      | 作用                                                    |\n|:------------------------:|:-----------:|:--------------------------------------------------------:|\n| isFloor                | BOOL      | 宽度是否向下取整，默认为YES，该参数一般不用改                |\n| canDrag                | BOOL      | 是否允许拖动cell，默认为NO                                |\n| header_suspension      | BOOL      | 头部是否悬浮，默认为NO                                    |\n| layoutType             | ZLLayoutType      | 设置布局类型，适用于只有单一布局可省去写代理的代码     |\n| columnCount            | columnCount      | 在列布局中设置列数，适用于单一布局可省去写代理的代码 |\n| fixTop            | CGFloat      | header距离顶部的距离 |\n| columnSortType    | ZLColumnSortType | 瀑布流列排序方式，按最小高度或者按顺序 |\n\n\u003cbr\u003e\n\n| 布局名称              | 布局类型      | 作用                                                    |\n|:------------------------:|:-----------:|:--------------------------------------------------------:|\n| LabelLayout            | 标签页布局      |                 |\n| ColumnLayout                | 列布局      | 瀑布流，单行布局，等分布局                               |\n| PercentLayout      | 百分比布局      |                                 |\n| FillLayout             | 填充式布局      |      |\n| AbsoluteLayout            | 绝对定位布局      |    |\n\u003cbr\u003e\n\n| 代理方法              | 作用      | 备注                                                    |\n|:------------------------:|:-----------:|:--------------------------------------------------------:|\n| - (ZLLayoutType)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout typeOfLayout:(NSInteger)section;            | 指定是什么布局     |  如没有指定则为FillLayout(填充式布局)  |\n| - (UIColor*)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout backColorForSection:(NSInteger)section;                | 设置每个section的背景色      |       \n| - (UIImage*)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout backImageForSection:(NSInteger)section;               | 设置每个section的背景图      |                            |\n| - (NSString*)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout registerBackView:(NSInteger)section;      | 自定义每个section的背景view，      |      |\n| - (ZLBaseEventModel*)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout backgroundViewMethodForSection:(NSInteger)section;      | 向每个section自定义背景view传递自定义方法      |  需要传递的自定义view必须继承ZLCollectionBaseDecorationView类，传递的ZLBaseEventModel对象，eventName:方法名（注意带参数的方法名必须末尾加:）,parameter:参数  |\n| - (BOOL)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout attachToBottom:(NSInteger)section;            | 背景是否延伸覆盖到footerView      |   默认为NO   |\n| - (BOOL)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout attachToTop:(NSInteger)section;            | 背景是否延伸覆盖到headerView      |   默认为NO   |\n| - (NSInteger)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout zIndexOfItem:(NSIndexPath*)indexPath;            | 设置每个item的zIndex      |    默认为0|\n| - (CATransform3D)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout transformOfItem:(NSIndexPath*)indexPath;            | 设置每个item的CATransform3D      |    默认为CATransform3DIdentity|\n| - (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout *)collectionViewLayout alphaOfItem:(NSIndexPath*)indexPath;           | 设置每个item的alpha    |    默认为1|\n| - (NSInteger)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout*)collectionViewLayout columnCountOfSection:(NSInteger)section;           | 列布局中指定一行有几列    |    列布局需要的代理，默认为1|\n| - (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout*)collectionViewLayout percentOfRow:(NSIndexPath*)indexPath;          | 百分比布局中指定每个item占该行的几分之几    |    PercentLayout百分比布局需要的代理，如3.0/4，注意为大于0小于等于1的数字。不指定默认为1|\n| - (CGRect)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout*)collectionViewLayout rectOfItem:(NSIndexPath*)indexPath;          | 绝对定位布局中指定每个item的frame    |    绝对定位布局必须实现的代理。不指定默认为CGRectZero|\n| - (void)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewFlowLayout*)collectionViewLayout didMoveCell:(NSIndexPath*)atIndexPath toIndexPath:(NSIndexPath*)toIndexPath;          | 拖动cell的相关代理    |    |\n\u003cbr\u003e\n\n### 用法\n\n```Objective-C\n//在UICollectionView创建之前加入ZLCollectionViewFlowLayout\n\n- (UICollectionView*)collectionViewLabel {\n    if (!_collectionViewLabel) {\n        ZLCollectionViewFlowLayout *flowLayout = [[ZLCollectionViewFlowLayout alloc] init];\n        flowLayout.delegate = self;\n        \n        _collectionViewLabel = [[UICollectionView alloc]initWithFrame:self.view.bounds collectionViewLayout:flowLayout];\n        _collectionViewLabel.dataSource = self;\n        _collectionViewLabel.delegate = self;\n        _collectionViewLabel.backgroundColor = [UIColor whiteColor];\n        [_collectionViewLabel registerClass:[SEMyRecordLabelCell class] forCellWithReuseIdentifier:[SEMyRecordLabelCell cellIdentifier]];\n        [_collectionViewLabel registerClass:[SEMyRecordHeaderView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:[SEMyRecordHeaderView headerViewIdentifier]];\n    }\n    return _collectionViewLabel;\n}\n\n//实现代理，如果不实现也可以自己直接设置self.sectionInset，self.minimumLineSpacing，self.minimumInteritemSpacing。但是这种设置不支持不同section不同数值\n\n//指定section用的样式。LabelLayout是标签样式，ClosedLayout用于tableviewcell或者瀑布流，九宫格之类的。\n- (ZLLayoutType)collectionView:(UICollectionView *)collectionView layout:(ZLCollectionViewFlowLayout *)collectionViewLayout typeOfLayout:(NSInteger)section {\n    switch (section) {\n        case 0:\n            return LabelLayout;\n        case 1:\n        case 2:\n            return FillLayout;\n        case 3:\n        case 4:\n            return AbsoluteLayout;\n        case 5:\n        case 6:\n            return PercentLayout;\n        default:\n            return ClosedLayout;\n    }\n}\n\n//如果是ClosedLayout样式的section，必须实现该代理，指定列数\n- (NSInteger)collectionView:(UICollectionView *)collectionView layout:(ZLCollectionViewFlowLayout*)collectionViewLayout columnCountOfSection:(NSInteger)section {\n    switch (section) {\n        case 7:\n            return 4;\n        case 8:\n            return 2;\n        case 9:\n            return 1;\n        default:\n            return 0;\n    }\n}\n//如果是百分比布局必须实现该代理，设置每个item的百分比，如果没实现默认比例为1\n- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(ZLCollectionViewFlowLayout*)collectionViewLayout percentOfRow:(NSIndexPath*)indexPath; {\n    switch (indexPath.section) {\n        case 5: {\n            switch (indexPath.item) {\n                case 0:\n                    return 1.0/3;\n                case 1:\n                    return 2.0/3;\n                case 2:\n                    return 1.0/3;\n                case 3:\n                    return 1.0/3;\n                case 4:\n                    return 1.0/3;\n                case 5:\n                    return 1.0/4;\n                case 6:\n                    return 1.0/4;\n                case 7:\n                    return 1.0/2;\n                case 8:\n                    return 3.0/5;\n                case 9:\n                    return 2.0/5;\n                default:\n                    break;\n            }\n        }\n        case 6: {\n            if (indexPath.item % 2==0) {\n                return 3.0/4;\n            } else {\n                return 1.0/4;\n            }\n        }\n        default:\n            return 1;\n    }\n}\n//如果是绝对定位布局必须是否该代理，设置每个item的frame\n- (CGRect)collectionView:(UICollectionView *)collectionView layout:(ZLCollectionViewFlowLayout*)collectionViewLayout rectOfItem:(NSIndexPath*)indexPath {\n    switch (indexPath.section) {\n        case 3: {\n            CGFloat width = (collectionView.frame.size.width-200)/2;\n            CGFloat height = width;\n            switch (indexPath.item) {\n                case 0:\n                    return CGRectMake(0, 0, width, height);\n                case 1:\n                    return CGRectMake(width, 0, width, height);\n                case 2:\n                    return CGRectMake(0, height, width, height);\n                case 3:\n                    return CGRectMake(width, height, width, height);\n                case 4:\n                    return CGRectMake(width/2, height/2, width, height);\n                default:\n                    return CGRectZero;\n            }\n        }\n            break;\n        case 4: {\n            switch (indexPath.item) {\n                case 0:\n                    return CGRectMake((collectionView.frame.size.width-20)/2-100, 0, 200, 30);\n                default: {\n                    NSInteger column = (collectionView.frame.size.width-20)/30;\n                    return CGRectMake(((indexPath.item-1)%column)*30, 100+((indexPath.item-1)/column)*30, 20, 20);\n                }\n                    \n            }\n        }\n            break;\n        default:\n            return CGRectZero;\n    }\n    return CGRectZero;\n}\n```\n\n### 更新\n##### v1.4.9 (2022.03.29)\n* 增加瀑布流排列方式的字段\n\n##### v1.4.0 (2020.04.18)\n* 自定义背景view的代理方法增加\n\n##### v1.3.1 (2020.04.14)\n* 修改填充式布局的bug\n\n##### v1.3.0 (2020.03.25)\n* 增加头部偏移量设置\n\n##### v1.2.0 (2019.12.25)\n* 降低cpu的占用率\n\n##### v1.1.6 (2019.10.1)\n* 修复bug\n\n##### v1.1.0 (2019.5.13)\n* 横向布局增加绝对定位布局\n\n##### v1.0.3 (2019.5.7)\n* 修改适配swift\n\n##### v1.0.2 (2019.2.20)\n* 拆分成横向布局和纵向布局两个类，使用方法和类名有所改变\n\n##### v0.8.6 (2019.1.11)\n* 降低了头部不悬浮情况下的cpu占用率\n\n##### v0.8.2 (2018.9.26)\n* 去掉基础布局\n* 提取代理出来\n* 增加高度向下取整\n\n##### v0.7.0 (2018.8.6)\n* 增加头部可以悬浮的设置\n\n##### v0.6.2 (2018.7.26)\n* 增加拖动cell和高度自适应的测试。高度自适应需要用到第三方库\n\n##### v0.5.3 (2018.7.12)\n* 增加自定义section背景图\n\n##### v0.5 (2018.7.10)\n* 增加了可以设置每个section的背景色\n\n##### v0.4.1 (2018.7.8)\n* 修改了一些bug\n\n##### v0.3.0  (2018.3.1)\n* 新增加了绝对定位布局，自己定义每个item的位置，可以做层叠布局，电影选座布局等等，详细操作请见demo\n\n##### v0.2.0  (2018.2.27)\n* 新增加了填充式布局，详细操作请见demo\n   \n##### v0.1.1  (2018.2.26)\n* 修复百分比布局的若干bug\n\n##### v0.1.0  (2018.1.29）\n* 新增加了百分比布局，详细操作请见demo\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fczl0325%2FZLCollectionView","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fczl0325%2FZLCollectionView","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fczl0325%2FZLCollectionView/lists"}