I have a horizontal scrolling collectionView that I need to modify from dequeuing 1 type of cell, to two types of cell with two different fixed widths (both have the same height but one has a greater width).
I've modified my dataSource to dequeue two types of cells based on a check for the value of a certain property in our model (isLongDuration). currently the BigCell class does not have a different size and only has a different background color (black) than the RegularCell class and I can see that the right cells are being dequeued in the right places.
Here is a screenshot with the current state of the collectionView, the black cells will eventually be the wider ones
(N.B. Although the screenShot shows the cells alternating at a regular interval, there is no pattern, the cell being dequeue is based solely on the value of IsLongDuration for that particular item in the array. Also, pay no attention to the vertical red line as it is simply a static view that defines the middle of the collectionView)
In early testing I have observed that giving the BigCell a greater width breaks the collectionView.
I've yet to find any online resource that deals with adjusting a UICompositionalLayout based on which cell is being dequeued from the datasource.
Listed bellow is my dataSource and CompositionalLayout code
Does anyone have any experience with such an issue?? Thanks! :)
private func configureDataSource() {
dataSource = UICollectionViewDiffableDataSource<Int, MediaItem>(
collectionView: collectionView) { [unowned self] collectionView, indexPath, media in
guard !media.isLongDuration else {
let cell = collectionView.dequeueReusableCell(
withReuseIdentifier: String(describing: BigCell.self),
for: indexPath
) as! BigCell
}
let cell = collectionView.dequeueReusableCell(
withReuseIdentifier: String(describing: RegularCell.self),
for: indexPath
) as! RegularCell
return configuredCellInTimeline(
collectionView,
for: cell,
at: indexPath,
with: media
)
}
var snapshot = NSDiffableDataSourceSnapshot<Int, MediaItem>()
snapshot.appendSections([0])
dataSource.apply(snapshot, animatingDifferences: false)
}
private lazy var collectionViewLayout: UICollectionViewLayout = {
let configuration = UICollectionViewCompositionalLayoutConfiguration()
configuration.scrollDirection = .horizontal
let layout = UICollectionViewCompositionalLayout(
sectionProvider: { sectionIndex, environment -> NSCollectionLayoutSection? in
let itemSize = NSCollectionLayoutSize(widthDimension: .absolute(95),
heightDimension: .absolute(170))
let item = NSCollectionLayoutItem(layoutSize: itemSize)
let groupSize = NSCollectionLayoutSize(widthDimension: .absolute(100),
heightDimension: .absolute(100))
let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,
subitems: [item])
let section = NSCollectionLayoutSection(group: group)
return section
},
configuration: configuration
)
return layout
}()