如何获得 UICollectionView 的虚线页面指示器？

Question

我有一个UICollectionView具有以下设置，

public CollectionView(CollectionLayout layout) : base(CGRect.Empty, layout)
{
    RegisterClassForCell(typeof(CollectionCell), CollectionCell.CellIdentifier);
    CollectionViewLayout = layout;
    ShowsHorizontalScrollIndicator = false;
    PagingEnabled = true;
}

该CollectionViewLayout是，

public CollectionLayout()
{
    ScrollDirection = UICollectionViewScrollDirection.Horizontal;
    MinimumInteritemSpacing = 0f;
    MinimumLineSpacing = 0f;
    ItemSize = new CGSize(UIScreen.MainScreen.Bounds.Width, 200f);
}

所以 CollectionView 中的单元格被拉伸，以便一个单元格填充 CollectionView。CollectionView 只能水平滚动。

现在我想要一个虚线页面指示器而不是 CollectionView 的滚动条。无论如何我可以正确地实现这一目标吗？

Answer 1

2020 年完全正确的方法：

只需UIPageControl在情节提要中添加一个。

把它放在你的收藏视图下面（即，在上面可见）。

链接到它...

class YourVC: UIViewController, UICollectionViewDelegate,
         UICollectionViewDataSource,
         UICollectionViewDelegateFlowLayout {
    
    @IBOutlet var collectionView: UICollectionView!
    @IBOutlet var dots: UIPageControl!

只需添加一个将其水平居中的约束到集合视图，并添加一个约束来对齐底部。

这将给出标准的定位/间距。

（当然，您可以将点放在您想要的任何位置，但这是标准。）

提示 1 - 颜色

奇怪的是，点的默认颜色是 .. 清晰！

所以将它们设置为灰色/黑色或任何你想要的：

或者你可以在代码中做到这一点：

override func viewDidLoad() {
    super.viewDidLoad()
    dots.pageIndicatorTintColor = .systemGray5
    dots.currentPageIndicatorTintColor = .yourCorporateColor
}

下一个。在numberOfItemsInSection，添加...

func collectionView(_ collectionView: UICollectionView,
              numberOfItemsInSection section: Int) -> Int {
    
    let k = ... yourData.count, or whatever your count is
    
    dots.numberOfPages = k
    return k
}

提示 2 - 事实上，不要使用减速调用

添加此代码：

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    dots.currentPage = Int(
        (collectionView.contentOffset.x / collectionView.frame.width)
            .rounded(.toNearestOrAwayFromZero)
        )
    )
}

您只需在“scrollViewDidScroll”中设置页面。

实际上

•不要使用 scrollViewWillBeginDecelerating

•不要使用 scrollViewDidEndDecelerating。

要了解原因：尝试使用其中任何一个调用。现在快速浏览许多页面。注意它不能正常工作。

只需scrollViewDidScroll用于正确、完美的结果，包括初始化。

提示 3 -不要使用 Int 除法 - 它完全改变了行为并且是完全错误的。

你会经常看到这个示例代码：

// wrong, do not do this
dots.currentPage = Int(collectionView.contentOffset.x) /
                     Int(collectionView.frame.width)
// wrong, do not do this

那个经常看到的示例代码是完全错误的。

如果您尝试这样做，当您浏览页面时，它会导致点以非标准方式“跳跃”。

最好的解释是试试看。

对于通常的、正确的、Apple 风格的行为，当您滚动或浏览页面时，代码是：

    dots.currentPage = Int(
        (collectionView.contentOffset.x / collectionView.frame.width)
        .rounded(.toNearestOrAwayFromZero)
    )

最后一个例子...