DeyaEldeen DeyaEldeen - 4 months ago 40
iOS Question

How to make a tableview snap to cells centers ? (with gif animation illustration)

The thing I want to achieve is a gallery, it can contain up to 300 images, using a

UIScrollView
will result in non optimized ram/cpu usage since it doesn't do pooling (correct me if I'm wrong), and it has a limitation on width, I can't make it 300 times the width of the screen (again correct me if I'm wrong).

so the right choice would be to use a
UITableView


1 - how to make it scroll horizontally like in this gif ?

2 - how to make it snap to cells centers ?

gif

EDIT

I'm using this, it gives the result I want but it has a problem, it has no tolerance for how much I should swipe to move to the next cell, I still need help..

func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool)
{
// Find collectionview cell nearest to the center of collectionView
// Arbitrarily start with the last cell (as a default)
var closestCell : UICollectionViewCell = collectionView.visibleCells()[0];
for cell in collectionView!.visibleCells() as [UICollectionViewCell]
{
let closestCellDelta = abs(closestCell.center.x - collectionView.bounds.size.width/2.0)
let cellDelta = abs(cell.center.x - collectionView.bounds.size.width/2.0)
if (cellDelta < closestCellDelta)
{
closestCell = cell
}
}
let indexPath = collectionView.indexPathForCell(closestCell)
collectionView.scrollToItemAtIndexPath(indexPath!, atScrollPosition: UICollectionViewScrollPosition.CenteredHorizontally, animated: true)
}

func scrollViewWillBeginDecelerating(scrollView: UIScrollView)
{
// Find collectionview cell nearest to the center of collectionView
// Arbitrarily start with the last cell (as a default)
var closestCell : UICollectionViewCell = collectionView.visibleCells()[0];
for cell in collectionView!.visibleCells() as [UICollectionViewCell]
{
let closestCellDelta = abs(closestCell.center.x - collectionView.bounds.size.width/2.0)
let cellDelta = abs(cell.center.x - collectionView.bounds.size.width/2.0)
if (cellDelta < closestCellDelta)
{
closestCell = cell
}
}
let indexPath = collectionView.indexPathForCell(closestCell)
collectionView.scrollToItemAtIndexPath(indexPath!, atScrollPosition: UICollectionViewScrollPosition.CenteredHorizontally, animated: true)
}

Answer

You should use UICollectionView with one cell or UIPageViewController to achieve this kind of effect. There is no way to use tableview horizontally. Somehow you can say UICollectionView as a horizontal representation of UITableView. UIPageViewcontroller is also good solution. You should read about both in detail and then decide what's more suitable for you!

and yes that's not good to use single scroll view with that much different size. It can create memory or performance issue!!

Update :

Have you tried to enable paging in your collection view's scroll view ?

look at screenshot below

enter image description here

Check the checkbox paging enable!

then after If you not feel smooth effect then you should try to uncheck adjust scroll view insets under viewcontroller under attribute inspector which you got by selecting your view controller

check the screenshot for that

enter image description here


EDIT by person who asked the question : -

adding this worked for me, as UICollectionView don't have adjust scroll view insets option.

layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0

Comments