How to add Load more cell in UICollectionView? - ios

Question

I want to add load more cell in UICollectionview ? can anyone tell me how can i add load button ? i have created collectionview that works fine but i want to add Load more button in bottom of collection view cell like this
Here's my collection view
#pragma mark <UICollectionViewDataSource>
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
return 3;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
switch (section) {
case 0: return 66;
case 1: return 123;
}
return 31;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
NSUInteger row = [indexPath row];
NSUInteger count = [self.stockImages count];
if (row == count) {
//Add load more cell
}
DemoCellView *cell = [collectionView dequeueReusableCellWithReuseIdentifier:[DemoCellView reuseIdentifier] forIndexPath:indexPath];
// Configure the cell
cell.titleLabel.text = [NSString stringWithFormat:#"%ld", (long)indexPath.item + 1];
NSLog(#"%#", self.stockImages[indexPath.item % self.stockImages.count]);
cell.imageView.image = self.stockImages[indexPath.item % self.stockImages.count];
return cell;
}
#pragma mark <DemoLayoutDelegate>
- (void) collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
// Do something
// Insert new cell after clicking load more data
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout: (UICollectionViewLayout *)collectionViewLayout heightForHeaderInSection:(NSInteger)section {
return kFMHeaderFooterHeight;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout heightForFooterInSection:(NSInteger)section {
return kFMHeaderFooterHeight;
}

Answer 1

You can Add a footer
- (UICollectionReusableView *)collectionView:(JSQMessagesCollectionView *)collectionView
viewForSupplementaryElementOfKind:(NSString *)kind
atIndexPath:(NSIndexPath *)indexPath
{
if ([kind isEqualToString:UICollectionElementKindSectionFooter]) {
//load your footer you have registered earlier for load more
[super dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter
withReuseIdentifier:#“load more footer”
forIndexPath:indexPath];
}
return nil;
}

Answer 2

In your cellForItemAtIndexPath method you can check this:
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
ImageCollectionViewCell *cellImage;
AddMoreCollectionViewCell *addMoreCell;
if(indexPath.row < [_dataSource numberOfItems]){
cellImage = [collectionView dequeueReusableCellWithReuseIdentifier:ImageCollectionCellIdentifier
forIndexPath:indexPath];
[cellImage configureForMediaViewModel:[_dataSource mediaViewModelForItemIndex:indexPath.row] delegate:self];
return cellImage;
}else{
addMoreCell = [collectionView dequeueReusableCellWithReuseIdentifier:AddMoreCollectionCellIdentifier
forIndexPath:indexPath];
addMoreCell.delegate = self;
return addMoreCell;
}
}
where ImageCollectionViewCell is the main kind of cells and AddMoreCollectionViewCell is a cell with a plus ('+') symbol and other stuff.
With this method, AddMoreCollectionViewCell always add at end of your collection view.
Hope it helps!