EtsyCompositionalLayoutBridge
allows you to intermix UICollectionViewCompositionalLayout
and UICollectionViewFlowLayout
!
It's perfect if you want to introduce UICollectionViewCompositionalLayout
into your existing UICollectionViewFlowLayout
based UICollectionView
without having to rewrite everything. Being able to mix concepts between the two collection view layout paradigms allows you to leverage both the simplistic ('it just works') UICollectionViewFlowLayout
and the complex yet flexible UICollectionViewCompositionalLayout
simultaneously. This allows for brand new possibilities on UICollectionView
!
For any given UICollectionView
section's header, footer or items: you can choose to use either a UICollectionViewCompositionalLayout
or UICollectionViewFlowLayout
based layout. EtsyCompositionalLayoutBridge
uses a UICollectionViewCompositionalLayout
at its core allowing you to leverage all the layout has to offer, such as custom supplementary items and more!
Xcode 11+, iOS 13+.
EtsyCompositionalLayoutBridge is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod 'EtsyCompositionalLayoutBridge', '~> 1.0'
Add the following to your Cartfile:
github "etsy/EtsyCompositionalLayoutBridge" ~> 1.0
If you use Carthage to build your dependencies, make sure you have added EtsyCompositionalLayoutBridge.framework
to "Linked Frameworks and Libraries" of the appropriate target and include the framework in the Carthage framework copying building phase. Note: if you have an M1 powered Mac, please note that you may have issues using Carthage as a dependency manager.
- In Xcode, navigate to File -> Swift Packages -> Add Package Dependency
- Paste the repository URL (https://www.github.com/etsy/EtsyCompositionalLayoutBridge), press next.
- Under 'Rules', select 'Branch' and set to 'main'.
- Click Finish
-
Create an
EtsyCompositionalLayoutBridge
instance using the initializerEtsyCompositionalLayoutBridge(collectionView:flowLayout:delegate:dataSource:flowLayoutDelegate:)
. -
Implement the
EtsyCompositionalLayoutBridgeDelegate
protocol ondelegate
passed into the initializer above.-
The
EtsyCompositionalLayoutBridgeDelegate.compositionalLayoutBridge(_:shouldUseFlowLayoutFor:)
delegate method allows you to return aBool
that determines whether or not the bridge will useUICollectionViewFlowLayout
behavior for a specific section of the collection view. -
The
EtsyCompositionalLayoutBridgeDelegate.compositionalLayoutBridge(_:layoutSectionFor:environment:)
delegate method allows you to provide anNSCollectionLayoutSection
for sections in the collection view you returnedfalse
for in thecompositionalLayoutBridge(_:shouldUseFlowLayoutFor:)
delegate method.
-
-
Set
collectionView.collectionViewLayout
to.layout()
on theEtsyCompositionalLayoutBridge
instance you created in step 1.
The provided demo app contains an example of EtsyCompositionalLayoutBridge
in action, please see: Example/EtsyCompositionalLayoutBridge/DemoViewController.swift
. In the example, we also show you how you can mix and match UICollectionViewFlowLayout
and UICollectionViewCompositionalLayout
.