Odtnhj

I am creating a UICollectionView that has paging enabled and scrolls from left to right. I am using an NSFetchedResultsController to retrieve results from CoreData, which means it uses collection view sections rather than rows. The collection view has 2 rows and therefore appears like the following screenshot (where the order goes top row, bottom row, top row, bottom row etc):

However, I need the collection view to read from left to right like the following 2 screen shots:

Could you please advise on how I would do this in Swift?

First, I think it could help if you provide an example how your cells are sectioned currently (e.g. section 0: a, b, c, d, section 1: e, f, ...) and how you want the different sections to be displayed/layouted.

I'd suggest to create a custom UICollectionViewLayout subclass.

In the prepareLayout method you should calculate and cache the UICollectionViewLayoutAttributes for each cell.

Create variables:

let xOffset = 0.0 // leftContentInset within collectionView.bounds
let yOffsetRow0 = 0.0 // y offset of first row within collectionView.bounds
let yOffsetRow1 = 50.0 // y offset of second row within collectionView.bounds
var currentXOffset : CGFloat = xOffset
var currentPage : Int = 0

1. calculate the frames until first row is filled to right screen edge (CGRect(currentXOffset, yOffsetRow0, cellWidth, cellHeight), increase currentXOffset)


2. reset currentXOffset = xOffset
   


3. repeat 1. with yOffsetRow1 for second row


4. increment currentPage += 1
   


5. reset currentXOffset = xOffset + (collectionView.frame.width * currentPage) // for next page


6. repeat steps 1-5 until layout for all cells is calculated

As you said, you need
1. Paging enabled
2. Scrolling from left to right
3. Multiple sections.

It's a little bit confusing what exactly you want to design. It will be much better if can share proper UI screenshot.

As I understand your problem.

let layout = UICollectionViewFlowLayout()
 layout.scrollDirection = .horizontal
 let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)

Check have you assign the horizontal layout to your collectionView.

What I would do is this:

1) Sort your data the same way you do it now so that your collection view would look like this:

---------
|0|2|4|6|
---------
|1|3|5|7|
---------

2) In your cellForIndexPath method of your collection view data source return the correct element so that your collection view turns into this:

---------
|0|1|2|3|
---------
|4|5|6|7|
---------

To do that you can use this logic:

public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
 var elementIndex: Int!
 if indexPath.row % 2 == 0 
 // 0 / 2 = 0
 // 2 / 2 = 1
 // 4 / 2 = 2, etc
 elementIndex = indexPath.row / 2
 
 else 
 // (1 / 2) + round(8.0 / 2.0) = 4
 // (3 / 2) + round(8.0 / 2.0) = 5
 // (5 / 2) + round(8.0 / 2.0) = 6, etc
 elementIndex = (indexPath.row / 2) + Int(round(Double(elements.count) / 2.0))
 

 // Dequeue your cell
 // let cell = ...

 cell.element = elements[elementIndex]
 return cell

Basically this should return your elements in the correct order.