具有水平模式和PagingEnabled的UICollectionView中的中心单元格

时间:2018-12-26 18:31:32

标签: swift uiscrollview uicollectionview uicollectionviewcell

我对UICollectionView有疑问。我的单元格比集合视图的宽度短,这就是为什么滚动后我无法使单元格居中的原因。我试图在这里找到任何可行的解决方案,但没有效果。我的假设是像在应用商店中那样进行收藏。

代码如下:

func prepareCollectionView() {
    collectionView.delegate = self
    collectionView.dataSource = self
    collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: cellID)
    collectionView.showsVerticalScrollIndicator = false
    collectionView.showsHorizontalScrollIndicator = false
    collectionView.isPagingEnabled = ture
    if let layout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
        layout.scrollDirection = .horizontal
        layout.sectionInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
    }
}

func scrollTo(_ page: Int) -> CGPoint {
    let cellWidth = collectionView.bounds.width - 20 * 2
    let nextCellWidth =  CGFloat(page) * (cellWidth + 10)
    return CGPoint(x: nextCellWidth, y: 0)
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 10
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellID, for: indexPath)
    cell.backgroundColor = .blue
    cell.layer.cornerRadius = 20
    return cell
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: collectionView.bounds.width - 20 * 2, height: collectionView.bounds.height)
}

func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
    let currentXPosition = scrollView.contentOffset.x
    let cellWidth = collectionView.bounds.width - 20 * 2
    let isNextPage = currentXPosition.truncatingRemainder(dividingBy: cellWidth) > cellWidth / 2 ? true : false
    let currentPage = isNextPage ? Int(currentXPosition / cellWidth) + 1 : Int(currentXPosition / cellWidth)
    scrollView.scrollRectToVisible(CGRect(origin: scrollTo(currentPage), size: CGSize(width: 0, height: 0)), animated: true)
}

现在看起来像这样:

enter image description here

如果我可以征求一些建议,如何使我的牢房居中就好了:)

WORKING SOLUTION 根据@canister_exister,我创建了一个自定义UICollectionViewFlowLayout,看起来像这样:

class CustoFlowLayout: UICollectionViewFlowLayout {

//MARK: - Variables

private var isSetupDone = false

override func prepare() {
    super.prepare()
    if !isSetupDone {
        setup()
        isSetupDone.toggle()
    }
}

private func setup() {
    scrollDirection = .horizontal
    minimumLineSpacing = 10
    guard let collectionView = collectionView else { return }
    itemSize = CGSize(width: collectionView.frame.width - 40, height: collectionView.frame.height)
    collectionView.decelerationRate = UIScrollView.DecelerationRate.fast
    sectionInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)

}

override func targetContentOffset(forProposedContentOffset proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint {
    guard let collectionView = collectionView else { return .zero }
    let layoutAttributes = layoutAttributesForElements(in: collectionView.bounds)
    let centerOffset = collectionView.bounds.size.width / 2
    let offsetWithCenter = proposedContentOffset.x + centerOffset
    guard let contestAttribute = layoutAttributes else { return .zero }
    let att = contestAttribute.sorted(by: { abs($0.center.x - offsetWithCenter) < abs($1.center.x - offsetWithCenter) }).first ?? UICollectionViewLayoutAttributes()
    return CGPoint(x: att.center.x - centerOffset, y: 0)
}
}

它正常工作!

0 个答案:

没有答案