用Swift创build一个分页UICollectionView

我试图创build一个UICollectionView与分页,并且每个项目的最大宽度是250点,我已经设法创build它,但我有2个问题:第一个项目开始不应该是,但在更多的空间开始当我试图刷卡时,总会有东西不让我滑动。

这是它的样子:

video链接

这是我的代码:

CenterCellCollectionFlowLayout.swift

class CenterCellCollectionViewFlowLayout: UICollectionViewFlowLayout { override func layoutAttributesForElementsInRect(rect: CGRect) -> [AnyObject]? { var attributesToReturn:[UICollectionViewLayoutAttributes] = super.layoutAttributesForElementsInRect(rect) as! [UICollectionViewLayoutAttributes] for var i = 0 ; i < attributesToReturn.count ; i++ { var currentLayoutAttributes: UICollectionViewLayoutAttributes = attributesToReturn[i] var maximumSpacing: CGFloat = 50 let origin: CGFloat if i - 1 >= 0 { let previousLayoutAttributes = attributesToReturn[i - 1] origin = previousLayoutAttributes.frame.maxX } else { origin = 0 } if origin + maximumSpacing + currentLayoutAttributes.frame.size.width < self.collectionViewContentSize().width { var frame: CGRect = currentLayoutAttributes.frame frame.origin.x = origin + maximumSpacing currentLayoutAttributes.frame = frame } } return attributesToReturn } override func targetContentOffsetForProposedContentOffset(proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint { if let cv = self.collectionView { let cvBounds = cv.bounds let halfWidth = cvBounds.size.width * 0.5; let proposedContentOffsetCenterX = proposedContentOffset.x + halfWidth; if let attributesForVisibleCells = self.layoutAttributesForElementsInRect(cvBounds) as? [UICollectionViewLayoutAttributes] { var candidateAttributes : UICollectionViewLayoutAttributes? for attributes in attributesForVisibleCells { // == Skip comparison with non-cell items (headers and footers) == // if attributes.representedElementCategory != UICollectionElementCategory.Cell { continue } if let candAttrs = candidateAttributes { let a = attributes.center.x - proposedContentOffsetCenterX let b = candAttrs.center.x - proposedContentOffsetCenterX if fabsf(Float(a)) < fabsf(Float(b)) { candidateAttributes = attributes; } } else { // == First time in the loop == // candidateAttributes = attributes; continue; } } return CGPoint(x : candidateAttributes!.center.x - halfWidth, y : proposedContentOffset.y); } } // Fallback return super.targetContentOffsetForProposedContentOffset(proposedContentOffset) } } 

MainViewController.swift

 class MainViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout { @IBOutlet weak var collectionView: UICollectionView! @IBOutlet weak var collectionViewFlowLayout: CenterCellCollectionViewFlowLayout! var collectionObjects: NSMutableArray? private let reuseIdentifier = "CollectionViewCell" override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view. self.collectionView.registerClass(UICollectionViewCell.self, forCellWithReuseIdentifier: reuseIdentifier) } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) { } func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as! UICollectionViewCell cell.backgroundColor = UIColor.greenColor() // Configure the cell return cell } func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 10 } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets { return UIEdgeInsetsMake(0, 0, 0, 0) } func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize { return CGSizeMake(250, 250) } } 

提前致谢

所以我找出如何做到这一点。

首先创build一个自定义的UICollectionViewFlowLayout并添加这个覆盖这个方法:

 override func targetContentOffsetForProposedContentOffset(proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint { if let cv = self.collectionView { let cvBounds = cv.bounds let halfWidth = cvBounds.size.width * 0.5; let proposedContentOffsetCenterX = proposedContentOffset.x + halfWidth; if let attributesForVisibleCells = self.layoutAttributesForElementsInRect(cvBounds) as? [UICollectionViewLayoutAttributes] { var candidateAttributes : UICollectionViewLayoutAttributes? for attributes in attributesForVisibleCells { // == Skip comparison with non-cell items (headers and footers) == // if attributes.representedElementCategory != UICollectionElementCategory.Cell { continue } if let candAttrs = candidateAttributes { let a = attributes.center.x - proposedContentOffsetCenterX let b = candAttrs.center.x - proposedContentOffsetCenterX if fabsf(Float(a)) < fabsf(Float(b)) { candidateAttributes = attributes; } } else { // == First time in the loop == // candidateAttributes = attributes; continue; } } return CGPoint(x : candidateAttributes!.center.x - halfWidth, y : proposedContentOffset.y); } } // Fallback return super.targetContentOffsetForProposedContentOffset(proposedContentOffset) } 

然后在你实现UICollectionView的类上做这样的事情:

  let collectionViewLayout: CenterCellCollectionViewFlowLayout = CenterCellCollectionViewFlowLayout() collectionViewLayout.itemSize = CGSizeMake(self.itemSize, self.itemSize) collectionViewLayout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0) collectionViewLayout.minimumInteritemSpacing = 0 collectionViewLayout.minimumLineSpacing = self.itemSpacing collectionViewLayout.scrollDirection = UICollectionViewScrollDirection.Horizontal var collectionView: UICollectionView = UICollectionView(frame: self.collectionContainer.bounds, collectionViewLayout: collectionViewLayout) collectionView.delegate = self; collectionView.dataSource = self; collectionView.backgroundColor = UIColor.redColor() collectionView.registerClass(LevelsCustomCell.self, forCellWithReuseIdentifier: reuseIdentifier) collectionView.registerNib(UINib(nibName: reuseIdentifier, bundle: nil), forCellWithReuseIdentifier: reuseIdentifier) self.collectionContainer.addSubview(collectionView) 

这就是魅力。