UICollectionView (3x3 Grid) paging with static cell - ios

Question

I have a UICollectionView in a 3x3 grid layout displaying images.
The UICollectionView has "pagingEnabled" set to YES, inorder to "page" between pages with the 3x3 grid with 9 images.
This has been accomplished using a custom UICollectionViewLayout:
#implementation HorizontalCollectionViewLayout
- (instancetype)init
{
self = [super init];
if (self) {
}
return self;
}
- (CGSize)collectionViewContentSize
{
// We should return the content size. Lets do some math:
NSInteger verticalItemsCount = (NSInteger)floorf(self.collectionView.bounds.size.height / self.itemSize.height);
NSInteger horizontalItemsCount = (NSInteger)floorf(self.collectionView.bounds.size.width / self.itemSize.width);
NSInteger itemsPerPage = verticalItemsCount * horizontalItemsCount;
NSInteger numberOfItems = [self.collectionView numberOfItemsInSection:0];
NSInteger numberOfPages = (NSInteger)ceilf((CGFloat)numberOfItems / (CGFloat)itemsPerPage);
CGSize size = self.collectionView.bounds.size;
size.width = numberOfPages * self.collectionView.bounds.size.width;
return size;
}
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
return YES;
}
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
// Get all the attributes for the elements in the specified frame
NSArray *allAttributesInRect = [super layoutAttributesForElementsInRect:rect];
NSArray *attributesArray = [[NSArray alloc] initWithArray:allAttributesInRect copyItems:YES];
NSInteger verticalItemsCount = (NSInteger)floorf(self.collectionView.bounds.size.height / self.itemSize.height);
NSInteger horizontalItemsCount = (NSInteger)floorf(self.collectionView.bounds.size.width / self.itemSize.width);
NSInteger itemsPerPage = verticalItemsCount * horizontalItemsCount;
for (NSInteger i = 0; i < attributesArray.count; i++) {
UICollectionViewLayoutAttributes *attributes = attributesArray[i];
NSInteger currentPage = (NSInteger)floor((double)i / (double)itemsPerPage);
NSInteger currentRow = (NSInteger)floor((double)(i - currentPage * itemsPerPage) / (double)horizontalItemsCount);
NSInteger currentColumn = i % horizontalItemsCount;
CGRect frame = attributes.frame;
frame.origin.x = self.itemSize.width * currentColumn + currentPage * self.collectionView.bounds.size.width;
frame.origin.y = self.itemSize.height * currentRow;
CGRect f = UIEdgeInsetsInsetRect(frame, UIEdgeInsetsMake(2, 2, 5, 2));
attributes.frame = f;
}
return attributesArray;
}
#end
This is working as expected, as it creates a new page when the first page contains 9 images.
What I want to accomplish then, is to create a static / fixed "next page" button in the right bottom corner of grid at index 8, 17, 26, 35 ... based on the number of pages. (A button at index 8 if the collectionview only has 1 page, a button at index 8 and index 17 if the collectionview only has 2 pages ... and so on). Number of images and pages can vary based on how many images the user uploads to the app.
The following picture illustrates the idea:
Any tips on how I can accomplish this?
What logic should go into "collectionView:itemForIndexPath:"?

Answer 1

In your cellForItemAtIndexPath look at the indexPath.item for the number you are interested in replacing and return a collection view cell for your [ > ] button.
The way the collection view works is that you are never really concerned with the visible cells on the screen (your UICollectionViewLayout is handling that). You are only returning a cell for the indexPath you are given.
Create a dedicated UICollectionViewCell subclass just for this [ > ] cell with its own reuse identifier. It will simplify your code and you don't need to touch your current image cells.