{"id":13637838,"url":"https://github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout","last_synced_at":"2025-04-19T17:32:00.928Z","repository":{"id":35051833,"uuid":"200871003","full_name":"kishikawakatsumi/IBPCollectionViewCompositionalLayout","owner":"kishikawakatsumi","description":"Backport of UICollectionViewCompositionalLayout to earlier iOS 12","archived":false,"fork":false,"pushed_at":"2022-04-25T18:42:31.000Z","size":11271,"stargazers_count":1527,"open_issues_count":33,"forks_count":143,"subscribers_count":29,"default_branch":"master","last_synced_at":"2024-05-02T00:31:04.293Z","etag":null,"topics":["backport","compositional-layouts","uicollectionviewlayout","uikit"],"latest_commit_sha":null,"homepage":null,"language":"Swift","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/kishikawakatsumi.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}},"created_at":"2019-08-06T14:46:26.000Z","updated_at":"2024-04-29T11:43:47.000Z","dependencies_parsed_at":"2022-08-08T04:15:25.965Z","dependency_job_id":null,"html_url":"https://github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout","commit_stats":null,"previous_names":[],"tags_count":26,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kishikawakatsumi%2FIBPCollectionViewCompositionalLayout","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kishikawakatsumi%2FIBPCollectionViewCompositionalLayout/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kishikawakatsumi%2FIBPCollectionViewCompositionalLayout/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kishikawakatsumi%2FIBPCollectionViewCompositionalLayout/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kishikawakatsumi","download_url":"https://codeload.github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223377717,"owners_count":17135788,"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":["backport","compositional-layouts","uicollectionviewlayout","uikit"],"created_at":"2024-08-02T01:00:35.056Z","updated_at":"2024-11-09T08:30:22.580Z","avatar_url":"https://github.com/kishikawakatsumi.png","language":"Swift","funding_links":[],"categories":["Content"],"sub_categories":["Layout"],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://user-images.githubusercontent.com/40610/62582481-9055a980-b8e7-11e9-8c37-3a37035d8209.png\"  style=\"width: 600px;\" width=\"600\" /\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://developer.apple.com/swift\"\u003e\u003cimg alt=\"Languages\" src=\"https://img.shields.io/badge/language-objective--c%20%7C%20swift-78909C.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout/releases/latest\"\u003e\u003cimg alt=\"Release\" src=\"https://img.shields.io/github/release/kishikawakatsumi/IBPCollectionViewCompositionalLayout.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://cocoapods.org/pods/IBPCollectionViewCompositionalLayout\"\u003e\u003cimg alt=\"CocoaPods\" src=\"https://img.shields.io/cocoapods/v/IBPCollectionViewCompositionalLayout.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/Carthage/Carthage\"\u003e\u003cimg alt=\"Carthage\" src=\"https://img.shields.io/badge/carthage-compatible-yellow.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://swift.org/package-manager/\"\u003e\u003cimg src=\"https://img.shields.io/badge/SPM-ready-orange.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout/blob/master/LICENSE\"\u003e\u003cimg alt=\"MIT License\" src=\"http://img.shields.io/badge/license-MIT-blue.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://app.bitrise.io/app/c67d276c5028828b#/builds\"\u003e\u003cimg alt=\"Bitrise\" src=\"https://app.bitrise.io/app/c67d276c5028828b/status.svg?token=HeF4Pq3WkA8WUQ_rNhmE7Q\u0026branch=master\"/\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n----------------\n\n## IBPCollectionViewCompositionalLayout\n\nBackport of UICollectionViewCompositionalLayout to earlier iOS 12.\n\nA new [UICollectionViewCompositionalLayout](https://developer.apple.com/documentation/uikit/views_and_controls/collection_views/using_collection_view_compositional_layouts_and_diffable_data_sources) class has been added to UIKit to make it incredibly easier to create custom complex collection view layout.\nYou can use new excellent APIs immediately without maintaining two different code bases until iOS 13 would be widely adopted.\n\n_Note: that this library is still currently under active development. Please file all bugs, issues, and suggestions as an Issue in the GitHub repository._\n\n### What is Collection View Compositional Layouts?\n\nAt the WWDC 2019, Apple introduced a new form of UICollectionViewLayout. A new [UICollectionViewCompositionalLayout](https://developer.apple.com/documentation/uikit/views_and_controls/collection_views/using_collection_view_compositional_layouts_and_diffable_data_sources) class has been added to UIKit to make it easier to create compositional layouts without requiring a custom UICollectionViewLayout.\n\nIn iOS 12 and earlier, we need subclassing of `UICollectionViewLayout` to do that. We have to override lots of methods correctly, and it is error-prone.\n\nWith Collection View Compositional Layouts, you can make very complex layout even nested collection views with independently scrolling sections just within few lines of code.\n\nSee also:\n\n- [Advances in Collection View Layout - WWDC 2019](https://developer.apple.com/videos/play/wwdc2019/215/)\n- [Using CollectionView Compositional Layouts in Swift 5](https://dev.to/kevinmaarek/using-collectionview-compositional-layouts-in-swift-5-1nan)\n- [Move your cells left to right, up and down on iOS 13](https://medium.com/shopback-engineering/move-your-cells-left-to-right-up-and-down-on-ios-13-part-1-1a5e010f48f9)\n\n### Screenshots\n\n|Nested Group|Orthogonal Scroll|Orthogonal Scroll|\n|:-:|:-:|:-:|\n|![screenshot](https://user-images.githubusercontent.com/40610/62560784-c29be280-b8b8-11e9-970f-d939b2713f93.gif)|![screenshot](https://user-images.githubusercontent.com/40610/62560308-bb280980-b8b7-11e9-9bfe-c93ee1caef78.gif)|![screenshot](https://user-images.githubusercontent.com/40610/62560791-c596d300-b8b8-11e9-9c9a-4543a5a466cd.gif)|\n\n|List|Grid|Inset Grid|Column|\n|:-:|:-:|:-:|:-:|\n|![screenshot](https://user-images.githubusercontent.com/40610/62560843-de06ed80-b8b8-11e9-96b1-3a1da6e9bd58.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560851-e2330b00-b8b8-11e9-96f0-455aaa032931.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560886-f24aea80-b8b8-11e9-9756-4919f078a7f2.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560882-ef4ffa00-b8b8-11e9-8f33-5c090434492c.png)|\n\n|Distinct Sections|Badges|Nested Groups|\n|:-:|:-:|:-:|\n|![screenshot](https://user-images.githubusercontent.com/40610/62560897-f545db00-b8b8-11e9-9574-55466d8ef81b.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560903-f7a83500-b8b8-11e9-8766-5273db0817a8.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560909-fa0a8f00-b8b8-11e9-8749-3d93e2295fdd.png)|\n\n|Mosaic|Tile Grid|Banner Tile Grid|Portlait Tile Grid|\n|:-:|:-:|:-:|:-:|\n|![screenshot](https://user-images.githubusercontent.com/40610/62560914-fd057f80-b8b8-11e9-9899-8b430802941b.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560917-00990680-b8b9-11e9-93bb-2d36cdbb46f9.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560925-042c8d80-b8b9-11e9-8d6d-71a1290498e6.png)|![screenshot](https://user-images.githubusercontent.com/40610/62560928-068ee780-b8b9-11e9-81b1-3c9ca640c10d.png)|\n\n## Usage\n\nCopy `IBPCollectionViewCompositionalLayout/IBPCollectionViewCompositionalLayoutInteroperability.swift` file to your project.\nIt tricks the compiler to make the same code base available for iOS 13 and earlier than iOS 12.\n\nImport `IBPCollectionViewCompositionalLayout`.\n\nThen you can use Collection View Compositonal Layouts API as-is.\n\n```swift\nimport IBPCollectionViewCompositionalLayout\n\nlet itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1),\n                                     heightDimension: .fractionalHeight(1))\nlet item = NSCollectionLayoutItem(layoutSize: itemSize)\n\nlet groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1),\n                                      heightDimension: .absolute(44))\nlet group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])\n\nlet section = NSCollectionLayoutSection(group: group)\n\nlet layout = UICollectionViewCompositionalLayout(section: section)\n\nlet collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)\n...\n```\n\n### IBPCollectionViewCompositionalLayoutInteroperability.swift\n\nThis file silences the following compilation errors when building on Xcode 11 or higher environment.\n\n```\n'UICollectionViewCompositionalLayout' is only available in iOS 13.0 or newer\n```\n\n## Features\n\n- [x] Inter Item Spacing\n- [x] Inter Group Spacing  \n- [x] Inter Section Spacing  \n- [x] Fixed Spacing\n- [x] Flexible Spacing\n- [x] Nested Groups\n- [x] Vertical Scrolling\n- [x] Horizontal Scrolling\n- [x] Supplemental Views (e.g. Section Header/Footers)\n- [x] Pinned Section Header/Footers\n- [x] Decoration Views (e.g. Background Views)\n- [x] Orthogonal Scrolling\n- [x] Orthogonal Scrolling Behavior\n- [x] Estimated Size (Autosizing)\n- [x] Custom Group Item (Absolute Positions)\n- [x] Drop-in replacement\n\n## TODOs (Not yet supported)\n\n- [ ] RTL Support\n- [ ] Visual Debug Description\n- [ ] Performance Optimization\n\n## Requirements\n\n- Swift 5.0+ or Objective-C\n- iOS 10.0+\n\n## Installation\n\n### [CocoaPods](https://cocoapods.org)\n\nAdd the following to your `Podfile`:\n\n```ruby\npod 'IBPCollectionViewCompositionalLayout'\n```\n\n### [Carthage](https://github.com/Carthage/Carthage)\n\nAdd the following to your `Cartfile`:\n\n```\ngithub \"kishikawakatsumi/IBPCollectionViewCompositionalLayout\"\n```\n\n## Special Thanks\n\nThanks to [Ryo Aoyama](https://github.com/ra1028), the author of [DiffableDataSources](https://github.com/ra1028/DiffableDataSources). A backport library of Diffable Data Sources. It is used in the sample code.\n\nThanks to [Astemir Eleev](https://github.com/jVirus). Most of the sample code are borrowed from his [uicollectionview-layouts-kit](https://github.com/jVirus/uicollectionview-layouts-kit).\n\n## Author\n[Kishikawa Katsumi](https://github.com/kishikawakatsumi)\n\n## Licence\nThe project is available under [MIT Licence](https://github.com/kishikawakatsumi/IBPCollectionViewCompositionalLayout/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkishikawakatsumi%2FIBPCollectionViewCompositionalLayout","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkishikawakatsumi%2FIBPCollectionViewCompositionalLayout","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkishikawakatsumi%2FIBPCollectionViewCompositionalLayout/lists"}