The offset of grid view(UICollectionView) shift gradually with paging scroll - ios

Question

I'm creating Grid View with UICollectionView and want to scroll it by paging.
Now I have a problem. The offset of grid gradually shift by paging scroll.
I want to fit the left top of next page cell to that of screen.
My code is like below,
ViewController.m
- (void)loadView
{
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
layout.scrollDirection = UICollectionViewScrollDirectionVertical;
self.view = [[GridView alloc] initWithLayout:layout];
}
- (void)viewDidLoad
{
[super viewDidLoad];
self.navigationController.navigationBarHidden = YES;
}
- (BOOL)prefersStatusBarHidden
{
return YES;
}
GridView.m
#define GRID_SPACE (20)
- (id)initWithLayout:(UICollectionViewFlowLayout *)layout
{
self = [super initWithFrame:CGRectZero collectionViewLayout:layout];
if (self) {
self.pagingEnabled = YES;
self.backgroundColor = UIColor.redColor;
self.delegate = self;
self.dataSource = self;
[self registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([UICollectionViewCell class])];
}
return self;
}
#pragma mark -
#pragma mark UICollectionViewDelegate
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
CGSize selfSize = self.frame.size;
return CGSizeMake( (selfSize.width - GRID_SPACE) / 2, (selfSize.height - GRID_SPACE) / 2 );
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
return GRID_SPACE;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
return GRID_SPACE;
}
I'd appreciate if you would provide me a good solution.
Thank you.

Answer 1

The page size of an UIScrollView (which UICollectionView inherits from) is the size of it's viewport, so to make it work you need to include the height of the red border at the top. If you don't want to show the border at top or bottom, then you can let the UICollectionView stretch under another element or under the top of the display if it is aligned at the top.

Answer 2

LGP's answer resolved my problem. Resolved code I added to my GridView.m is below,
Add the length of grid item to the height of CollectionView, because the theight is the length of Paging Scroll.
And more, you need to set the length of grid item as bottom of CollectionView insets.
In GridView.m
- (void)layoutSubviews
{
[super layoutSubviews];
CGSize parentSize = self.superview.frame.size;
self.frame = CGRectMake(0, 0, parentSize.width, parentSize.height + GRID_SPACE);
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
return UIEdgeInsetsMake(0, 0, GRID_SPACE, 0);
}