UICollectionView水平滚动

Question

我有一个水平滚动UICollectionView。这里是我的collectionView：

fileprivate(set) lazy var collectionView: UICollectionView = { 
     let width = UIScreen.main.bounds.width.multiplied(by: 0.9) 
     let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout() 
     layout.itemSize = CGSize(width: width, height: 50) 

     layout.sectionInset = UIEdgeInsets(top: 20, left: 20, bottom: 10, right: 20) 
     layout.scrollDirection = .horizontal 
     layout.minimumLineSpacing = 20 

     let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: self.frame.width, height: 50), collectionViewLayout: layout) 
     collectionView.translatesAutoresizingMaskIntoConstraints = false 
     collectionView.backgroundColor = .red 
     collectionView.isPagingEnabled = true 
     return collectionView 
    }() 

，它看起来像：

正如你看到的我有collectionView.isPagingEnabled = true的代码，因为我希望页面效果。那么，我想做到的，是让项目看起来像在其他每一页上面（20间隔上左和右）的图片，但到目前为止，我得到：

任何想法/提示如何达到理想的行为？

Answer 1

下面是我在测试项目中使用的UICollectionViewDelegateFlowLayout以实现您想要的功能。

func collectionView(_ collectionView: UICollectionView, 
        layout collectionViewLayout: UICollectionViewLayout, 
        sizeForItemAt indexPath: IndexPath) -> CGSize { 
    return CGSize(width: UIScreen.main.bounds.width.multiplied(by: 0.9), height: 50.0) 
} 

// item spacing = vertical spacing in horizontal flow 
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat { 
    return (UIScreen.main.bounds.width.multiplied(by: 0.1)) 
} 

// line spacing = horizontal spacing in horizontal flow 
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat { 
    return (UIScreen.main.bounds.width.multiplied(by: 0.1)) 
} 

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets { 
    return UIEdgeInsets(top: 0, left: (UIScreen.main.bounds.width.multiplied(by: 0.1)/2.0), bottom: 0, right: (UIScreen.main.bounds.width.multiplied(by: 0.1)/2.0)) 
} 

与您的代码就好像在说：

fileprivate(set) lazy var collectionView: UICollectionView = { 
    let width = UIScreen.main.bounds.width.multiplied(by: 0.9) 
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout() 
    layout.itemSize = CGSize(width: width, height: 50) 

    layout.sectionInset = UIEdgeInsets(top: 20, left: UIScreen.main.bounds.width.multiplied(by: 0.1)/2.0, bottom: 10, right: UIScreen.main.bounds.width.multiplied(by: 0.1)/2.0) 
    layout.scrollDirection = .horizontal 
    layout.minimumLineSpacing = UIScreen.main.bounds.width.multiplied(by: 0.1) 
    layout.minimumInteritemSpacing = UIScreen.main.bounds.width.multiplied(by: 0.1) // or any value you want 

    let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: self.frame.width, height: 50), collectionViewLayout: layout) 
    collectionView.translatesAutoresizingMaskIntoConstraints = false 
    collectionView.backgroundColor = .red 
    collectionView.isPagingEnabled = true 
    return collectionView 
}()