iOS 图像查看器或使用最小行间距的 Collection View (启用分页)预览与照片应用程序完全相同

Question

我正在尝试开发与 iOS 照片应用程序完全一样的预览。如果我们从照片应用程序中选择任何图像，那么它将全屏显示(具有 imageview 和 aspect fit )。现在，如果我们滑动手指，那么下一个单元格将显示，同时我们可以看到单元格之间的行距。我想要像仅使用 Collection View 那样的确切效果。我不想使用任何库。在我的例子中，当我滚动到下一页时，我发现左侧的行间距如下图所示。

我尝试了很多解决方案，比如手动滚动到特定的 index path来自 scrollview delegate methods但行为并不顺利。

我得到的效果如下，

所以，当我离开手指图像时，应该设置 edge to edge .

我现在的代码是这样的

在viewdidload中，

    let layout = UICollectionViewFlowLayout()
    layout.minimumInteritemSpacing = 0.0
    layout.minimumLineSpacing = 20.0
    layout.itemSize = UIScreen.main.bounds.size
    layout.scrollDirection = UICollectionViewScrollDirection.horizontal

    collectionView.collectionViewLayout = layout
    collectionView.delegate = self
    collectionView.dataSource = self
    collectionView.showsVerticalScrollIndicator = false
    collectionView.showsHorizontalScrollIndicator = false
    collectionView.isPagingEnabled = true

我已经实现了必要的 datasource methods对于 Collection View !

总之我要edge to edge scrolling与 paging effect有minimum line space of 20 collectionview 中的单元格之间.就是这样!谢谢!

Answer 1

哦，太简单了!

我通过这样的技巧找到了解决方案，

我已将 Collection View 的宽度增加到比屏幕宽度大 20 像素。所以，我的 Collection View 的前导约束常量是 -10 尾随约束也是 -10 我已经设置了 的 sectionInset collectionview 的 flowlayout 到 (0, 10, 0, 10)。

所以我的 Storyboard设置就像，

我对 collectionview 的设置是这样的，

    let layout = UICollectionViewFlowLayout()
    layout.minimumInteritemSpacing = 0.0
    layout.minimumLineSpacing = 20.0
    layout.itemSize = UIScreen.main.bounds.size
    layout.scrollDirection = UICollectionViewScrollDirection.horizontal
    layout.sectionInset = UIEdgeInsetsMake(0, 10, 0, 10)   // added this

    collectionView.collectionViewLayout = layout
    collectionView.delegate = self
    collectionView.dataSource = self
    collectionView.showsVerticalScrollIndicator = false
    collectionView.showsHorizontalScrollIndicator = false
    collectionView.isPagingEnabled = true

就是这样!