UICollectionView 自定义水平分页布局答案

【问题标题】：UICollectionView custom horizontal paging layoutUICollectionView 自定义水平分页布局
【发布时间】：2016-10-04 20:02:13
【问题描述】：

[![collectionview 示例][1]][1]

我正在尝试使用集合视图来模拟这种行为。我开始使用这种方法，它让我更接近。尽管随着我在水平分页 CollectionView 上越来越向右滑动，内容也越来越向左移动。单元格之间的间距也关闭。我认为它需要自定义布局，但不确定。

    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {

    return CGSize(width: collectionView.frame.width - 20, height: collectionView.frame.height - 20)

}

【问题讨论】：

这里的实际问题是什么？

标签： ios uicollectionviewcell uicollectionviewlayout

【解决方案1】：

这取决于三个因素 1) 剖面插图 2) 单元格间距 3) 单元格大小

每个人的任何改变都必须改变其他人适合你的情况

1) 用 20 设置左右

2) 将单元格间距设置为 10

func collectionView(collectionView: UICollectionView,
    layout collectionViewLayout: UICollectionViewLayout,
    minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat {
        return 10
}
func collectionView(collectionView: UICollectionView, layout
    collectionViewLayout: UICollectionViewLayout,
    minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat {
        return 10
}

3) 设置单元格大小

func collectionView(collectionView: UICollectionView,
    layout collectionViewLayout: UICollectionViewLayout,
    sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
        return CGSize(width: collectionView.frame.width / 1.15 ,height: collectionView.frame.height)
}

4) 这将使单元格在屏幕中居中

func scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {

    let pageWidth:CGFloat = scrollView.frame.width / 1.15 + cellSpacing ;

    let currentOffset:CGFloat = scrollView.contentOffset.x;
    let targetOffset:CGFloat = targetContentOffset.memory.x
    var newTargetOffset:CGFloat = 0;

    if targetOffset > currentOffset
    {
        newTargetOffset = ceil(currentOffset / pageWidth) * pageWidth;
    }
    else
    {
        newTargetOffset = floor(currentOffset / pageWidth) * pageWidth;
    }

    if newTargetOffset < 0
    {
        newTargetOffset = 0
    }
    else if newTargetOffset > scrollView.contentSize.width
    {
    newTargetOffset = scrollView.contentSize.width;
    }

    targetContentOffset.memory.x = currentOffset

    scrollView.setContentOffset(CGPointMake(newTargetOffset, 0), animated: true)

}

【讨论】：

stackoverflow.com/questions/19301762/…
你是怎么想出 1.15 的？
大约是 collectionView 宽度的 85%
感谢它现在运行良好。我现在唯一要做的就是当你在单元格上滑动时，它们会逐渐向左移动。文本标签不完全可见，因为一半的单元格被隐藏了。关于如何在同一位置重新加载单元格的任何提示，还是与整个设置相反？
请检查已编辑的答案我已将解决方案添加到向左移动的单元格

【解决方案2】：

我改变了一点@Mohamed 的解决方案，它对我来说非常有效：

func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {

    let cellSpacing: CGFloat = self.collectionView(self.collectionView, layout: self.collectionView.collectionViewLayout, minimumInteritemSpacingForSectionAt: 0)
    let pageWidth: CGFloat = self.pageWidth + cellSpacing

    let currentOffset = scrollView.contentOffset.x
    let targetOffset = targetContentOffset.pointee.x
    targetContentOffset.pointee.x = currentOffset

    var pageNumber = 0
    if targetOffset > currentOffset {
        pageNumber = Int(ceil(currentOffset / pageWidth))
    }
    else {
        pageNumber = Int(floor(currentOffset / pageWidth))
    }

    let indexPath = IndexPath(row: pageNumber, section: 0)
    self.collectionView.scrollToItem(at: indexPath, at: UICollectionView.ScrollPosition.centeredHorizontally, animated: true)
}

【讨论】：