如何将UIPageControl连接到UICollectionView(Swift)

kbu*_*rjo 9 uipagecontrol ios uicollectionview swift

我目前正在使用UICollectionView来显示3个图像(每个图像跨越整个单元格).我还有一个UIPageControl,我放在UICollectionView的顶部.我想要发生的是让UIPageControl显示图像的数量(在这种情况下是3),以及用户当前正在查看的图像.我想要的效果是Instagram应用程序的效果.

我目前用来实现这种效果的方法是将UIPageControl的更新放在UICollectionView的willDisplay函数中,如下所示:

func collectionView(_ collectionView: UICollectionView, willDisplay cell: UICollectionViewCell, forItemAt indexPath: IndexPath) {
    pictureDots.currentPage = indexPath.item
}
Run Code Online (Sandbox Code Playgroud)

这样可以正确地连接集合视图和页面控件之间的分页效果.但是,我遇到的问题是UIPageControl开始说用户在第三个图像上,即使它正在显示第一个图像.

有谁知道为什么会这样,以及如何解决这个问题?

Cal*_*lam 25

首先将您UIPageControl的故事板添加到故事板中UICollectionView,然后将它们作为插座连接到视图控制器.

@IBOutlet var pageControl: UIPageControl!
@IBOutlet var collectionView: UICollectionView!
Run Code Online (Sandbox Code Playgroud)

调整numberOfItemsInSection方法 UICollectionViewDataSource以将页面控件的计数设置为始终等于集合视图中的单元格数.

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

    let count = ...

    pageControl.numberOfPages = count
    pageControl.isHidden = !(count > 1)

    return count
}
Run Code Online (Sandbox Code Playgroud)

最后,使用UIScrollViewDelegate,我们可以告诉UICollectionView停止哪个单元格.如果您不使用a UICollectionViewController,则可能必须添加委托协议.

func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {

    pageControl?.currentPage = Int(scrollView.contentOffset.x) / Int(scrollView.frame.width)
}

func scrollViewDidEndScrollingAnimation(_ scrollView: UIScrollView) {

    pageControl?.currentPage = Int(scrollView.contentOffset.x) / Int(scrollView.frame.width)
}
Run Code Online (Sandbox Code Playgroud)

这是可能的,因为UICollectionView实际上是一个UIScrollView引擎盖下.


Ari*_*ora 11

步骤1 为Collection View和Page Control创建变量

@IBOutlet weak var collectionView: UICollectionView!
@IBOutlet var pageControl:UIPageControl!     
Run Code Online (Sandbox Code Playgroud)

步骤2设置页面控制的页数

override func viewDidLoad() {
    super.viewDidLoad()         
    self.pageControl.numberOfPages = procedures.count
    //Set the delegate
    self.collectionView.delegate = self
}
Run Code Online (Sandbox Code Playgroud)

*步骤3在scrollViewDidScroll函数中计算集合单元格的宽度和当前页面的索引.

    extension YourCollectionVC: UICollectionViewDataSource, UICollectionViewDelegate {
            override func scrollViewDidScroll(_ scrollView: UIScrollView) {
                let witdh = scrollView.frame.width - (scrollView.contentInset.left*2)
                let index = scrollView.contentOffset.x / witdh
                let roundedIndex = round(index)
                self.pageControl?.currentPage = Int(roundedIndex)
            }
}
Run Code Online (Sandbox Code Playgroud)

注意:这是针对水平显示的集合视图,对于垂直方向更改方法.

在swift 4中测试过.