以分頁模式製作中心單元

Question

我創建了UICollectionView，其中horizontal也啓用了paging模式。現在我想讓屏幕中的每個單元都能看到下一個/ prev幻燈片的邊緣。

這裏是我的UICollectionView：

let collectionViewCardsSlider: UICollectionView = { 

     let collectionMargin = CGFloat(16) 
     let itemSpacing = CGFloat(10) 
     let itemHeight = CGFloat(168) 
     var itemWidth = UIScreen.main.bounds.width - collectionMargin * 2.0 

     let layout = UICollectionViewFlowLayout() 
     layout.scrollDirection = .horizontal 
     layout.minimumLineSpacing = itemSpacing 
     layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0) 
     layout.itemSize = CGSize(width: itemWidth, height: itemHeight) 
     layout.headerReferenceSize = CGSize(width: collectionMargin, height: 0) 
     layout.footerReferenceSize = CGSize(width: collectionMargin, height: 0) 

     let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout) 
     collectionView.isPagingEnabled = true 
     collectionView.showsHorizontalScrollIndicator = false 
     collectionView.decelerationRate = UIScrollViewDecelerationRateFast 
     collectionView.backgroundColor = .clear 
     return collectionView 
    }() 

這裏是預覽：

正如你可以看到只有第一和最後一個項目是在中心。但我想做的事情是這樣的：

我怎樣才能做到這一點，也什麼是錯在我的代碼？

非常感謝。

Answer 1

嘗試改變類的FlowLayout和禁用分頁：

let collectionViewCardsSlider: UICollectionView = { 

    let collectionMargin = CGFloat(16) 
    let itemSpacing = CGFloat(10) 
    let itemHeight = CGFloat(168) 
    var itemWidth = UIScreen.main.bounds.width - collectionMargin * 2.0 

    let layout = CenterCellCollectionViewFlowLayout() 
    layout.scrollDirection = .horizontal 
    layout.minimumLineSpacing = itemSpacing 
    layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0) 
    layout.itemSize = CGSize(width: itemWidth, height: itemHeight) 
    layout.headerReferenceSize = CGSize(width: collectionMargin, height: 0) 
    layout.footerReferenceSize = CGSize(width: collectionMargin, height: 0) 

    let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout) 
    collectionView.isPagingEnabled = false 
    collectionView.showsHorizontalScrollIndicator = false 
    collectionView.decelerationRate = UIScrollViewDecelerationRateFast 
    collectionView.backgroundColor = .clear 
    return collectionView 
}() 

和：

class CenterCellCollectionViewFlowLayout: UICollectionViewFlowLayout { 

    var mostRecentOffset : CGPoint = CGPoint() 

    override func targetContentOffset(forProposedContentOffset proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint { 

     if velocity.x == 0 { 
      return mostRecentOffset 
     } 

     if let cv = self.collectionView { 

      let cvBounds = cv.bounds 
      let halfWidth = cvBounds.size.width * 0.5; 


      if let attributesForVisibleCells = self.layoutAttributesForElements(in: cvBounds) { 

       var candidateAttributes : UICollectionViewLayoutAttributes? 
       for attributes in attributesForVisibleCells { 

        // == Skip comparison with non-cell items (headers and footers) == // 
        if attributes.representedElementCategory != UICollectionElementCategory.cell { 
         continue 
        } 

        if (attributes.center.x == 0) || (attributes.center.x > (cv.contentOffset.x + halfWidth) && velocity.x < 0) { 
         continue 
        } 
        candidateAttributes = attributes 
       } 

       // Beautification step , I don't know why it works! 
       if(proposedContentOffset.x == -(cv.contentInset.left)) { 
        return proposedContentOffset 
       } 

       guard let _ = candidateAttributes else { 
        return mostRecentOffset 
       } 
       mostRecentOffset = CGPoint(x: floor(candidateAttributes!.center.x - halfWidth), y: proposedContentOffset.y) 
       return mostRecentOffset 

      } 
     } 

     // fallback 
     mostRecentOffset = super.targetContentOffset(forProposedContentOffset: proposedContentOffset) 
     return mostRecentOffset 
    } 


}