web-dev-qa-db-ja.com

UIPageControlをUICollectionViewに接続する方法（Swift）

現在、UICollectionViewを使用して3つの画像を表示しています（各画像はセル全体にまたがっています）。 UICollectionViewの上に配置したUIPageControlもあります。発生させたいのは、UIPageControlに画像の数（この場合は3）と、ユーザーが現在表示している画像を表示させることです。私が目指しているのは、Instagramアプリの効果です。

この効果を達成するために現在使用している方法は、UICollectionViewのwillDisplay関数内にUIPageControlの更新を配置することです。

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

これにより、コレクションビューとページコントロールの間にページング効果が正しく接続されます。ただし、私が抱えている問題は、最初の画像を表示しているにもかかわらず、ユーザーが3番目の画像を表示しているとUIPageControlが開始することです。

なぜこれが起こっているのか、この問題を修正する方法を知っていますか？

iosswiftuicollectionviewuipagecontrol
9
kbunarjo

まず、UIPageControlを使用してストーリーボードにUICollectionViewを追加し、それらをアウトレットとしてView Controllerに接続します。

@IBOutlet var pageControl: UIPageControl!
@IBOutlet var collectionView: UICollectionView!

numberOfItemsInSectionのUICollectionViewDataSourceメソッドを調整して、ページコントロールのカウントが常にコレクションビューのセルの数と等しくなるように設定します。

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

    let count = ...

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

    return count
}

最後に、UIScrollViewDelegateを使用して、UICollectionViewが停止するセルを確認できます。 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)
}

これは、UICollectionViewが実際には内部のUIScrollViewであるため可能です。

24
Callam

ステップ1コレクションビューとページコントロールの変数を作成する

@IBOutlet weak var collectionView: UICollectionView!
@IBOutlet var pageControl:UIPageControl!

ステップ2ページコントロールのページ数を設定する

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

*ステップ 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)
            }
}

注：これは、水平方向に表示されるコレクションビュー用で、垂直方向にはメソッドを変更します。

テスト済みSwift 4。

10
Ariel Antonio Fundora