Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UICollectionView Horizontal Scroll with Horizontal Alignment

I would like to have a paged UICollectionView, with each page displaying cells from left to right. What I can achieve now with classic UICollectionViewFlowLayout and

layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;

The result is the following :

      page 1             page 2
 cell 1 | cell 3 || cell 5 | cell 7
 cell 2 | cell 4 || cell 6 | cell 8

What I would like to achieve now is:

      page 1             page 2
 cell 1 | cell 2 || cell 5 | cell 6
 cell 3 | cell 4 || cell 7 | cell 8

I would like to know if there is simpler solution than creating my own flow controller ? Or if not, is there some place where I can see the source code for UICollectionViewFlowLayout which is not so different of what I want ?

like image 224
PhilippeAuriach Avatar asked Sep 21 '14 21:09

PhilippeAuriach


People also ask

How to make uicollectionview scroll horizontally?

You need to reduce the height of UICollectionView to its cell / item height and select " Horizontal " from the " Scroll Direction " as seen in the screenshot below. Then it will scroll horizontally depending on the numberOfItems you have returned in its datasource implementation. Show activity on this post.

How to scroll only one direction in UIViewController?

Tick on ‘Scrolling Enabled’ and if you want to scroll only in one direction each time tick on ‘Direction Lock Enabled’. Otherwise, you could scroll in both directions at the same time. 4. Finally, open the Connections Inspector and connect the UICollectionView referencing outlet to your UIViewController.

How to create horizontalpaginationdemo using uicollectionview?

So moving ahead and let's create a new project name HorizontalPaginationDemo. Open default Main.Storyboard, there is default view controller in Interface Builder (IB), add UICollectionView with top, left, right and height to 0,0,0 and 200 respectively. There is a default UICollectionViewCell present in the collection view.

How to set the number of items in a scroll view?

In the scroll view add the a collection view. Then add to it a width constraint, check in code how many items you have and set its constant to the correct value, e.g. (self.view.frame.size.width * numOfScreens).


1 Answers

I finally made my own layout subclassing UICollectionViewFlowLayout : I replace each cell's collectionViewAttributes with the corresponding one if it was a classic collectionViewFlowLayout, using a little bit of maths.

It now fits my needs, and could be useful for someone else, so here is my code: https://github.com/philippeauriach/fullyhorizontalcollectionview

like image 171
PhilippeAuriach Avatar answered Oct 19 '22 02:10

PhilippeAuriach