一个UICollectionView有好多个cell,滑动一下,谁也不知道会停留在哪个cell,滑的快一点,就会多滑一段距离,反之则会滑的比较近,这正是UIScrollview用户体验好的地方。
如果想要UICollectionView停留到某个cell的位置,可以用
- (void)scrollToItemAtIndexPath:(NSIndexPath *)indexPath atScrollPosition:(UICollectionViewScrollPosition)scrollPosition animated:(BOOL)animated;
这个方法,还能用scrollPosition这个参数控制cell具体停留在上下左右中到底哪个位置。
那么问题来了:如果我只是随便滑了一下,我也不知道它会停在位于哪个indexPath的cell上,但不管它停在哪个cell上,我都希望这个cell刚好在屏幕中间,应该怎么办呢?(这个场景在coverFlow的效果里比较常见)
之前知道的做法是:
在scrollViewDidEndDecelerating或其他delegate方法里,通过当前 contentOffset 计算最近的整数页及其对应的 contentOffset,然后通过动画移动到这个位置。
但是这个做法有问题,就是动画不连贯,完全没有“刚好停到那里”的感觉。
今天在想有没有其他更好的办法时,突然发现一个之前从来没用功的方法:
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset NS_AVAILABLE_IOS(5_0);
一看这参数名,再看看这文档,真是让人喜不自禁呐!这不就是让scrollView“刚好停到某个位置”的方法嘛!!!(系统5.0就提供了,现在才看到。。。。。。)
targetContentOffset 是个指针,可以修改这个参数的值,让scrollView最终停止在目标位置。
(2016年12月7日更新)
注意:scrollView的pagingEnable属性必须为NO时这个方法才会被调用。
感谢@ ZeroOnet 评论中指出,这个方法在pagingEnable==YES的时候也会调用;
但是pagingEnable的效果会覆盖这个方法的效果,达不到我们想要的“刚好停到指定位置的效果”,所以还是需要注意将pagingEnable设置为NO!
例:
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset {
CGPoint originalTargetContentOffset = CGPointMake(targetContentOffset->x, targetContentOffset->y);
CGPoint targetCenter = CGPointMake(originalTargetContentOffset.x + CGRectGetWidth(self.collectionView.bounds)/2, CGRectGetHeight(self.collectionView.bounds) / 2);
NSIndexPath *indexPath = nil;
NSInteger i = 0;
while (indexPath == nil) {
targetCenter = CGPointMake(originalTargetContentOffset.x + CGRectGetWidth(self.collectionView.bounds)/2 + 10*i, CGRectGetHeight(self.collectionView.bounds) / 2);
indexPath = [self.collectionView indexPathForItemAtPoint:targetCenter];
i++;
}
self.selectedIndex = indexPath;
//这里用attributes比用cell要好很多,因为cell可能因为不在屏幕范围内导致cellForItemAtIndexPath返回nil
UICollectionViewLayoutAttributes *attributes = [self.collectionView.collectionViewLayout layoutAttributesForItemAtIndexPath:indexPath];
if (attributes) {
*targetContentOffset = CGPointMake(attributes.center.x - CGRectGetWidth(self.collectionView.bounds)/2, originalTargetContentOffset.y);
} else {
DLog(@"center is %@; indexPath is {%@, %@}; cell is %@",NSStringFromCGPoint(targetCenter), @(indexPath.section), @(indexPath.item), attributes);
}
CGPoint originalTargetContentOffset = CGPointMake(targetContentOffset->x, targetContentOffset->y);
CGPoint targetCenter = CGPointMake(originalTargetContentOffset.x + CGRectGetWidth(self.collectionView.bounds)/2, CGRectGetHeight(self.collectionView.bounds) / 2);
NSIndexPath *indexPath = nil;
NSInteger i = 0;
while (indexPath == nil) {
targetCenter = CGPointMake(originalTargetContentOffset.x + CGRectGetWidth(self.collectionView.bounds)/2 + 10*i, CGRectGetHeight(self.collectionView.bounds) / 2);
indexPath = [self.collectionView indexPathForItemAtPoint:targetCenter];
i++;
}
self.selectedIndex = indexPath;
//这里用attributes比用cell要好很多,因为cell可能因为不在屏幕范围内导致cellForItemAtIndexPath返回nil
UICollectionViewLayoutAttributes *attributes = [self.collectionView.collectionViewLayout layoutAttributesForItemAtIndexPath:indexPath];
if (attributes) {
*targetContentOffset = CGPointMake(attributes.center.x - CGRectGetWidth(self.collectionView.bounds)/2, originalTargetContentOffset.y);
} else {
DLog(@"center is %@; indexPath is {%@, %@}; cell is %@",NSStringFromCGPoint(targetCenter), @(indexPath.section), @(indexPath.item), attributes);
}
}
这样scrollView就会逐渐减速,最终停止在itemCenterOffsetWithOriginalTargetContentOffset方法算出来的位置上了,效果杠杠的~
本来以为这个方法没多少人知道,结果百度一搜,发现原来已经有大神写过详细的文章了(http://tech.glowing.com/cn/practice-in-uiscrollview/),这个就当记录一下吧
另外发现一个直接用NSObject就实现类似效果的库:https://github.com/nicklockwood/iCarousel 乍看之下没看懂。。。等有空再仔细研究
更新(2015-06-19)
原来UICollectionViewLayout已经提供了两个方法可以实现这个功能:
- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity;
- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset NS_AVAILABLE_IOS(7_0);
效果与上面的delegate方法完全一样,不过这个是UICollectionViewLayout的方法,需要在自己的layout子类里重载。
好处是:这样就不用再在viewController里写scrollView的delegate方法了,viewController更加简洁;跟布局相关的代码都转移到了layout的类中