Question

我有一个包含2个项目的CollectionView。

CollectionView有pagingEnabled，我想循环显示它们：

[1] 2 - ＆gt; [2] 1 - ＆gt; [1] 2 - ＆gt; [2] 1

是否可以使用CollectionView

执行此操作

我的代码：

extension HomeViewController: UICollectionViewDelegateFlowLayout {
    func configureHeaderView() {

        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)

        headerView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: headerHeight), collectionViewLayout: layout)
        headerView?.backgroundColor = .blue
        headerView?.isPagingEnabled = true
        headerView?.isUserInteractionEnabled = true

        headerView?.rx.setDelegate(self).addDisposableTo(disposeBag)
        let nib = UINib(nibName: BannerCollectionViewCell.reuseIdentifier, bundle: nil)
        headerView?.register(nib, forCellWithReuseIdentifier: BannerCollectionViewCell.reuseIdentifier)
        headerView?.showsHorizontalScrollIndicator = false

        tableView.tableHeaderView = headerView

        if let headerView = headerView {
            self.bannerItems.asObservable().bindTo(headerView.rx.items(cellIdentifier: BannerCollectionViewCell.reuseIdentifier, cellType: BannerCollectionViewCell.self)) {
                row, banner, cell in
                cell.banner = banner
                }.addDisposableTo(disposeBag)
        }
    }

    // MARK: UICollectionViewDelegateFlowLayout
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: UIScreen.main.bounds.width, height: headerHeight)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }
}

Answer 1

利用UICollectionView的 scrollToItemAtIndexPath 方法将collectionView移回到第一个项目（如果它到达终点并且用户向右滑动）。如果用户从第一个项目向左滑动，则将collectionView移回最后一个项目。您应该将动画属性设置为 false

func scrollViewWillBeginDecelerating(_ scrollView: UIScrollView) {

        // Calculate where the collection view should be at the right-hand end item
        let offsetRight = collectionView.frame.size.width * CGFloat(yourDataArray.count)

        if scrollView.contentOffset.x == offsetRight {

            // user is scrolling to the right from the last item to the 'fake' item 1.
            // reposition offset to show the 'real' item 1 at the left-hand end of the collection view

            let newIndexPath = IndexPath(row: 1, section: 0)

            collectionView.scrollToItem(at: newIndexPath, at: .left, animated: false)

        } else if scrollView.contentOffset.x == 0 {

            // user is scrolling to the left from the first item to the fake 'item N'.
            // reposition offset to show the 'real' item N at the right end of the collection view

            let newIndexPath = IndexPath(row: (yourDataArray.count-2), section: 0)

            collectionView.scrollToItem(at: newIndexPath, at: .left, animated: false)
        }
    }

CollectionView循环显示项目分页

1 个答案: